这两天一直在练习这个webpack4，发现有很多问题和坑。做开发必须要有不怕死的精神，喜欢出问题喜欢解决问题，坚决踩坑、填坑！webpack4其实可以配置生产和开发，//webpack.config.jsmodule.exports={//webpack会根据模式打包Js，开发时压缩，生产下自动压缩。个人测试模式没有问题：'development'//production}但是怎么把css和js分开打包呢？找了一天相关文章，很多说webpack自动支持css压缩的，也有说需要插件的，没错就是使用插件optimize-css-assets-webpack-plugin，但你必须阅读Npm官网??webpackv3或以下版本请使用optimize-css-assets-webpack-plugin@3.2.0。optimize-css-assets-webpack-plugin@4.0.0及以上版本支持webpackv4。方法是先安装optimize-css-assets-webpack-pluginconstoptimizeCss=require('optimize-css-assets-webpack-plugin');module.exports={...,//plugins:[newoptimizeCss({assetNameRegExp:/\.style\.css$/g,cssProcessor:require('cssnano'),cssProcessorOptions:{discardComments:{removeAll:true}},canPrint:true}),],//这个还是要研究过，字面意思是optimization:{//minimize:true,minimizer:[newoptimizeCss({})],}}我也看了上面别人写的代码，所以需要安装一个'cssnano'包，运行生产环境打包命令。哦还有，css确实压缩了，但是看js，没有压缩。如果不加上面的代码，js确实是默认压缩的，所以在网上搜索了解决办法。据说webpack4只需要setmodeproduction，但是现在有一个问题是css压缩后js不会被压缩，于是继续安装之前压缩js的插件uglify-webpack-plugin和终于发现问题解决了。如果你有好的解决方案，请积极留言，共同进步，深入了解webpack！
