在webpack中打包的文件通常是通过hash生成的,如果文件改动,那么打包的文件就会越来越多,如果想清除之前的文件,可以使用clean-weabpack-plugin插件来处理
 
注意版本号:我使用的是

"clean-webpack-plugin": "^2.0.1",

关于配置的介绍:

webpack中添加如下代码

const CleanWebpackPlugin = require('clean-webpack-plugin');

module.exports = {
new CleanWebpackPlugin({})
}

这个插件默认会清除 output.path 输出的目录

module.exports = {
output: {
filename: '[name]_[hash].js',
path: resolve('dist')
}
}

关于常用的参数配置

1. cleanOnceBeforeBuildPatterns

这个参数配置要删除那些文件,和不要删除那些文件,不要删除的文件前面加个逻辑运算符非 ! ,*号可以通过站位符来处理,表示什么开头,什么结尾啥的

new CleanWebpackPlugin({
cleanOnceBeforeBuildPatterns: ['main*.*', '!vendor', '!vendor.manifest.json']
}),

【webpack】中clean-weabpack-plugin使用方法的更多相关文章

  1. webpack中loader和plugin的概念理解

    对于 loader ,它就是一个转换器,将A文件进行编译形成B文件,这里操作的是文件,比如将 A.scss 或 A.less 转变成 B.css,单纯的文件转换过程: 对于 plugin,它就是一个扩 ...

  2. webpack中环境变量的使用方法

    这节课讲解一下,在webpack打包过程中,怎么去使用一些环境变量. 首先我有一个打包配置的三个文件 "scripts": { "dev-build": &qu ...

  3. 在webpack中配置vue.js

    在webpack中配置vue.js 这里有两种在webpack中配置vue.js的方法,如下: 1.在main.js中引入vue的包: index.html: <!DOCTYPE html> ...

  4. render方法渲染组件和在webpack中导入vue

    使用component注册的组件div容器里可以放多个,但是使用render的只能放一个 <div id="app"> <p>我可以放两个</p> ...

  5. webpack中clean-webpack-plugin插件使用遇到的问题及解决方法

    webpack 会生成文件,然后将这些文件放置在 /dist 文件夹中,但是 webpack 无法追踪到哪些文件是实际在项目中用到的. 通常,在每次构建前清理 /dist 文件夹,是比较推荐的做法,因 ...

  6. webpack中如何使用vue

    1.安装 vue包:npm i vue -S 2.由于在webpack中,推荐使用.vue这个组件模版文件来定义组件,不然会出现vue.js移动和一些高级语法的不支持,因此需要安装能解析这种文件的lo ...

  7. webpack 中导入 vue 和普通网页使用 vue 的区别(四)

    一:在普通网页中使用 vue 使用 script 标签,引入 vue 包 在 ndex 页面中,创建一个 id 为 App 的 div 容器 通过 new Vue 得到一个 vue 实例 二:在 we ...

  8. 011 webpack中使用vue

    一:在webpack中使用vue 1.安装vue的包 2.index.html <!DOCTYPE html> <html lang="en"> <h ...

  9. Javascript - Vue - webpack中的组件、路由和动画

    引入vue.js 1.cnpm i vue -S 2.在mian.js中引入vue文件 import Vue from "vue"//在main.js中使用这种方式引用vue文件时 ...

  10. Webpack中hash与chunkhash的区别,以及js与css的hash指纹解耦方案

    文件的hash指纹通常作为前端静态资源实现增量更新的方案之一,Webpack是目前最流行的开源编译工具之一,其强大的功能也带来很多坑(当然,大部分麻烦其实都可以在官方文档中找到答案). 比如,在Web ...

随机推荐

  1. bzoj3331 压力(圆方树)

    题目链接 圆方树 圆方树就是对于联通无向图中的每一个点双新建一个方点,与点双中的每个点连一条边,然后将原来的边删去.将原来的点看作圆点,新建的点看作方点.所以叫做圆方树. 性质 1.圆方树肯定是棵树( ...

  2. js 日期比较大小,js判断日期是否在区间内,js判断时间段是否在另外一个时间段内

    /** * 日期解析,字符串转日期 * @param dateString 可以为2017-02-16,2017/02/16,2017.02.16 * @returns {Date} 返回对应的日期对 ...

  3. 踩过的坑—iphone手机H5样式兼容总结

    对一个前端开发者来说,最煎熬的莫过于"兼容"两个字了(说到这个词朋友们是不是身体一抖),哪怕对于工作多年的老油条来讲,也不是完全了解各种场景下的兼容性处理方法.在这里我就把我在工作 ...

  4. 自定义数据类型 typedef

    其实就是为数据类型起一个别名. typedef unsigned char AGE; //字符类型AGE x; //等价于 unsigned char x; typedef int * IPointe ...

  5. (线性回归)Liner Regression简单应用

    警告:本文为小白入门学习笔记 数据连接: http://openclassroom.stanford.edu/MainFolder/DocumentPage.php?course=DeepLearni ...

  6. lucene之中文分词及其高亮显示(五)

    中文分词:即换个分词器 Analyzer analyzer = new StandardAnalyzer();// 标准分词器     换成  SmartChineseAnalyzer analyze ...

  7. mysql全备份脚本速查

    mysql全备份脚本 # 快捷备份方式[root@nb scripts]# cat db.backup.sh #!/bin/bashmysqldump -ubackup -pbackuppwd -P3 ...

  8. grovvy生成随机汉字名字

    StringBuilder sb = new StringBuilder(); for(int i = 0 ;i < 3; i++){ sb.append((char) (0x4e00 + (i ...

  9. 2017-12-15python全栈9期第二天第六节之三次登陆机会升级版再试试

    #!/user/bin/python# -*- coding:utf-8 -*-#当剩余为0次机会时.询问用户是否再试试.如果同意那就再给三次机会.可一直继续username = 'zd'passwo ...

  10. MySQL数据库优化_limit_1

    转自:https://blog.csdn.net/cbjcry/article/details/70155118 1. MySQL中,在某些情况下,如果明知道查询结果只有一个,SQL语句中使用LIMI ...