执行nx serve frontend报错：NX下一代构建系统无法运行前端应用

问题详情 #

运行命令nx serve frontend时触发如下错误：

> nx run frontend:serve:development


 >  NX   运行启动

   
{
  "meta": {
    "nxCloudVersion": "latest"
  },
  "branch": null,
  "runGroup": "8d44d4811566fc991ad067785087e06ee8f245e0",
  "ciExecutionId": null,
  "ciExecutionEnv": "",
  "hashes": [
    "c7bb0f1dc0715bc179aaffff98f78c6ad7843ed55398dca6b34657f16db2193b"
  ]
}

运行启动耗时：391
[ 信息 ]  在D:\projects\my-apps\interview-prep\apps\frontend\proxy.conf.json找到代理配置
类型错误：无法读取未定义对象的属性（'executor'）
    at getNxContext (D:\projects\my-apps\interview-prep\node_modules\.pnpm\@nrwl+next@15.8.9_hiw5yk7bsnojr6hab6ukoqdfju\node_modules\@nrwl\next\plugins\with-nx.js:43:45)
    at D:\projects\my-apps\interview-prep\node_modules\.pnpm\@nrwl+next@15.8.9_hiw5yk7bsnojr6hab6ukoqdfju\node_modules\@nrwl\next\plugins\with-nx.js:104:106
    at Generator.next (<anonymous>)
    at fulfilled (D:\projects\my-apps\interview-prep\node_modules\.pnpm\tslib@2.5.0\node_modules\tslib\tslib.js:164:62)
    at processTicksAndRejections (node:internal/process/task_queues:96:5)

 —————————————————————————————————————————————————————————————————————————————————————————————————————————— 
 >  NX   运行项目frontend的serve目标失败

   失败任务：

   - frontend:serve:development

   提示：使用--verbose参数运行命令以获取更多详细信息。

项目project.json配置如下：

{
  "name": "frontend",
  "$schema": "../../node_modules/nx/schemas/project-schema.json",
  "sourceRoot": "apps/frontend",
  "projectType": "application",
  "targets": {
    "build": {
      "executor": "@nrwl/next:build",
      "outputs": ["{options.outputPath}"],
      "defaultConfiguration": "production",
      "options": {
        "root": "apps/frontend",
        "outputPath": "dist/apps/frontend"
      },
      "configurations": {
        "development": {
          "outputPath": "apps/frontend"
        },
        "production": {}
      }
    },
    "serve": {
      "executor": "@nrwl/next:server",
      "defaultConfiguration": "development",
      "options": {
        "buildTarget": "frontend:build",
        "dev": true,
        "proxyConfig": "apps/frontend/proxy.conf.json"
      },
      "configurations": {
        "development": {
          "buildTarget": "frontend:build:development",
          "dev": true
        },
        "production": {
          "buildTarget": "frontend:build:production",
          "dev": false
        }
      }
    },
    "export": {
      "executor": "@nrwl/next:export",
      "options": {
        "buildTarget": "frontend:build:production"
      }
    },
    "test": {
      "executor": "@nrwl/jest:jest",
      "outputs": ["{workspaceRoot}/coverage/{projectRoot}"],
      "options": {
        "jestConfig": "apps/frontend/jest.config.ts",
        "passWithNoTests": true
      },
      "configurations": {
        "ci": {
          "ci": true,
          "codeCoverage": true
        }
      }
    },
    "lint": {
      "executor": "@nrwl/linter:eslint",
      "outputs": ["{options.outputFile}"],
      "options": {
        "lintFilePatterns": ["apps/frontend/**/*.{ts,tsx,js,jsx}"]
      }
    }
  },
  "tags": []
}

项目昨日可正常运行，无明确变更记录。

解决方案 #

1. 清理依赖缓存并重装依赖 #

依赖损坏或缓存异常是常见诱因，执行以下步骤：

• 清理pnpm缓存：pnpm store prune
• 删除本地依赖和锁文件：
  Windows：

  rmdir /s /q node_modules
  del pnpm-lock.yaml
  

  macOS/Linux：

  rm -rf node_modules
  rm pnpm-lock.yaml
  

• 重新安装依赖：pnpm install

2. 统一NX相关包版本 #

检查package.json中所有@nrwl/开头的包（如@nrwl/workspace、@nrwl/next、@nrwl/jest等），确保版本完全一致（当前报错中@nrwl/next为15.8.9），修改后重新执行依赖安装。

3. 重置NX本地缓存 #

执行nx reset清理NX的缓存数据，之后重新运行nx serve frontend。

4. 验证build目标可用性 #

单独运行build命令确认build目标配置无问题：

nx build frontend:development

如果build命令正常执行，说明问题出在serve流程对build目标的读取逻辑中，可进一步排查Next.js配置。

5. 检查Next.js配置文件 #

确认apps/frontend/next.config.js中正确使用withNx插件，示例配置如下：

const { withNx } = require('@nrwl/next');

module.exports = withNx({
  // 你的Next.js配置项
});

若近期修改过该文件，可尝试恢复到之前的正常版本。

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