zoukankan      html  css  js  c++  java
  • [Webpack] Detect Unused Code with Webpack and unused-files-webpack-plugin

    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;
    };
  • 相关阅读:
    MS SQL Sever数据库还原
    IIS 7.5 配置伪静态
    黑马程序员-out和ref
    黑马程序员-结构
    黑马程序员-ReadInt
    黑马程序员-hashtable
    黑马程序员-冒泡排序
    黑马程序员-快速排序
    黑马程序员-for和foreach
    黑马程序员-集合和索引器
  • 原文地址:https://www.cnblogs.com/Answer1215/p/10339389.html
Copyright © 2011-2022 走看看