DDR爱好者之家

webpack4 css打包压缩问题的解决
站长资源 2024/11/26 佚名
64 1538
DDR爱好者之家 Design By 杰米

这两天一直在练习这个webpack4, 发现有好多问题和坑，做开发嘛，一定要有喜欢出问题并喜欢解决问题，坚决踩个坑填个坑的不怕死小强精神！

webpack4 在配置上其实是可以是想production和development的，

// webpack.config.js

module.exports = {
  // webpack会根据mode进行对Js打包，development压缩，production下面自动压缩，亲测没有问题
  mode: 'development' // production
}

但是从js里面分离出来的css怎么打包呢？

我找了一天的相关文章，好多都是说webpack自动支持css压缩，有的是说需要插件，对，就是用插件

optimize-css-assets-webpack-plugin
不过一定要看Npm官方网站

"htmlcode"> 

const optimizeCss = require('optimize-css-assets-webpack-plugin');
module.exports = {  
  .....,
  //
  plugins: [
    new optimizeCss({
      assetNameRegExp: /\.style\.css$/g,
      cssProcessor: require('cssnano'),
      cssProcessorOptions: { discardComments: { removeAll: true } },
      canPrint: true
    }),
  ],
  // 这个还待研究，看字面意思是优化的意思
  optimization: {
    // minimize: true,
    minimizer: [new optimizeCss({})],

  }  
}

以上里面的代码我也是看别人写的，所以还需要安装一个'cssnano'的包

之后运行生产环境打包命令，哦也，css果然压缩了，但是看js，居然没有被压缩，不加上述代码的话js确实是默认压缩的，于是网上又找解决方案，都说webpack4只要设置mode production即可，但是现在有个问题，压缩了css之后js就不会压缩，于是带着试试看的心里继续安装之前压缩Js的插件 uglify-webpack-plugin

最后发现问题解决了，只是我的心得，也是误打误撞，但如果有好的解决方案请大家积极留言，共同进步，把webpack吃透！

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持。

DDR爱好者之家 Design By 杰米
广告合作：本站广告合作请联系QQ：858582 申请时备注：广告合作（否则不回）
免责声明：本站资源来自互联网收集,仅供用于学习和交流,请遵循相关法律法规,本站一切资源不代表本站立场,如有侵权、后门、不妥请联系本站删除！
DDR爱好者之家 Design By 杰米
ddrfans.com DDR爱好者之家
8,675无损音乐
1,324高清电影
213破解软件
70,141收录资讯

稳了！魔兽国服回归的3条重磅消息！官宣时间再确认！

昨天有一位朋友在大神群里分享，自己亚服账号被封号之后居然弹出了国服的封号信息对话框。

这里面让他访问的是一个国服的战网网址，com.cn和后面的zh都非常明白地表明这就是国服战网。

而他在复制这个网址并且进行登录之后，确实是网易的网址，也就是我们熟悉的停服之后国服发布的暴雪游戏产品运营到期开放退款的说明。这是一件比较奇怪的事情，因为以前都没有出现这样的情况，现在突然提示跳转到国服战网的网址，是不是说明了简体中文客户端已经开始进行更新了呢？

更新日志

友情链接

杰晶网络 DDR爱好者之家 南强小屋 黑松山资源网 白云城资源网
DDR爱好者之家 Design By 杰米