vue使用高德地图

index.html引入标签

<script type="text/javascript" src="http://webapi.amap.com/maps?v=1.4.4&key=你申请的key"></script> 

vue.config.js(需自己创建，根目录下)

module.exports = {
  devServer: {
    port: 57103 // 端口号配置
  },
  configureWebpack: {
    externals: {
      'AMap': 'AMap' // 高德地图配置
    }
  }
}

使用该功能的组件中引入：

<div id="container" style="width:500px; height:300px"></div>

    init () {
      let map = new AMap.Map('container', {
        center: [116.397428, 39.90923],
        resizeEnable: true,
        zoom: 10
      })
    }

 

标签：vue,地图,AMap,引入,根目录,高德
来源： https://www.cnblogs.com/-llf/p/15825146.html