Vue3新手执行npm run dev时遇vite.config.js加载失败问题求助

Hey there, fellow Vue3 newbie! I’ve run into this exact issue before, so let’s break it down and fix it quickly.

错误原因分析 #

The error you’re seeing (failed to load config from [path]/vite.config.js) is caused by the # character in your project file path: C:\Users\Lucas\Desktop#Fac\Vue3\learning-vue3.

While Windows allows # in folder names, Vite treats file paths like URLs under the hood—and in URLs, # is reserved for anchor links. This means Vite is misinterpreting the path, cutting it off at the # and failing to locate your vite.config.js file properly.

修复步骤 #

1. Move your project to a path without special characters
   Rename the Desktop#Fac folder to something like Desktop-Fac or just Fac, then relocate your project to a clean path like:

   C:\Users\Lucas\Desktop\Fac\Vue3\learning-vue3
   

   Stick to letters, numbers, hyphens, or underscores for folder names—avoid spaces, #, @, or other special characters entirely.

2. Clean dependencies and re-install (if needed)
   Sometimes cached files can cause hiccups after moving the project. Run these commands in your project folder:

   • Delete the node_modules folder (Windows command):

     rmdir /s /q node_modules
     

   • Delete the lock file:

     del package-lock.json
     

   • Reinstall dependencies:

     npm install
     

   • Start the dev server again:

     npm run dev
     

额外提示 #

Your vite.config.js code looks totally fine—no issues there! The problem is 100% related to the invalid path character. This is a common gotcha with Vite and Windows, since Windows is more permissive with folder names than URL standards allow.

内容的提问来源于stack exchange，提问作者Benedito