ProvidePlugin:自动加载模块,而不必到处 import 或 require 。点击查看官方文档
使用方法:
配置 webpack.config.js
文件里 plugins
属性
new webpack.ProvidePlugin({
identifier: 'module-name'
// ...etc
});
示例用法:
new webpack.ProvidePlugin({
_: 'lodash'
});
配置完以后就可以在代码里直接使用 _
,而不再需要 import
了。
注意
:(如果不配置 eslint,浏览器就会报错:_
is not defined no-undef)
配置 ESLint 解决报错:
配置 package.json
里 eslintConfig
属性(或者在 .eslintrc.js
文件里进行配置 全局变量 globals
)
"eslintConfig": {
"globals": {
"_": true,
// ...etc.
// 注意package.json里不允许注释
}
}
针对 ES6 模块化 配置
对于 ES2015 模块的 default export,你必须指定模块的 default 属性:
语法:
new webpack.ProvidePlugin({
identifier: ['module-name', 'property']
// ...etc.
});
示例:
new webpack.ProvidePlugin({
Vue: ['vue/dist/vue.esm.js', 'default']
});