webpack插件ProvidePlugin的使用方法和eslint配置

摘要：配置 webpack.config.js文件里 plugins 属性，配置完以后就可以在代码里直接使用 _ ，而不再需要 import；注意：(如果不配置eslint，浏览器就会报错：\\\\\\\'_\\\\\\\' is not defined no-undef）

配置 webpack.config.js文件里 plugins 属性

new webpack.ProvidePlugin({
  identifier: 'module-name',
  // ...etc
});

示例用法：

new webpack.ProvidePlugin({
  '_': 'lodash'
});

配置完以后就可以在代码里直接使用 _ ，而不再需要 import

注意：(如果不配置eslint，浏览器就会报错：'_' is not defined no-undef）

配置 package.json 里 eslintConfig 属性（或者在.eslintrc.js文件里进行配置全局变量 globals）

"eslintConfig": {
  "globals": {
    "_": true,
    // ...etc.
    // 注意package.json里不允许注释
  }
}

对于 ES2015 模块的 default export，你必须指定模块的 default 属性：

new webpack.ProvidePlugin({
  identifier: ['module-name', 'property'],
  // ...etc.
});

示例：

new webpack.ProvidePlugin({
  Vue: ['vue/dist/vue.esm.js', 'default']
});

本文内容仅供个人学习、研究或参考使用，不构成任何形式的决策建议、专业指导或法律依据。未经授权，禁止任何单位或个人以商业售卖、虚假宣传、侵权传播等非学习研究目的使用本文内容。如需分享或转载，请保留原文来源信息，不得篡改、删减内容或侵犯相关权益。感谢您的理解与支持！