nx: fix: 🐛 migrating to 18.0.x gives error: Cannot find configuration for task workspace:serve

Current Behavior

After upgrading to 18.x, we are no longer able to serve our SPAs. Instead, it errors out.

The project.json looks like this:

{
  "name": "extranet",
  "$schema": "../../node_modules/nx/schemas/project-schema.json",
  "projectType": "application",
  "sourceRoot": "apps/extranet/src",
  "prefix": "wink",
  "targets": {
    "build": {
      "executor": "@angular-devkit/build-angular:application",
      "outputs": ["{options.outputPath}"],
      "options": {
        "allowedCommonJsDependencies": [
          "hammerjs",
          "clone-deep",
          "lodash.clonedeep",
          "lodash.debounce",
          "flat",
          "fast-sha256",
          "rfdc"
        ],
        "baseHref": "/",
        "outputPath": "dist/apps/extranet",
        "index": "apps/extranet/src/index.html",
        "browser": "apps/extranet/src/main.ts",
        "polyfills": ["zone.js"],
        "tsConfig": "apps/extranet/tsconfig.app.json",
        "stylePreprocessorOptions": {
          "includePaths": ["shared-styles/common", "shared-styles/extranet"]
        },
        "assets": [
          "apps/extranet/src/assets",
          "apps/extranet/src/manifest.json",
          "apps/extranet/src/robots.txt"
        ],
        "styles": [
          "node_modules/ng-sortgrid/styles/ngsg.css",
          "node_modules/npm-font-open-sans/open-sans.css",
          "apps/extranet/src/assets/styles/traveliko.css",
          "shared-styles/extranet/theme/default/styles.scss"
        ],
        "scripts": []
      },
      "configurations": {
        "production": {
          "fileReplacements": [
            {
              "replace": "apps/extranet/src/environments/environment.ts",
              "with": "apps/extranet/src/environments/environment.prod.ts"
            }
          ],
          "baseHref": "/",
          "optimization": {
            "scripts": true,
            "styles": {
              "minify": true,
              "inlineCritical": true
            },
            "fonts": true
          },
          "outputHashing": "all",
          "sourceMap": {
            "scripts": true,
            "hidden": true
          },
          "namedChunks": false,
          "extractLicenses": true,
          "budgets": [
            {
              "type": "initial",
              "maximumWarning": "3mb",
              "maximumError": "5mb"
            },
            {
              "type": "anyComponentStyle",
              "maximumWarning": "25kb",
              "maximumError": "30kb"
            }
          ],
          "serviceWorker": "apps/extranet/ngsw-config.json"
        },
        "staging": {
          "fileReplacements": [
            {
              "replace": "apps/extranet/src/environments/environment.ts",
              "with": "apps/extranet/src/environments/environment.staging.ts"
            }
          ],
          "baseHref": "/",
          "optimization": {
            "scripts": true,
            "styles": {
              "minify": true,
              "inlineCritical": true
            },
            "fonts": true
          },
          "outputHashing": "all",
          "sourceMap": {
            "scripts": true,
            "hidden": true
          },
          "namedChunks": false,
          "extractLicenses": true,
          "budgets": [
            {
              "type": "initial",
              "maximumWarning": "3mb",
              "maximumError": "5mb"
            },
            {
              "type": "anyComponentStyle",
              "maximumWarning": "25kb",
              "maximumError": "30kb"
            }
          ],
          "serviceWorker": "apps/extranet/ngsw-config.json"
        },
        "development": {
          "optimization": false,
          "extractLicenses": false,
          "sourceMap": true,
          "namedChunks": true
        }
      },
      "defaultConfiguration": "production"
    },
    "serve": {
      "executor": "@angular-devkit/build-angular:dev-server",
      "configurations": {
        "development": {
          "buildTarget": "extranet:build:development"
        },
        "production": {
          "buildTarget": "extranet:build:production"
        }
      }
    },
    "extract-i18n": {
      "executor": "@angular-devkit/build-angular:extract-i18n",
      "options": {
        "buildTarget": "extranet:build"
      }
    },
    "lint": {
      "executor": "@nx/eslint:lint",
      "outputs": ["{options.outputFile}"]
    },
    "test": {
      "executor": "@nx/jest:jest",
      "outputs": ["{workspaceRoot}/coverage/apps/extranet"],
      "options": {
        "jestConfig": "apps/extranet/jest.config.ts"
      }
    }
  },
  "tags": ["domain:extranet", "type:app"],
  "implicitDependencies": []
}

Expected Behavior

On v17.x, our apps serve up SPAs without any issues.

GitHub Repo

No response

Steps to Reproduce

  1. Upgrade from 17 -> 18 with npx nx migrate latest
  2. Start the app: node --max_old_space_size=16384 ./node_modules/.bin/nx serve --host=dev.wink.travel --port=8001 --project=extranet --ssl=true --ssl-key=./certs/dev.wink.travel-key.pem --ssl-cert=./certs/dev.wink.travel.pem --parallel --configuration=development

Nx Report

Node   : 20.11.0
   OS     : darwin-arm64
   yarn   : 1.22.21
   
   nx (global)        : 17.1.3
   nx                 : 18.0.3
   @nx/js             : 18.0.3
   @nx/jest           : 18.0.3
   @nx/linter         : 18.0.3
   @nx/eslint         : 18.0.3
   @nx/workspace      : 18.0.3
   @nx/angular        : 18.0.3
   @nx/cypress        : 18.0.3
   @nx/devkit         : 18.0.3
   @nx/eslint-plugin  : 18.0.3
   @nx/storybook      : 18.0.3
   @nrwl/tao          : 18.0.3
   @nx/web            : 18.0.3
   @nx/webpack        : 18.0.3
   typescript         : 5.3.3
   ---------------------------------------
   Community plugins:
   @compodoc/compodoc               : 1.1.23
   @fortawesome/angular-fontawesome : 0.14.1
   @jscutlery/semver                : 4.2.0
   @ng-bootstrap/ng-bootstrap       : 16.0.0
   @ngneat/transloco                : 6.0.4
   @ngrx/component                  : 17.1.0
   @ngrx/component-store            : 17.1.0
   @ngrx/data                       : 17.1.0
   @ngrx/effects                    : 17.1.0
   @ngrx/entity                     : 17.1.0
   @ngrx/router-store               : 17.1.0
   @ngrx/schematics                 : 17.1.0
   @ngrx/store                      : 17.1.0
   @ngrx/store-devtools             : 17.1.0
   @storybook/angular               : 7.6.13
   angular-calendar                 : 0.31.0

Failure Logs

>  NX   Cannot find configuration for task workspace:serve

Package Manager Version

Yarn 1.22.21

Operating System

  • macOS
  • Linux
  • Windows
  • Other (Please specify)

Additional Information

No response

About this issue

  • Original URL
  • State: open
  • Created 5 months ago
  • Comments: 17 (10 by maintainers)

Most upvoted comments

@beeman thanks for the detailed reproduction!

In your case, the serve target is not available for the project. Instead, you have the dev and start targets. Those are the commands the Next.js CLI provides to run your applications and the new inferred targets for Next.js reflect that.

Thanks, @leosvelperez, running pnpm nx dev web works.

However, for me this is a breaking change between v17 and v18 with no deprecation, I would expect the serve command to still work and warn me that it’s being deprecated and removed in the next major. That would have easily saved me (and my mentee) like 3 or 4 hours yesterday.

You can see the available targets by running pnpm nx show project web --web.

I think having to do this is a huge step down from opening a file and checking what’s there. In addition, this doesn’t “just work” when running it inside a container or remote host, and running this command without the --web flag leaves an unreadable blob of JSON, which would require additional tooling to read it.

On the other hand, a file can just be opened and looked at, regardless where you have it 💡

image

But I understand both of my comments are out of the scope of this issue so I’ll pick them up elsewhere.

+1
beeman on Feb 13, 2024

@bjornharvold thanks for reporting this!

Could you please post the project configuration for the workspace project? You provided the project configuration for the extranet project, but the failure logs reference the workspace:serve target which is not from that project.

Also, could you tell me if you have a plugins entry in your nx.json? If you do, could you share it?

@beeman thanks for the detailed reproduction!

In your case, the serve target is not available for the project. Instead, you have the dev and start targets. Those are the commands the Next.js CLI provides to run your applications and the new inferred targets for Next.js reflect that. You can see the available targets by running pnpm nx show project web --web. Note the new targets are explained in our docs: https://nx.dev/nx-api/next#using-nextjs. Also, you can customize the targets if you prefer to stick with serve for one of them by configuring the plugin in nx.json accordingly:

{
  ...
  "plugins": [
    {
      "plugin": "@nx/next/plugin",
      "options": {
        "buildTargetName": "build",
-       "devTargetName": "dev",
+       "devTargetName": "serve",
        "startTargetName": "start"
        "startTargetName": "serve"
      }
    },
    ...
  ]
}
+1
leosvelperez on Feb 13, 2024
Read more comments on GitHub
← nx: findOriginalKeys is not a function or its return value is not iterable
nx: Generate @nrwl/node:application command not working →