vue 使用amap-jsapi-loader加载高德地图

首先安装amap-jsapi-loader

npm i amap-jsapi-loader --save

然后在utils中创建amap.js,注意AMapKey是申请高德地图账号后，配置引用的key

import AMapLoader from '@amap/amap-jsapi-loader';
import {AMapKey} from './const-datas'

const install = (Vue) => {
	AMapLoader.load({
		key: AMapKey, // key
		plugins: ["AMap.Geocoder",'Map3D'], // 插件
		version:'2.0',
		Loca:{                // 是否加载 Loca， 缺省不加载
			"version": '2.0.0'  // Loca 版本，缺省 1.3.2
		},
	}).then((amap,b)=>{
		Vue.prototype.$Amap = amap
		window.Amap = amap
	}).catch(err=>{
		throw(new Error('加载高德地图失败：'+err,))
	})
}

export default {
	install,
}

然后在main.js中引入

import Vue from 'vue'
import Amap from './utils/amap.js'
Vue.use(Amap)