（1）在index.html文件中引入百度地图
（2）在webpack.base.conf.js文件内添加external选项，在module.exports内部，和entry平级；
externals: {
"BMap": "BMap"
},
（3）添加地图组件BMapComponent.vue，这里主要注意两点：
a）使用BMap的时候需要import (经过本人测试，如果不用import会提示BMap未定义)
b）注意一定要给bmap的div设置高度，否则会看不见
该组件的代码如下
.anchorBL { display:none }
如果直接在实例生命周期的created中调用this.ready()方法将无法加载地图，我在index.html中加入了一个id为allmap的div，当我调用该组件时，该组件上的div没有显示地图，而index.html中id为allmap的div里却显示了地图，经过测试我猜测是因为该组件还没有初始化完毕，导致new BMap.Map('allmap')时实例化地图对象失败。所以应该在实例生命周期的mounted中调用this.ready()方法。
实例生命周期参见：https://cn.vuejs.org/v2/guide/instance.html
（4） 在父组件中使用
a）引入 import BMapComponent from './components/BMapComponent.vue'
b）在template中增加标签
以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持考高分网。
