转自 Kindem的博客,欢迎转载,但要注明出处
🤔 起因
今天遇到一个玄学的 bug
,主要是因为引入了 pinyin
包,这个包其中的一行代码会导致 Webpack
默认使用的 Minifier
失效,从而导致编译失败。
经过一份排查和寻求帮助,我发现可以通过在 Webpack
中引入 uglifyjs
这一插件来解决。
但是我使用的是 create-react-app
创建的 React
项目,这样一来 Webpack
的配置将会被隐藏,需要使用 react-app-rewired
来暴露位于 node_modules
目录下的 Webpack
配置,但是网上并没有找到关于在 react-app-rewired
中添加 uglifyjs
插件的方法。
🎉 解决办法
在 npm
上搜寻了一番,找到了一个宝贝 -- react-app-rewire-uglifyjs
,通过这个包可以直接在 react-app-rewired
中使用 uglifyjs
,使用方法如下:
在 react-app-rewired
的配置文件 /config-overrides.js
这样写:
const rewireUglifyjs = require('react-app-rewire-uglifyjs');
module.exports = function override(config, env) {
// use UglifyJS
config = rewireUglifyjs(config);
return config;
};
文档可以参考这里:npm - react-app-rewire-uglifyjs
网友评论