去除没用到的css需要用到purifycss-webpack插件,而这个插件又依赖于purify-css

1.安装

npm i purifycss-webpack purify-css -D

2.加入插件

//...
plugins:[
new extractPlugin('css/index.css'),
new purifycss({
paths: glob.sync(path.resolve(__dirname,'./src/**/*.html'))
})
]

一定要跟extractPlugin一起用才行,如果是内置在bundle.js里面就不能过滤掉没用的css,这里还采用了glob.sync来进行同步读取html

webpack插件去除没用到的css的更多相关文章

  1. 【Web】阿里icon图标webpack插件(webpack-qc-iconfont-plugin)详解

    webpack-qc-iconfont-plugin webpack-qc-iconfont-plugin是一个webpack插件,可以轻松地帮你将阿里icon的图标项目下载至本地 开发初衷 之前已经 ...

  2. webpack 插件拾趣 (1) —— webpack-dev-server

    结束了一季的忙碌,我这封笔已久的博客也终究该从春困的咒印中复苏,想来写些实用易读的作为开篇,自然是最好不过. 新开个 webpack 插件/工具介绍的文章系列,约莫每周更新一篇篇幅适中的文章聊以共勉, ...

  3. webpack插件自动加css3前缀

    想要webpack帮忙自动加上“-webkit-”之类的css前缀,我们需要用到postcss-loader和它的插件autoprefixer 1.安装 npm i postcss-loader au ...

  4. 探寻 webpack 插件机制

    webpack 可谓是让人欣喜又让人忧,功能强大但需要一定的学习成本.在探寻 webpack 插件机制前,首先需要了解一件有意思的事情,webpack 插件机制是整个 webpack 工具的骨架,而 ...

  5. myeclipse svn 插件去除已经保存的密码方法

    myeclipse svn 插件去除已经保存的密码方法   删除掉C:\Documents and Settings\hao\Application Data\Subversion\auth\svn. ...

  6. 编写webpack 插件

    Webpack插件为第三方开发者释放了Webpack的最大可能性.利用多级回调开发者可以把他们自己的需要的功能引入到Webpack里面来.Build插件比Build loader 更进一步.因为你需要 ...

  7. 从0开始编写webpack插件

    1. 前言 插件(plugins)是webpack中的一等功臣.正是由于有了诸多插件的存在,才使得webpack无所不能.在webpack源码中也是使用了大量的内部插件,插件要是用的好,可以让你的工作 ...

  8. webpack插件之webpack-dev-server

    webpack插件之webpack-dev-server webpack插件 自动化 webpack-dev-server  现在只需要使用 npm run build指令就可以自动打包,并自动处理好 ...

  9. webpack插件之htmlWebpackPlugin

    webpack插件之htmlWebpackPlugin webpack插件 自动化 htmlWebpackPlugin  由于webpack已经帮我们处理好js之间的依赖关系,现在我们可以忽略js的加 ...

随机推荐

  1. [CF983D]Arkady and Rectangles[线段树+可删堆/set]

    题意 你有一个无限大的绘图板,开始颜色是\(0\) , 你将进行\(n\) 次绘图,第\(i\) 次绘图会将左下角为 \((x_1, y_1)\),右上角为\((x_2, y_2)\) 的矩形涂成颜色 ...

  2. .Net Core WebApi控制器接收原始请求正文内容

    主要目标 在Asp.net Core控制器中,通过自定义格式化程序来映射自定义处理控制器中的“未知”内容. 简单案例 为了演示这个问题,我们用VS2017创建一个默认的Asp.net Core Web ...

  3. 【ORACLE】oracle11g RAC搭建

    --安装好操作系统(rhel-server-6.7 on vmware) 注意事项: 1.磁盘配置lvm 2.账号密码 root/oracle ---------------------------- ...

  4. HTML 表格实例

    1.表格这个例子演示如何在 HTML 文档中创建表格. <p>每个表格由 table 标签开始.</p><p>每个表格行由 tr 标签开始.</p>&l ...

  5. 【Unity Shader】从NDC(归一化的设备坐标)坐标转换到世界坐标的数学原理

    从NDC(归一化的设备坐标)坐标转换到世界坐标要点 参考资料 How to go from device coordinates back to worldspace http://feepingcr ...

  6. Muduo学习笔记(一) 什么都不做的EventLoop

    Muduo学习笔记(一) 什么都不做的EventLoop EventLoop EventLoop的基本接口包括构造.析构.loop(). One Loop Per Thread 一个线程只有一个Eve ...

  7. 微软职位内部推荐-Senior Development Lead – Sharepoint

    微软近期Open的职位: SharePoint is a multi-billion dollar enterprise business that has grown from an on-prem ...

  8. time since epoch

    C++11 提供了新的获取系统时间的库函数,在获取时间的时候一般常用的是获取time since epoch,下面来看一下如何获取这个时间. #include <iostream> #in ...

  9. vue如何触发某个元素的单击事件?

    <a class="link" @click.native="test">1111</a> <a class="link ...

  10. Beta阶段 冲刺博客合集

    一.Beta阶段敏捷冲刺前准备 二.Beta阶段敏捷冲刺① 三.Beta阶段敏捷冲刺② 四.Beta阶段敏捷冲刺③ 五.Beta阶段敏捷冲刺④ 六.Beta阶段敏捷冲刺⑤ 七.用户使用调查报告 八.码 ...