Laravel项目安装Vue运行npm run dev提示找不到vite.js模块报错

学习Laravel与Vue.js技术栈，跟随教程做安装配置，前期所有步骤执行正常，到运行npm run dev命令时抛出异常。
对应教程21分19秒位置执行的操作命令如下：

npm init vite vue
cd vue/
npm install
npm run dev

执行最后一条npm run dev命令后，终端输出报错：

PS C:\Laravel&React Projects\laravel-vue-survey\vue> npm run dev

> vue@0.0.0 dev
> vite

'React' is not recognized as an internal or external command,
operable program or batch file.
node:internal/modules/cjs/loader:949
  throw err;
  ^

Error: Cannot find module 'C:\vite\bin\vite.js'
    at Module._resolveFilename (node:internal/modules/cjs/loader:946:15)
        at Module._load (node:internal/modules/cjs/loader:787:27)
    at Function.executeUserEntryPoint [as runMain] (node:internal/modules/cjs/loader:77:12)
    at node:internal/main/run_main_module:17:47 {
  code: 'MODULE_NOT_FOUND',
  requireStack: []
}

Node.js v18.4.0

两个报错分别对应独立的配置问题：

1. 'React' is not recognized as an internal or external command：初始化Vite项目时用了简写命令没有显式指定Vue模板，大概率初始化时选错了框架选项，生成了错误的脚本配置，再叠加系统环境变量里存在异常的无效路径，触发了命令识别错误。
2. Cannot find module 'C:\vite\bin\vite.js'：本地npm全局路径配置错误，系统没有去项目node_modules目录下找安装好的vite依赖，反而错误指向了C盘根目录下不存在的vite路径。
   另外当前项目存放路径包含&特殊字符和空格，Node.js部分工具链解析这类路径时容易出现未知异常，也是潜在诱因。

按顺序操作即可解决：

• 清理错误生成的项目文件和npm缓存：

# 回到Laravel项目根目录，删除初始化错误的vue文件夹
Remove-Item -Recurse -Force .\vue\
# 强制清理npm缓存
npm cache clean --force

• 修正npm全局路径配置，避免错误指向C盘根目录：

npm config set prefix "%APPDATA%\npm"

执行完这行命令后直接关闭当前终端，重新打开新的PowerShell窗口进入项目目录，旧终端的环境变量缓存不会自动更新。

• 用完整命令显式指定Vue模板初始化Vite项目，不要用简写避免选错框架：

npm init vite@latest vue -- --template vue

• 进入目录安装依赖、启动服务：

cd vue
npm install
npm run dev

如果按以上步骤操作后还是报路径相关错误，直接打开系统环境变量配置面板，检查Path项里是否存在手动添加的C:\vite这类无效的Node相关路径，删除后重启电脑再操作。如果还是异常，把整个项目移动到不带空格、不带特殊字符的纯英文路径下（比如C:\dev\laravel-vue-survey）再重新走一遍安装流程即可。

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