webpack內置模塊ProvidePlugin
阿新 • • 發佈:2018-12-05
span spa 使用 將不 console ase gin new 所有
webpack配置ProvidePlugin後,在使用時將不再需要import和require進行引入,直接使用即可。
使用方法:
在webpack.dev.conf.js和webpack.prod.conf.js中添加
1 plugins: [ 2 ... 3 new webpack.ProvidePlugin({ 4 ‘api‘: ‘api‘ 5 }), 6 ... 7 ]
使用場景:
將所有接口調用方法放在 src/api/index.js中,在組件中無需import即可調用
相關配置:
在webpack.base.conf.js中添加
1 resolve: {2 extensions: [‘.js‘, ‘.vue‘, ‘.json‘], 3 alias: { 4 ‘vue$‘: ‘vue/dist/vue.esm.js‘, 5 ‘@‘: resolve(‘src‘), 6 ‘api‘: resolve(‘src/api/index.js‘), 7 } 8 },
在組件中使用:
1 ... 2 mounted() { 3 api.getData().then(res => { 4 this.items = res 5 }).catch(err => {6 console.log(err) 7 }) 8 }, 9 ...
webpack內置模塊ProvidePlugin