useless-files-webpack-plugin 前端优化删除多余文件

最新推荐文章于 2024-05-07 15:56:38 发布
最新推荐文章于 2024-05-07 15:56:38 发布
阅读量267 收藏
点赞数 3
分类专栏： vue vue优化 文章标签： 前端 webpack vue
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_49582736/article/details/138337371
版权
文章介绍了如何在Vue项目中集成Useless-Files-Webpack-Plugin，通过配置webpack来查找并记录未被引用的文件，以便于清理无用资源，提高构建效率。
摘要由CSDN通过智能技术生成

useless-files-webpack-plugin 检查项目中没有引用的无效文件

使用方法
  1. 安装依赖
npm install useless-files-webpack-plugin
  1. webpack配置（我的是在vue.config.js配置的）
const UnusedFilesWebpackPlugin = require('useless-files-webpack-plugin')

plugins: [
  new UnusedFilesWebpackPlugin({
    root: './src', // 项目目录
    output: './unused-files.json', // 输出文件列表
    clean: false, // 是否删除文件,
    exclude: /node_modules/ // 排除文件列表
  })
],
  1. 运行项目
npm run dev

会在根目录生成unused-files.json文件，会展示要删除的文件路径

不想吃菠萝
关注
  • 3
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
remove-files-webpack-plugin:Webpack插件，可在编译前后删除文件和文件夹
05-17
删除Webpack的文件夹和文件 Webpack插件，可在编译前后删除文件和文件夹。 内容 贡献 执照 安装 使用npm ： npm install remove - files - webpack - plugin 带yarn ： yarn add remove - files - webpack - plugin 支持 该插件可在任何操作系统和Webpack> = 2.2.0上运行。 用法 const RemovePlugin = require ( 'remove-files-webpack-plugin' ) ; module . exports = { plugins : [ new RemovePlugin ( { before : { // parameters for "bef
未使用文件webpack插件：在webpack的上下文中查看所有未由webpack编译的文件
02-06
未使用的文件webpack插件 在webpack的上下文中显示所有非由webpack编译的文件 使用npm安装： npm i --save-dev unused-files-webpack-plugin 用纱安装： yarn add --dev unused-files-webpack-plugin 用法 webpack.config.babel.js import UnusedFilesWebpackPlugin from "unused-files-webpack-plugin" ; export default { plugins : [ new UnusedFil
useless-files-webpack-plugin 删除系统中没有被引用的文件
dongheng123的博客
05-10 669
vue删除无用文件
性能优化 ：删除项目中没有引用关系的文件 useless-files-webpack-plugin
晴天有点孤单
06-30 1437
一般此类包不需要安装到项目中，减少node_modules体积（以项目实际情况决定-S/-D）最后执行npm run build 会自动生成文件unused-files.json。然后再vue.config.js中配置。默认clean为true会自动删除文件。
vue前端项目优化-统计无用文件useless-files-webpack-plugin
最新发布
cy1502的博客
05-07 274
【代码】vue前端项目优化-统计无用文件useless-files-webpack-plugin。
前端优化，webpack打包删除无用文件 并批量删除文件脚本
m0_45857808的博客
03-01 259
前端优化 webpack打包时删除无用文件 并批量删除文件脚本
去除项目多余文件的webpack插件实现
weixin_34408624的博客
05-01 1551
大多数项目随着时间的推移,经常会摒弃掉一部分功能, 但大多数只是入口关闭, 或注释掉功能代码块, 依赖的文件如果没删除掉,项目其他成员一般不会去处理. 在日常开发中, 通过webpack 生成的 stats 文件实现了去除多余文件的插件useless-files-webpack-plugin 插件用法如下: const UselessFile = require('useless-files-we...
useless-files-webpack5-plugin\ useless-files-webpack-plugin 打包工具使用
weixin_42042863的博客
11-02 530
933版本已升级为webpack5，useless-files-webpack-plugin不支持，使用useless-files-webpack5-plugin。使用useless-files-webpack-plugin检查项目中的无用文件。打包完成后会生成unused-files.json文件。2、webpack配置。
webpack删除文件插件 remove-files-webpack-plugin
qq_52912134的博客
10-14 390
webpack删除文件插件。
webpack打包删除无用文件
windows_2006的专栏
07-09 6009
前言 在webpack打包项目过程中，常遇见一些无用的图片，js文件，怎样能够自动检测哪些是无用的文件呢？本文中介绍使用插件useless-files-webpack-plugin查找无用文件，在terminal中删除 操作步骤 1、安装 安装方法 cnpm i useless-files-webpack-plugin -D 检查安装是否成功 进入package.json中，刷新pac...
webpack未使用：检查前端代码中不再使用的文件资产
02-05
webpack未使用 检查前端代码中不再使用的文件/资产。 使用webpack --json的输出来查看捆绑中实际使用的文件，并列出不需要的文件。 用法： # install webpack-unused npm install -g webpack-unused # run webpack using your normal webpack config etc # with the --json switch to output the stats.json, and pipe to webpack-unused # unused files in the cwd will be li
unused-files
05-16
安装 npm i -- dev unused - files 用法 const UnusedPlugin = require ( 'unused-files' ) ; const srcPath = path . join ( __dirname , '/src' ) ; module . exports . plugins = module . exports . plugins . concat ( [ ... others , new UnusedPlugin ( { directories : [ srcPath ] , exclude : [ srcPath + '/images/' , srcPath + '/i18n/' ] , outputPath : srcPath , outputName : 'unu
remove-source-webpack-plugin:Webpack插件，用于删除不需要的源
05-13
删除源webpack插件 Webpack插件，用于删除不需要的源。 可以与以删除内联源。 安装 您可以通过或安装它。 $ yarn add remove-source-webpack-plugin --dev $ npm install remove-source-webpack-plugin --save-dev 用法 在您的webpack配置中需要插件： const RemoveSourceWebpackPlugin = require('remove-source-webpack-plugin'); 将该插件添加到您的webpack配置中，如下所示： plugins: [ new RemoveSourceWebpackPlugin(/runtime.*\.js$/) // array is also accepted ] 演示版 执照
no-useless-mods
04-02
无用的mod 完全禁用默认ui的可替换部分，而不必手动与EA * -Mods混淆。 可以分别启用或禁用所有功能： 协助（请参阅快速协助或类似工具） 拍卖行（请参阅shinies） 事件文本-屏幕上的默认战斗编号 ...
vue项目性能优化：去除没有引用的文件
每天都要努力学习哦~~
09-06 971
随着项目开发的进行会经历一个混乱到整齐划一的过程，这个过程中会产生一系列冗余代码，这时候通过useless-files-webpack-plugin这个插件，可以帮助我们删除项目中无用的文件；
vue2.0检测无用的代码并删除
zhangjing1019的博客
09-19 1198
（3）、每次编译的时候，都会将一些没有用到的文件输出到unused-files.json这个文件，可以自己再手动检测一下，然后删掉无用的代码。（4）、删除大量的代码后，git提交代码时，记得在git上打个tag，以方便回滚或者找代码。（1）、使用 useless-files-webpack-plugin 来查找无用文件。（2）、vue.config.js中配置。
前端优化，webpack打包删除无用文件，并附上批量删除文件脚本！非常好用
weixin_45137175的博客
03-09 1879
大家可能在webpack打包项目过程中，常遇见一些无用的图片，js文件，怎样能够自动检测哪些是无用的文件呢？本文中介绍使用插件useless-files-webpack-plugin查找无用文件，在terminal中删除，附加bat批量删除文件。
使用webpack-如何清理无用源文件
Thinking Code
10-15 1952
项目随着时间的推移不断更新迭代，或者新项目从老项目迁移开发，项目变得越来越臃肿，无形中就存在了很多无用的文件. 大型的项目，如果仅靠人肉去识别，难度相当大，那么怎样能够自动检测哪些是无用的文件呢？
Nuxt2怎么使用useless-files-webpack-plugin
04-28
要在Nuxt2中使用useless-files-webpack-plugin，可以按照以下步骤进行操作： 1. 安装插件：在Nuxt2项目根目录下，运行以下命令安装插件： ``` npm install --save-dev useless-files-webpack-plugin ``` 2. 修改Nuxt2配置文件：在Nuxt2项目根目录下，找到nuxt.config.js文件，在该文件中添加以下代码： ``` build: { plugins: [ new UselessFilesWebpackPlugin() ] } ``` 3. 配置插件选项：如果需要配置插件选项，可以在调用插件时传递选项对象。例如，以下代码配置了插件删除所有以".test.js"结尾的文件： ``` build: { plugins: [ new UselessFilesWebpackPlugin({ patterns: [ '**/*.test.js' ] }) ] } ``` 完成上述步骤后，Nuxt2项目就可以使用useless-files-webpack-plugin插件了。该插件可以删除项目中未使用的文件，从而减小项目体积。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值