Vue中引入高德地图

---

主题列表：juejin, github, smartblue, cyanosis, channing-cyan, fancy, hydrogen, condensed-night-purple, greenwillow, v-green, vue-pro

贡献主题：https://github.com/xitu/juejin-markdown-themes

theme: smartblue

highlight: monokai-sublime

一、在public——>index.html里引入

```html

``` 注：这个在高德官网里复制。

二、然后在vue.config.js里面配置一下，否则会报错，报AMap未定义。

javascript module.exports = { configureWebpack: { externals: { AMap: "window.AMap", AMapUI: 'window.AMapUI' } } };

三、使用

住：各种需要看文档、 api文档。 ```javascript

{{text}}

```

四、在vue页面或者组件里面使用，推荐这样，可以减少高德地图的资源加载，优化性能

1、下载依赖包： npm i webpack-require-http --save 注：也要取消vue.config.js中的eslint代码格式检查，在vue.config.js中的配置如下： javascript module.exports = { lintOnSave: false, configureWebpack: { //引入webpack-require-http，可以让其在文件里，进行资源请求 externals: [ require('webpack-require-http') ] }, } 2、使用(封装成了一个组件,可以传入多个坐标) ```javascript

```