webpack/uglifyjs的remove dead_code功能

昨天在项目里加上了mobx-react-devtools开发环境调试用。但是生产环境不希望有,于是加上了


import MobxDevTools from 'mobx-react-devtools'
...
render () {
return ...
{process.env.NODE_ENV !== 'production' && <MobxDevTools />

}
}

打包后发现代码体积明显增大,即使加了webpack生产环境打包的UglifyJsPlugin({

uglifyOptions: { compress: { dead_code: true } }

})

也去不掉。应该是因为import是静态引入的特点造成的。

最后自己想了个法子解决了一下,写一个空组件

export default null

在webpack的alias里判断生产环境,则添加alias[‘mobx-react-devtools’] = ‘./app/component/Null.jsx’

在生产环境中吧这个空组件替换进去,如果还有其他希望生产环境中排除的都可以如此解决。

关于 admin

所有重要的进步,都来源于失败和挫折的经历
此条目发表在 ecmascript 分类目录。将固定链接加入收藏夹。