webpack 常用的 plugin

  • html 压缩 html-webpack-plugin
    一个页面对应一个 html-webpack-plugin
    minify 参数可以进行压缩

  • js 压缩 uglifyjs-webpack-plugin

    1
    2
    webpack4内置，mode为‘production’时默认会使用
    也可以手动安装，自定义一些参数

  • css 压缩 optimize-css-assets-webpack-plugin
    同时使用 cssnano

  • css 分离

    1.extract-text-webpack-plugin

    这个插件要依赖 webpack3 的版本

    2.mini-css-extract-plugin

    webpack4 得使用 mini-css-extract-plugin 这个插件来单独打包 css。与style-loader互斥

  • html-inline-css-webpack-plugin

  • html-webpack-externals-plugin

    将react，react-dom基础包通过cdn引入，不打入bundle中

  • split-chunks-plugin

    webpack4内置，替代commons-chunk-plugin， 进行公共脚本分离

  • 自动删除 dist 目录 clean-webpack-plugin