【npm依赖包介绍】借助rimraf依赖包,在用npm run build构建项目时,清空dist目录,避免新旧混合

文章目录

背景

npm run build时,一般都会清空项目中已有的dist目录再构建,避免新旧混合。

如何使用

可以简单使用rimraf这个npm依赖包。

目前rimraf的最新版已经到v6了。所以在安装时,要注意下版本问题:

v5 to v6

Require node 20 or >=22

Add --version to CLI

v4 to v5

There is no default export anymore. Import the functions directly using, e.g., import { rimrafSync } from 'rimraf'.

因为我用的nodejs的版本是18,所以用"rimraf": "^5.0.5", 就好了。

1、在项目中安装

bash 复制代码
npm i rimraf@5 --save-dev

2、配置package.json

json 复制代码
"scripts": {
    "clean": "rimraf dist",  // 新增,表示删除dist目录
    "test": "echo \"Error: no test specified\" && exit 1",
    "dev": "vite",
    "build": "npm run clean && vite build"  //新增npm run clean && 
  },

3、在项目构建时,直接用

bash 复制代码
npm run build

此时会先执行npm run clean,后构建。

附上rimraf的介绍和说明

rimraf 是一个用于删除文件和文件夹的 Node.js 包。它的名字来源于 Unix 命令 rm -rf,其中 rm 是删除命令,-rf 选项表示递归删除文件和文件夹,并且不提示确认。

主要作用
  • 递归删除文件夹:rimraf 可以递归地删除整个文件夹及其内容,包括子文件夹和文件。
  • 跨平台兼容:rimraf 在 Windows、macOS 和 Linux 等不同操作系统上都能正常工作,解决了 Node.js 自带的 fs.rmdirfs.unlink 在 Windows 上删除非空文件夹时的限制。
  • 异步和同步操作:rimraf 提供了异步和同步两种删除方式,方便在不同场景下使用。
使用场景
  • 清理构建目录:在构建项目之前,通常需要清理旧的构建输出目录,rimraf 可以快速删除这些目录。
  • 删除临时文件:在开发过程中,可能需要删除一些临时生成的文件或文件夹。
  • 卸载或重置时清理:在卸载或重置应用程序时,可以使用 rimraf 清理相关文件和文件夹。
安装

你可以通过 npm 安装 rimraf

bash 复制代码
npm install rimraf --save-dev
使用示例
异步删除
javascript 复制代码
const rimraf = require('rimraf');

rimraf('/path/to/directory', function (err) {
  if (err) {
    console.error('删除失败', err);
  } else {
    console.log('删除成功');
  }
});
同步删除
javascript 复制代码
const rimraf = require('rimraf');

try {
  rimraf.sync('/path/to/directory');
  console.log('删除成功');
} catch (err) {
  console.error('删除失败', err);
}

参考资料

https://www.npmjs.com/package/rimraf


如果你在web前端开发、面试、前端学习路线有困难可以在下方加我名片。

免费答疑,行业深潜多年的技术牛人帮你解决bug。

并可提供web前端开发,网站开发、技术咨询、答疑、直播讲座等服务。

祝你能成为一名优秀的WEB前端开发工程师!

相关推荐
whale fall7 小时前
npm install安装的node_modules是什么
前端·npm·node.js
做梦都在学习前端11 小时前
发布一个monaco-editor 汉化包
前端·npm·vite
墨菲安全2 天前
NPM组件 betsson 等窃取主机敏感信息
前端·npm·node.js·软件供应链安全·主机信息窃取·npm组件投毒
聪聪的学习笔记3 天前
【1】确认安装 Node.js 和 npm版本号
前端·npm·node.js
whale fall4 天前
npm install安装不成功(node:32388)怎么解决?
前端·npm·node.js
Gazer_S4 天前
【公司环境下发布个人NPM包完整教程】
前端·npm·node.js
溪i4 天前
pnpm 升级
npm
你喜欢喝可乐吗?4 天前
Windows 安装 nodejs npm
前端·npm·node.js
come112344 天前
npm 命令入门指南(前端小白版)
前端·npm·node.js
墨菲安全4 天前
NPM组件 alan-baileys 等窃取主机敏感信息
前端·npm·node.js·npm组件·恶意包·主机信息窃取