vue2 引用高德地图

https://lbs.amap.com  进去后按照提示注册登陆

 1.点击左侧应用管理-我的应用

 2. 点击右上角创建新应用    给新创建的应用添加key    提交后就有key和密钥两个重要的东西（项目需要）

3.在项目的根目录里cmd  npm方式输入命令行：

npm i @amap/amap-jsapi-loader --save 

4.在main.js 全局引入

import AMapLoader from "@amap/amap-jsapi-loader"; 


Vue.config.productionTip = false;


// 初始化vue-amap
AMapLoader.load({
  'key': '自己申请的key',
  'version': '2.0',
  'plugins': ['AMap.Scale', 'AMap.GeoJSON']
}).then((AMap) => {
  // Vue.use(AMap)
  Vue.prototype.$AMap = AMap
})

5.创建页面

6.在.eslintrc.js中设置

module.exports = {
  globals:{
    AMap:true
  }
}

这样就可以显示地图  。

如果显示空白背景 ，并且没有报错  ，检查是否使用了mock.js （可能会导致冲突），去除mockjs相关依赖即可。