一、资源引入
<body>
<p id="app"></p>
<script src="https://cdn.bootcss.com/vue/2.5.2/vue.min.js"></script>
<script src="https://cdn.bootcss.com/vue-router/3.0.1/vue-router.min.js"></script>
<script src="https://cdn.bootcss.com/vuex/3.0.1/vuex.min.js"></script>
</body>
二、添加配置 在bulid/webpack.base.conf.js文件中,增加externals,将引用的外部模块导入,如下:
注意:格式为 ‘aaa’ : ‘bbb’, 其中,aaa表示要引入的资源的名字,bbb表示该模块提供给外部引用的名字,由对应的库自定。例如,vue为Vue,vue-router为VueRouter.
module.exports = {
entry: {
app: './src/main.js'
},
externals:{
'vue': 'Vue',
'vue-router': 'VueRouter',
'vuex':'Vuex'
}
三、去掉原有的引用
去掉import,如:
// import Vue from 'vue'
// import Router from 'vue-router'
去掉Vue.use(XXX),如: 有些情况下可以不需要去除
// Vue.use(Router)