去除没用到的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. 为什么要进行阿里云云计算助理工程师认证(ACA)

    阿里云助理工程师认证(ACA - Alibaba Cloud Certification Associate)是面向使用阿里云基础产品的专业技术认证,主要涉及阿里云的计算.存储.网络.安全类的核心产品 ...

  2. Django的跨域请求

    一 同源策略 同源策略(Same origin policy)是一种约定,它是浏览器最核心也最基本的安全功能,如果缺少了同源策略,则浏览器的正常功能可能都会受到影响.可以说Web是构建在同源策略基础之 ...

  3. Android AccessibilityService(辅助服务) 使用示例

    1.前言 网上关于Android辅助服务的使用方式已经非常丰富了,所以也不在乎再多我这一篇了:-D.有同学说这是重复造轮子,题主很同意,但反过来说,如果自己没有能力造出轮子,还对重复造轮子嗤之以鼻,那 ...

  4. C#_IO操作

    1.创建文件夹 //using System.IO; Directory.CreateDirectory(%%1);   2.创建文件 //using System.IO; File.Create(% ...

  5. Scrapy持久化存储

    基于终端指令的持久化存储 保证爬虫文件的parse方法中有可迭代类型对象(通常为列表or字典)的返回,该返回值可以通过终端指令的形式写入指定格式的文件中进行持久化操作; 执行输出指定格式进行存储:将爬 ...

  6. shellcode 初次使用笔记

    winXP SP3 环境 (xp环境默认没开启栈不可执行机制,比较方便破解,如果已开启了,请自行百度如何关闭) dig.exe 目标文件 x86dbg调试工具 python 环境 打开准备好的目标软件 ...

  7. 自动化部署-Jenkins+SVN+MSBuild

    这篇文章主要介绍下使用Jenkins实现自动化部署 下载 https://jenkins.io/download/ 安装 按步骤安装即可,下载的是windows版本,安装完成后,会看到这样一个正在运行 ...

  8. Nuxeo 认证绕过和RCE漏洞分析(CVE-2018-16341)

    简介 Nuxeo Platform是一款跨平台开源的企业级内容管理系统(CMS).nuxeo-jsf-ui组件处理facelet模板不当,当访问的facelet模板不存在时,相关的文件名会输出到错误页 ...

  9. 每天学一点---document.createDocumentFragment

    document.createDocumentFragment  用于创建文档对象,创建好的对象存在于内存中(不会引起回流,对元素位置和几何上的运算),不是附着在DOM树上,所以有更好的性能 可将该文 ...

  10. 【机器学习】Apriori算法——原理及代码实现(Python版)

    Apriopri算法 Apriori算法在数据挖掘中应用较为广泛,常用来挖掘属性与结果之间的相关程度.对于这种寻找数据内部关联关系的做法,我们称之为:关联分析或者关联规则学习.而Apriori算法就是 ...