Vite React项目npm run dev报错：node_modules文件访问被拒绝

问题描述 #

创建Vite React项目后，执行npm run dev时出现以下权限错误：

[ERROR] Cannot read file "node_modules/react/jsx-dev-runtime.js": Access is denied.
X [ERROR] Cannot read file "node_modules/react/index.js": Access is denied.
X [ERROR] Cannot read file "node_modules/react-dom/client.js": Access is denied.

已尝试多次删除node_modules、package-lock.json并重建项目，问题仍存在。项目配置文件及版本信息如下：

package.json #

{
  "name": "my-project",
  "private": true,
  "version": "0.0.0",
  "type": "module",
  "scripts": {
    "dev": "vite",
    "build": "vite build",
    "lint": "eslint . --ext js,jsx --report-unused-disable-directives --max-warnings 0",
    "preview": "vite preview"
  },
  "dependencies": {
    "react": "^18.2.0",
    "react-dom": "^18.2.0"
  },
  "devDependencies": {
    "@types/react": "^18.2.15",
    "@types/react-dom": "^18.2.7",
    "@vitejs/plugin-react": "^4.0.3",
    "eslint": "^8.45.0",
    "eslint-plugin-react": "^7.32.2",
    "eslint-plugin-react-hooks": "^4.6.0",
    "eslint-plugin-react-refresh": "^0.4.3",
    "vite": "^4.4.5"
  }
}

vite.config.js #

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

// https://vitejs.dev/config/
export default defineConfig({
  plugins: [react()],
})

main.jsx #

import React from 'react'
import ReactDOM from 'react-dom/client'
import App from './App.jsx'
import './index.css'

ReactDOM.createRoot(document.getElementById('root')).render(
  <React.StrictMode>
    <App />
  </React.StrictMode>,
)

相关版本：node@18.12.2，react@18.2.0，npm@9.3.1

解决方案 #

尝试以下步骤排查解决：

• 检查项目文件夹权限

  • Windows：右键项目文件夹 → 属性 → 安全，确保当前用户拥有「读取和写入」权限；取消文件夹的只读属性（常规选项卡），应用到所有子文件和文件夹。
  • Linux/macOS：执行命令sudo chmod -R 755 ./node_modules，赋予文件夹合理的读写执行权限（避免使用777）。

• 清理npm缓存并重装依赖
  执行以下命令：

  npm cache clean --force
  rm -rf node_modules package-lock.json # Windows系统替换为：rmdir /s /q node_modules && del package-lock.json
  npm install
  

• 以管理员身份运行终端

  • Windows：右键终端/命令提示符，选择「以管理员身份运行」，再进入项目目录执行依赖安装和启动命令。
  • Linux/macOS：使用sudo npm install和sudo npm run dev（注意：sudo会提升权限，谨慎使用，避免后续权限问题）。

• 排查杀毒软件/防火墙拦截
  部分杀毒软件会误拦截node_modules内的文件读取，暂时关闭杀毒软件或将项目文件夹加入信任列表后重试。

• 更换包管理工具或npm源

  • 切换国内npm源：npm config set registry https://registry.npmmirror.com，再重新执行npm install。
  • 尝试使用yarn：npm install -g yarn → yarn install → yarn dev。
  • 尝试使用pnpm：npm install -g pnpm → pnpm install → pnpm dev。

• 检查Node.js安装权限
  如果Node.js安装在系统级目录（如Windows的C:\Program Files），可能导致权限受限。建议重新安装Node.js到用户目录（如C:\Users\你的用户名\nodejs），安装时勾选「Add to PATH」选项。

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