Vite React项目执行npm run dev/build命令时出现错误

常见修复方案 #

• 检查vite.config.ts的变量引用
  报错核心是代码中使用了未定义的plugin变量。打开C:...\vite.config.ts，确认是否存在类似plugins: [plugin()]的错误写法——你需要导入具体的Vite插件后再使用，比如：

  // 错误写法
  import { defineConfig } from 'vite'
  export default defineConfig({
    plugins: [plugin()] // plugin未定义
  })
  
  // 正确写法（以Vue插件为例）
  import { defineConfig } from 'vite'
  import vue from '@vitejs/plugin-vue'
  export default defineConfig({
    plugins: [vue()]
  })
  

  同时排查是否有变量名拼写错误，比如把插件的正确名称误写为plugin。

• 清理依赖缓存并重装
  依赖缓存损坏可能引发异常，执行以下命令：

  rm -rf node_modules package-lock.json
  npm install
  

• 验证Vite与插件版本兼容性
  若近期更新过Vite，可能存在插件版本不匹配问题。可以回退到之前能正常运行的Vite版本：

  npm install vite@[原版本号] # 替换为你之前使用的具体版本
  

  或查看对应插件的文档，确认其支持的Vite版本范围。

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