我使用带有react-rewired 包装器的rca。为了向 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 启动后,它向我显示:
编译失败。
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
你能帮我吗?
更新
我了解了如何向 override
函数添加规则,但仍然无法使其仅适用于 1 个区域设置。
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;
}
);
最佳答案
根据this issue向customize-cra
添加插件的正确方法是:
const MomentLocalesPlugin = require('moment-locales-webpack-plugin');
const addMomentLocalesPlugin = config => {
config.plugins.push(new MomentLocalesPlugin());
return config;
}
module.exports = override(
addMomentLocalesPlugin,
//...
)
如果您只想在 bundle 中保留几种语言,您可以尝试:
new MomentLocalesPlugin({ localesToKeep: ['es-us', 'pt'] })
而不是
new MomentLocalesPlugin()
关于javascript - 如何将 webpack 插件添加到react-rewired,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/58881130/