vite.config配置alias时报错:Error: ENOTEMPTY: directory not empty, rmdir


字数:483 阅读时长:2分钟 阅读:85

使用 vite 工具构建项目时,为了 import 方便,一般会配置 alias 别名。例如:@ 代表 src 目录 。配置完成后重启服务出现报错:Error: ENOTEMPTY: directory not empty, rmdir 'D:/project/vite-react/node_modules/.vite/deps'

Vite

一、前言

  1. alias 配置:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
// vite.config.js

import { defineConfig } from 'vite'
import react from '@vitejs/plugin-react'

export default defineConfig({
plugins: [react()],
resolve: {
alias: {
'@': '/src',
'@css': '/src/styles',
}
},
})
  1. 报错日志:
1
2
3
4
5
6
7
8
9
> vite-react@0.0.0 dev D:\project\vite-react
> vite

error when starting dev server:
Error: ENOTEMPTY: directory not empty, rmdir 'D:/project/vite-react/node_modules/.vite/deps'
at rmdirSync (fs.js:735:3)
at removeDirSync (D:\project\vite-react\node_modules\_vite@2.9.9@vite\dist\node\chunks\dep-59dc6e00.js:2566:9)
at loadCachedDepOptimizationMetadata (D:\project\vite-react\node_modules\_vite@2.9.9@vite\dist\node\chunks\dep-
59dc6e00.js:39428:5)

二、报错原因

vite 在启动本地服务后,会生成一些缓存文件,以提高性能提升速度。在配置 alias 后没有清空缓存文件,所以出现报错。

三、解决办法

  1. 删除 vite 的缓存目录,默认缓存目录在 node_modules/.vite 中,删除 .vite 文件夹即可。
  2. 还有另一种方法,使用 --force 命令行选项,试了几次发现并不好使。于是配置了一个 npmpre 钩子来处理,当执行 npm run dev 命令的时候,会先执行 rd /s /q node_modules\\.vite 命令删除缓存目录 node_modules/.vite

windows 系统:

1
2
3
4
5
6
{
"scripts": {
"predev": "rd /s /q node_modules\\.vite",
"dev": "vite --host"
}
}

macOSLinux 系统:

1
2
3
4
5
6
{
"scripts": {
"predev": "rm -rf ./node_modules/.vite",
"dev": "vite --host"
}
}

再次启动服务,一切正常。


Vite 相关系列


欢迎访问:天问博客

本文作者: Tiven
发布时间: 2022-05-20
最后更新: 2022-06-09
本文标题: vite.config配置alias时报错:Error: ENOTEMPTY: directory not empty, rmdir
本文链接: https://www.tiven.cn/p/4335e9ee/
版权声明: 本作品采用 CC BY-NC-SA 4.0 许可协议进行许可。转载请注明出处!
欢迎留言,提问 ^_^