如何添加webpack插件

Question

我使用rca与react重新连线包装。为了向webpack添加自定义配置，我创建了config-overrides.js文件来存储配置设置。我添加了一个babel-plugin-import，这非常容易。但是现在我想使用moment-locales-webpack-plugin来配置我的应用程序中的一个区域设置，以减少应用程序的重量。

const { override, fixBabelImports, addWebpackPlugin  } = require('customize-cra');
const MomentLocalesPlugin = require('moment-locales-webpack-plugin');

module.exports = override(
  fixBabelImports('import', {
    libraryName: 'antd',
    libraryDirectory: 'es',
  }),
  addWebpackPlugin(MomentLocalesPlugin, { localeToKeep: ['us'] }),
);

在yarn start之后，它向我展示：

编译失败。

MomentLocalesPlugin: received unknown options: _pluginCompat, hooks, name, parentCompilation, outputPath, outputFileSystem, inputFileSystem, recordsInputPath, recordsOutputPath, records, removedFiles, fileTimestamps, contextT
imestamps, resolverFactory, infrastructureLogger, resolvers, options, context, requestShortener, running, watchMode, _assetEmittingSourceCache, _assetEmittingWrittenFiles, watchFileSystem. Only `localesToKeep` and `ignoreInva
lidLocales` options are supported at the moment

你能帮我一下吗？

UPDATE我知道如何向override函数中添加规则，但仍然不能使它只在一个区域设置下工作。

const { override, fixBabelImports } = require('customize-cra');
const MomentLocalesPlugin = require('moment-locales-webpack-plugin');
const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin;
const path = require('path');

module.exports = override(
  fixBabelImports('import', {
    libraryName: 'antd',
    libraryDirectory: 'es',
  }),
  function(config) {
    const alias = config.resolve.alias || {};
    alias['@ant-design/icons/lib/dist$'] = path.resolve(__dirname, './src/icons.js');

    config.resolve.alias = alias;
    config.plugins = (config.plugins || []).concat([
      new MomentLocalesPlugin(),
      new BundleAnalyzerPlugin(),
    ]);

    return config;
  }
);

Answer 1

根据customize-cra，向本期添加插件的正确方法是：

const MomentLocalesPlugin = require('moment-locales-webpack-plugin');

const addMomentLocalesPlugin = config => {
  config.plugins.push(new MomentLocalesPlugin());
  return config;
}

module.exports = override(
  addMomentLocalesPlugin,
  //...
)

如果您只想将几种语言保存在包中，可以尝试：

new MomentLocalesPlugin({ localesToKeep: ['es-us', 'pt'] })

而不是

new MomentLocalesPlugin()

Answer 2

从错误：

目前只支持localesToKeep和ignoreInvalidLocales选项。

尝试将代码从localeToKeep更改为localesToKeep。带着s。