欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

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

 更新時間：2023年06月14日 11:33:50   作者：天問  
這篇文章主要為大家介紹了vite.config配置alias時報錯：Error: ENOTEMPTY: directory not empty, rmdir解決方法詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪

一、前言

使用 vite 工具構(gòu)建項(xiàng)目時，為了 import 方便，一般會配置 alias 別名。例如：@ 代表 src 目錄 。配置完成后重啟服務(wù)出現(xiàn)報錯：Error: ENOTEMPTY: directory not empty, rmdir 'D:/project/vite-react/node_modules/.vite/deps'。

Vite

  • alias 配置：
// vite.config.js
import { defineConfig } from 'vite'
import react from '@vitejs/plugin-react'
export default defineConfig({
  plugins: [react()],
  resolve: {
    alias: {
      '@': '/src',
      '@css': '/src/styles',
    }
  },
})
  • 報錯日志：
> 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 在啟動本地服務(wù)后，會生成一些緩存文件，以提高性能提升速度。在配置 alias 后沒有清空緩存文件，所以出現(xiàn)報錯。

三、解決辦法

  • 刪除 vite 的緩存目錄，默認(rèn)緩存目錄在 node_modules/.vite 中，刪除 .vite 文件夾即可。
  • 還有另一種方法，使用 --force 命令行選項(xiàng)，試了幾次發(fā)現(xiàn)并不好使。于是配置了一個 npm 的 pre 鉤子來處理，當(dāng)執(zhí)行 npm run dev 命令的時候，會先執(zhí)行 rd /s /q node_modules\\.vite 命令刪除緩存目錄 node_modules/.vite。

windows 系統(tǒng)：

{
  "scripts": {
    "predev": "rd /s /q node_modules\\.vite",
    "dev": "vite --host"
  }
}

macOS 、 Linux 系統(tǒng)：

{
  "scripts": {
    "predev": "rm -rf ./node_modules/.vite",
    "dev": "vite --host"
  }
}

再次啟動服務(wù)，一切正常。

以上就是vite.config配置alias時報錯Error: ENOTEMPTY: directory not empty, rmdir的詳細(xì)內(nèi)容，更多關(guān)于vite.config配置alias報錯的資料請關(guān)注腳本之家其它相關(guān)文章！

相關(guān)文章

  • vue檢測對象和數(shù)組的變化分析

    vue檢測對象和數(shù)組的變化分析

    這篇文章給大家分享了vue檢測對象和數(shù)組的變化的相關(guān)知識點(diǎn)與實(shí)例代碼，有興趣的朋友參考下。
    2018-06-06
  • Vite版本更新檢查實(shí)現(xiàn)頁面自動刷新的解決思路

    Vite版本更新檢查實(shí)現(xiàn)頁面自動刷新的解決思路

    這篇文章主要給大家介紹了關(guān)于Vite版本更新檢查實(shí)現(xiàn)頁面自動刷新的解決思路,文中通過實(shí)例代碼介紹的非常詳細(xì),對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友可以參考下
    2023-02-02
  • vue實(shí)現(xiàn)虛擬列表組件解決長列表性能問題

    vue實(shí)現(xiàn)虛擬列表組件解決長列表性能問題

    這篇文章主要介紹了在vue中實(shí)現(xiàn)虛擬列表組件，解決長列表性能問題,本文給大家分享實(shí)現(xiàn)思路及實(shí)例代碼，需要的朋友可以參考下
    2022-07-07
  • 淺談nuxtjs校驗(yàn)登錄中間件和混入(mixin)

    淺談nuxtjs校驗(yàn)登錄中間件和混入(mixin)

    這篇文章主要介紹了淺談nuxtjs校驗(yàn)登錄中間件和混入(mixin)，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧
    2020-11-11
  • 詳解Vue.js動態(tài)綁定class

    詳解Vue.js動態(tài)綁定class

    Vue.js的核心是一個響應(yīng)的數(shù)據(jù)綁定系統(tǒng)，它允許我們在普通 HTML 模板中使用特殊的語法將 DOM “綁定”到底層數(shù)據(jù)。被綁定的DOM 將與數(shù)據(jù)保持同步，每當(dāng)數(shù)據(jù)有改動，相應(yīng)的DOM視圖也會更新?；谶@種特性，通過vue.js動態(tài)綁定class就變得非常簡單。一起來看下吧
    2016-12-12
  • 一文教會你如何運(yùn)行vue項(xiàng)目

    一文教會你如何運(yùn)行vue項(xiàng)目

    最近因?yàn)楣卷?xiàng)目問題,開始學(xué)習(xí)vue,這篇文章主要給大家介紹了關(guān)于如何運(yùn)行vue項(xiàng)目的相關(guān)資料,文中還介紹了如何運(yùn)行別人的項(xiàng)目,需要的朋友可以參考下
    2022-06-06
  • 使用mockjs如何生成隨機(jī)數(shù)據(jù)

    使用mockjs如何生成隨機(jī)數(shù)據(jù)

    Mockjs是一個用于生成隨機(jī)數(shù)據(jù)和攔截Ajax請求的庫,可以與Vue和Axios結(jié)合使用,提高前端開發(fā)效率,通過在項(xiàng)目中引入Mock.js文件,可以模擬后端API,攔截Ajax請求并返回自定義響應(yīng),這種方法適用于在后端尚未開發(fā)完成時的前端開發(fā)測試
    2024-10-10
  • vue父組件異步獲取數(shù)據(jù)傳給子組件的方法

    vue父組件異步獲取數(shù)據(jù)傳給子組件的方法

    這篇文章主要介紹了vue父組件異步獲取數(shù)據(jù)傳給子組件,需要的朋友可以參考下
    2018-07-07
  • vue最強(qiáng)table vxe-table 虛擬滾動列表 前端導(dǎo)出問題分析

    vue最強(qiáng)table vxe-table 虛擬滾動列表 前端導(dǎo)出問題分析

    最近遇到個問題,后臺一次性返回2萬條列表數(shù)據(jù)并且需求要求所有數(shù)據(jù)必須全部展示,不能做假分頁,怎么操作呢,下面通過本文介紹下vue最強(qiáng)table vxe-table 虛擬滾動列表 前端導(dǎo)出問題,感興趣的朋友一起看看吧
    2023-10-10
  • 解決vue A對象賦值給B對象,修改B屬性會影響到A的問題

    解決vue A對象賦值給B對象,修改B屬性會影響到A的問題

    今天小編就為大家分享一篇解決vue A對象賦值給B對象,修改B屬性會影響到A的問題，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧
    2018-09-09

最新評論