记录在vue项目中使用vue-amap和原生高德地图api时产生的兼容问题

一、前提

        项目开发中，需要用到vue-amap插件的情况，但此时项目里的全局引用已经引用了高德地图2.0版本，而vue-amap只支持1.4.15（该插件作者已经很久没有维护了，不必要情况建议使用原生高德地图或者是amap-vue，注意vue-amap和amap-vue是两款插件）会产生必然的兼容问题

vue-amap文档：vue-amap文档

amap-vue文档：介绍 | AMap-Vue

二、解决方式

        首先，如果直接用1.14.15版本覆盖到index.html的script标签引入的话，会导致项目其他使用高德地图2.0api的模块无法使用。直接跟着vue-amap文档步骤，在main.js中引入VueAMap插件，也会被覆盖。

        所以，可以借用AMapLoader插件进行重置，并重新设置版本，此方法只要是高德地图使用时版本冲突都可以解决

解决流程：

（1）首先需要先安装依赖：

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

（2）然后便是，在你所需要重置版本的模块的地图文件中，引入

import AMapLoader from '@amap/amap-jsapi-loader'

（3）然后便是重置

AMapLoader.reset()

（4）重置完设定你的需要引入的版本的对应可以即可

AMapLoader.load({
  "key": "***********", // 申请好的Web端开发者Key，首次调用 load 时必填
  "version": "1.4.15", // 指定要加载的 JSAPI 的版本，缺省时默认为 1.4.15
  "plugins": ['AMap.Scale'], // 需要使用的的插件列表，如比例尺'AMap.Scale'等
})

(5)注意，由于我是在vue-amap中进行的重置，AMapLoader.load({}).then后面的内容不需要进行填写都是封装好的

最后的最后！！谢谢网络上牛人们封装的插件，但是作为开发者的我们建议尽量避免使用已经很久没有维护的插件！这一切都是血的教训