As you refactor and modify applications, it's difficult to manage and keep track of files as they become unused. Keeping this "dead" code around adds noise to your application and reduces clarity. Just as ESLint can tell us when variables become unused, Webpack (with the help of the unused-files-webpack-plugin) can tell us when entire files become unused. First, we'll install the plugin with npm and save it as a devDependency. Next, we'll use npm run scripts to build a new command that will run Webpack with the plugin. Finally, we'll learn how to use Webpack environment variables to conditionally add plugins to your Webpack config. By the end of the lesson, you'll have a useful cli command you can run to check for unused modules in your Webpack build

Install:

npm i -D unused-files-webpack-plugin

Update scripts:

"check-unused": "webpack --mode production --env.unused=true --display=errors-only",

Update webpack.config.js:

/* eslint-env node */
const UnusedFilesPlugin = require('unused-files-webpack-plugin').default; module.exports = (env) => {
const config = {
entry: './src/index.js'
}; if (env && env.unused) {
config.plugins = [
new UnusedFilesPlugin({
failOnUnused: true,
patterns: ['src/*.js']
})
]
} return config;
};

[Webpack] Detect Unused Code with Webpack and unused-files-webpack-plugin的更多相关文章

  1. [Webpack 2] Add Code Coverage to tests in a Webpack project

    How much of your code runs during unit testing is an extremely valuable metric to track. Utilizing c ...

  2. webpack打包 The 'mode' option has not been set, webpack will fallback to

    webpack 打包报错 The 'mode' option has not been set, webpack will fallback to 'production' for,Module no ...

  3. Webpack实战(五):轻松读懂Webpack如何分离样式文件

    在上一篇文章中我给大家分享了预处理器(loader),里面讲到了style-loader 和css-loader,有关样式引入的问题,但是上面的样式文件只是引入到style标签里面,并不是我想要的样式 ...

  4. 在webpack中使用Code Splitting--代码分割来实现vue中的懒加载

    当Vue应用程序越来越大,使用Webpack的代码分割来懒加载组件,路由或者Vuex模块, 只有在需要时候才加载代码. 我们可以在Vue应用程序中在三个不同层级应用懒加载和代码分割: 组件,也称为异步 ...

  5. webpack优化之code splitting

    作为当前风头正盛的打包工具,webpack风靡前端界.确实作为引领了一个时代的打包工具,很多方面都带来了颠覆性的改进,让我们更加的感受到自动化的快感.不过最为大家诟病的一点就是用起来太难了. 要想愉快 ...

  6. [Tools] Support VS Code Navigation and Autocomplete Based on Webpack Aliases with jsconfig.json

    It's common to setup Webpack aliases to make imports much more convenient, but then you lose the abi ...

  7. webpack学习之—— Code Spliting(代码分离)

    代码分离特性能够把代码分离到不同的 bundle 中,然后可以按需加载或并行加载这些文件.代码分离可以用于获取更小的 bundle,以及控制资源加载优先级,如果使用合理,会极大影响加载时间. 有三种常 ...

  8. [Webpack] Externalize Dependencies to be Loaded via CDN with webpack

    We can separate our custom application code from the common libraries we leverage, such as React and ...

  9. webpack学习(二):先写几个webpack基础demo

    一.先写一个简单demo1 1-1安装好webpack后创建这样一个目录: 1-2:向src各文件和dist/index.html文件写入内容: <!DOCTYPE html> <h ...

随机推荐

  1. Accord.NET入门

    0.序 园子里介绍Accord.NET的文章不少,但是具体讲如何使用的反而不多,可能跟.NET在机器学习领域应用不多有关.诚然,如果做项目的话,可能用Python更好一些,但是如果把了解Accord. ...

  2. 处理form表单提交后返回值的处理办法【html5】

    同事朋友ajax,最近在弄公司业务电话机,自主搭建,买的设备. 其中最主要功能是前端发起呼叫,通过浏览器触发设备进行呼叫功能,走后台呼叫还不行. 需求是这样的: 前端给设备ip发送特定的一段xml信息 ...

  3. OpenStack 认证服务 KeyStone部署 (四)

    Keystone作用: 用户与认证:用户权限与用户行为跟踪: 服务目录:提供一个服务目录,包括所有服务项和相关Api的断点 SOA相关知识 Keystone主要两大功能用户认证和服务目录(相当于一个注 ...

  4. docker集群

    http://blog.csdn.net/zhaoguoguang/article/details/51161957

  5. 最短路-Bellmanford

    简介: 给定一个图和一个源点,求源点到其余点的最短路径,图中有可能存在负权边. 算法步骤 1.初始化:将除源点外的所有顶点的最短距离估计值 dist[v] ← +∞, dist[s] ←0; 2.迭代 ...

  6. ASP.NET MVC4+EF5(Lambda/Linq)读取数据

    希望大家记住,这里讲的所有的知识点,不仅仅是了解了就可以了,还要会灵活用,一定要多思考,撑握其中的编程思想. 本文讲的是委托和事件,这两个词可能你早就耳熟能详,但你是否真正撑握了呢? 本系列讲的C#高 ...

  7. POJ3666 Making the Grade [DP,离散化]

    题目传送门 Making the Grade Time Limit: 1000MS   Memory Limit: 65536K Total Submissions: 9090   Accepted: ...

  8. Python开发基础-Day1-python入门

    编程语言分类 机器语言 使用二进制代码直接编程,直接与硬件交互,执行速度非常快,灵活,但是开发难度高,开发效率低下,缺乏移植性. 汇编语言 对机器语言指令进行了英文封装,较机器语言容易记忆,直接与硬件 ...

  9. 【POJ 3784】 Running Median (对顶堆)

    Running Median Description For this problem, you will write a program that reads in a sequence of 32 ...

  10. [AGC012E]Camel and Oases

    题意:有$n$个数轴上的绿洲,给定它们的坐标,有一只骆驼想要访问所有绿洲,当它的驼峰容量为$V$时,它可以走到和当前绿洲距离$\leq V$的绿洲,并可以继续走,它也可以用一次跳跃到达任意一个绿洲,只 ...