在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. 洛谷P4384 制胡窜

    这题TM是计数神题......SAM就是个板子,别脑残写错就完事了.有个技巧是快速定位子串,倍增即可. 考虑反着来,就是两个断点切割所有串,求方案数. 大概分类讨论一下......先特判掉一些情况.然 ...

  2. A1034. Head of a Gang

    One way that the police finds the head of a gang is to check people's phone calls. If there is a pho ...

  3. 【译】9. Java反射——泛型

    原文地址:http://tutorials.jenkov.com/java-reflection/generics.html ===================================== ...

  4. 苹果电脑利用curl下载数据集

    在看tensorflow书上迁徙学习的这一部分的时候,书上说利用 curl http://download.tensorflow.org/example_images/flower_photos.tg ...

  5. appium-基础搭建,适配,问题,优化,提速

    搭建开发环境,导入testng/log4j/maven 1.配置jdk环境 2.安装appium,下载eclipse-adt,配置appium环境 github.com/getlantern/foru ...

  6. TODO java-web相关 servlet过滤器+监听器

    servlet过滤器 定义: 过滤器是小型的web组件,它负责拦截请求和响应,以便查看.提供或以某种方式操作正在客户机和服务器之间交换的数据. 与过滤器相关的servlet共包含3个简单接口:Filt ...

  7. Tomcat源码组织结构

    Tomcat 源码组织结构 目录结构 这里所介绍的目录结构,是使用CATALINA-BASE变量定义的路径,如果没有通过配置多个CATALINA-BASE目录来使用多实例,则CATALINA-BASE ...

  8. (贪心和优先队列) POJ1862 Stripies

    Stripies Time Limit: 1000MS   Memory Limit: 30000K Total Submissions: 21506   Accepted: 9478 Descrip ...

  9. 一个关于finally和return的面试题

    public class Test{ public int add(int a,int b){ try { return a+b; } catch (Exception e) { System.out ...

  10. Go-day01

    Go-实现hello_world package main import "fmt" func main() { fmt.Println("hello world!&qu ...