vue瘦身:使用cdn外链依赖
一、资源引入
<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)
