webpack - 使用 CRA + rescripts 调用 webpack.ignorePlugin（到 tree-shake Moment.js 语言环境）

Question

我正在使用带有rescripts的 CRA +

我想对 Moment.js 语言环境进行 tree-shake，与ignorePlugin Webpack 文档中所示的方式完全相同：

new webpack.IgnorePlugin({
  checkResource (resource) {
    // do something with resource
    return true|false;
  }
});

我知道我可以使用脚本轻松转换 webpack 配置：

config => {
   const newConig = ...
   return newConfig
}

但是我怎样才能获得webpack对象来调用该IgnorePlugin方法 - 或达到相同的结果？

react-app-rewired如有必要，我愿意从 rescripts 切换到替代方案，例如。

Answer 1

除其他选项外，生成的配置应该有一个plugins选项。

因此，假设您newConfig继承了所有config选项。通常newConfig.plugins将指向继承的默认插件的数组。

要增强/扩展插件列表，您所要做的就是更改该数组，即。newConfig.plugins只需将您的插件推送到该数组中的任何索引（例如最后一个） 。

例子：

const Webpack = require("webpack");

function webpack(config, env) {
  const newConfig = Object.assign({}, config);
  newConfig.plugins = newConfig.plugins || [];

  const myPlugin = new Webpack.IgnorePlugin({
    checkResource(resource) {
      // do something with resource
      return true | false;
    }
  });

  newConfig.plugins.push(myPlugin);

  return newConfig;
}

module.exports = { webpack };