时间戳

首页 > 解决方案 > 可选使用 BundleAnalyzerPlugin 的 webpack 配置

reactjs - 可选使用 BundleAnalyzerPlugin 的 webpack 配置

问题描述

我正在将 webpack 用于 React 项目并希望包含WebpackBundleAnalyzer，但仅在 npm 脚本中明确指定时（例如，npm run build --withReport true）。默认情况下，我不希望它运行。

我在package.json中的构建脚本很简单：

"build": "webpack --mode production",

我的webpack.config.js中的相关片段也是如此：

...
const withReport = process.env.npm_config_withReport || 'false';
...
plugins: [
  ...
  withReport ? new BundleAnalyzerPlugin() : '',
],
...

我的想法是，withReport除非我另外指定（例如，），否则这将是错误的，因此如果我将其关闭（ ） npm run build --withReport true，BundleAnalyzer 将不会npm run build执行。

相反，即使我没有指定，分析器也会执行--withReport。我错过了什么？

标签： reactjswebpackwebpack-bundle-analyzer

解决方案

我通过对我的webpack.config.js进行了一些更改来解决这个问题。

首先，我改变了声明withReport的方式。然后我改变了实例化 BundleAnalyzerPlugin 的方式，改为在其他插件之后使用concat ：

...
const withReport = process.env.npm_config_withReport ? true : false;
...
plugins: [
  ...
].concat(withReport ? [new BundleAnalyzerPlugin()] : []),
...

推荐阅读