执行npm run build报ENOENT错误：文件实际存在却提示不存在求解决

问题现象 #

• 执行npm run build时抛出错误：node:internal/fs/utils:348 Error: ENOENT: no such file or directory
• 报错指向的文件实际存在，但构建始终失败
• npm run serve可正常编译运行，已尝试删除node_modules、package-lock.json，更新Node.js、npm，删除全局npm文件夹等常规方案，问题仍持续

环境信息 #

node v14.17.6
npm 9.1.3
Mac OS 12.5.1 (Monterey)
vue/cli-service": "^3.9.0
vue: "^2.6.14

排查与解决方案 #

1. 检查路径大小写一致性 #

MacOS文件系统默认大小写不敏感，但Node.js构建时会严格区分路径大小写。确认项目中所有import/require语句、vue.config.js配置里的文件路径，是否和实际文件的大小写完全匹配（比如实际文件是Header.vue，代码里不能写成header.vue）。

2. 清理Vue CLI构建缓存 #

执行命令清理构建缓存，避免缓存导致的异常：

npx vue-cli-service clean

清理完成后重新执行npm run build。

3. 修复项目文件权限 #

确保报错文件及父目录权限正确，执行以下命令修复（替换/path/to/your/project为你的项目实际路径）：

sudo chown -R $(whoami) /path/to/your/project
chmod -R 755 /path/to/your/project

4. 降级npm版本适配Node.js 14.x #

npm 9.x与Node.js 14.x存在兼容性问题，尝试降级npm到适配版本：

npm install -g npm@6.14.15

之后重新安装依赖：

rm -rf node_modules package-lock.json
npm install

5. 检查vue.config.js配置错误 #

确认vue.config.js中的outputDir、assetsDir、自定义copy-webpack-plugin等配置，是否存在指向不存在路径的设置。

6. 处理文件软链接问题 #

如果项目文件涉及软链接，Node.js构建时可能无法正确解析。可以：

• 将软链接替换为实际文件/目录
• 或在vue.config.js中配置webpack允许解析软链接：

module.exports = {
  configureWebpack: {
    resolve: {
      symlinks: false
    }
  }
}

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