Vite执行npm run build --mode development报错：找不到development/index.html入口

云原生阿岚

2026-7-8

解决Vite构建时Could not resolve entry module "development/index.html"报错问题

问题根源

你遇到的报错是因为npm参数传递规则导致的：在npm脚本中，直接写npm run build --mode development时，npm会把--mode和development识别为自身的参数，而不是传递给vite build命令。Vite没有接收到mode参数，反而把development当成了要构建的入口文件路径，因此报错找不到development/index.html。

正确的命令写法

要将mode参数正确传递给Vite，需要在命令中添加--（用来分隔npm自身参数和脚本参数），正确命令如下：

npm run build -- --mode development

对应其他环境的构建命令：

# 构建staging环境
npm run build -- --mode staging
# 构建production环境
npm run build -- --mode production

验证环境变量是否生效

可以在项目代码中打印当前环境变量来确认配置是否生效，比如在main.js中添加：

console.log(import.meta.env.MODE); // 输出当前mode值，如development/staging/production
console.log(import.meta.env.VITE_YOUR_VAR); // 打印自定义的环境变量

简化命令的方案

如果不想每次都输入长命令，可以在package.json的scripts中预定义不同环境的构建命令：

{
  "scripts": {
    "build:dev": "vite build --mode development",
    "build:staging": "vite build --mode staging",
    "build": "vite build --mode production"
  }
}

之后直接执行npm run build:dev、npm run build:staging即可快速构建对应环境的包。