我正在使用@shopify/polaris软件包,它似乎导致我的构建失败并显示以下错误消息:
来自UglifyJs的vendor.file.bundle.js中的错误意外 令牌:punc«,»[./node_modules/@shopify/polaris/index.es.js:1043,0]
当我在第1043行中检查./node_modules/@shopify/polaris/index.es.js文件时,似乎抱怨以下内容:
console.warn(i18n.translate('Polaris.Icon.backdropWarning', {
color, // It seems to complain about this on line 1043.
colorsWithBackDrops: COLORS_WITH_BACKDROPS.join(', ')
}));
我正在使用webpack4。以下是我的配置:
const path = require('path');
const config = {
entry: './src/index.tsx',
output: {
path: path.resolve(__dirname, '/public/js'),
filename: 'file.bundle.js',
chunkFilename: 'vendor.file.bundle.js'
},
resolve: {
extensions: ['.js', '.json', '.ts', '.tsx', '.css', '.scss'],
},
module: {
rules: [
{
test: /\.s[ac]ss$/i,
use: [
// Creates `style` nodes from JS strings
'style-loader',
// Translates CSS into CommonJS
'css-loader',
// Compiles Sass to CSS
'sass-loader',
],
},
{
test: /\.tsx?$/,
loader: 'babel-loader',
exclude: /node_modules/
},
{
test: /\.js?$/,
loader: 'babel-loader',
exclude: /node_modules/
}
]
},
optimization: {
splitChunks: {
cacheGroups: {
commons: {
test: /[\\/]node_modules[\\/]/,
name: 'vendor',
chunks: 'initial',
enforce: true
}
}
}
},
{
mode: 'production',
plugins: [
new UglifyJsPlugin({
sourceMap: true
}),
new webpackProd.DefinePlugin({
'process.env.NODE_ENV': JSON.stringify('production')
}),
new CompressionPlugin({
filename: "[path].gz[query]",
algorithm: "gzip",
test: /\.js$|\.ts$/,
threshold: 10240,
minRatio: 0.8
}),
new webpackProd.IgnorePlugin(/^\.\/locale$/, /moment$/),
]
}
};
module.exports = config;