问题：npm run dev 报错 "Missing script: 'dev'" 的常见原因及解决方法

Question

在使用 npm 运行 `npm run dev` 命令时，出现 `"Missing script: 'dev'"` 错误是一个常见问题。该错误通常表示在项目的 `package.json` 文件中没有定义名为 `dev` 的脚本。常见原因包括：项目未正确配置开发脚本、拼写错误、或使用了不同的脚本名称（如 `start` 或 `develop`）。解决方法包括：检查 `package.json` 中的 `scripts` 部分是否存在 `dev` 脚本；确认脚本名称拼写是否正确；如无则可手动添加，例如：`"dev": "next dev"`（针对 Next.js 项目）或其他框架对应的命令。此外，确保在项目根目录下执行命令，避免误入错误目录导致识别不到脚本。

Answer 1

解决 npm run dev 出现 "Missing script: 'dev'" 错误的深度解析

1. 问题现象

在使用 npm 运行命令 npm run dev 时，控制台输出如下错误：

Error: Missing script: 'dev'
    at run (...

这表明当前项目的 package.json 文件中未定义名为 dev 的脚本。

2. 常见原因分析

该问题通常由以下几个原因引起：

• 未定义 dev 脚本：项目中未在 scripts 字段中添加 dev 命令。
• 拼写错误：脚本名称可能拼写错误，如写成 devv 或 devel。
• 脚本名称不同：项目可能使用了其他开发命令，如 start、develop 或 dev-server。
• 目录错误：执行命令时不在项目根目录，导致 npm 无法识别 package.json。

3. 解决方案详解

根据上述原因，我们可以采取以下步骤进行排查和修复：

1. 检查 package.json 中的 scripts 配置：
   打开项目根目录下的 package.json 文件，查找 scripts 字段，确认是否存在 "dev": "..." 的定义。
2. 确认脚本名称是否正确：
   检查是否误将脚本写成 develop 或 start，并根据项目文档确认正确的开发命令。
3. 手动添加 dev 脚本：
   如果确实缺少该脚本，可根据项目类型手动添加。例如：
   • Next.js 项目："dev": "next dev"
   • Vue 项目："dev": "vite" 或 "dev": "webpack-dev-server"
   • React 项目："dev": "react-scripts start"
4. 确认执行路径是否正确：
   使用 pwd（Unix）或 cd（Windows）命令确认当前位于项目根目录，确保 package.json 可被正确读取。

4. 进阶排查流程图

以下流程图展示了从问题出现到最终解决的完整排查路径：

```mermaid graph TD A[执行 npm run dev] --> B{package.json 是否存在?} B -->|否| C[确认是否在项目根目录] B -->|是| D{是否存在 dev 脚本?} D -->|否| E[检查是否有其他脚本名称如 start] D -->|是| F[确认脚本拼写是否正确] E --> G[修改命令为正确脚本名称] F --> H[运行脚本] ```

5. 实际案例分析

假设你正在一个 Vue 项目中开发，执行 npm run dev 报错。打开 package.json 后发现：

{
  "scripts": {
    "start": "vite"
  }
}

这说明项目使用了 start 而非 dev 作为开发命令。解决方案是：

1. 运行 npm run start 启动项目。
2. 或修改为 "dev": "vite"，然后继续使用 npm run dev。