nrwl / nx

Smart Monorepos · Fast CI
https://nx.dev
MIT License
23.28k stars 2.32k forks source link

Angular Dynamic Module Federation SSR error after add @nx/nest #22476

Closed johnitvn closed 4 months ago

johnitvn commented 6 months ago

Current Behavior

I created a project then added an angular app using dynamic remote module federation with ssr. The target serve, serve ssr (including adding devRemotes) work well with angular host app

But after I tried to add an app using nestjs. The target serve, serve ssr (including devRemotes) of the angular host app cannot load remote modules

Expected Behavior

It should have worked fine like before I added nestjs app

GitHub Repo

No response

Steps to Reproduce

The first i have create project with bellow steps

npx create-nx-workspace --name=project --preset=apps --nxCloud=skip --packageManager=pnpm && cd project 
npx nx add @nx/angular
npx nx g @nx/angular:host apps/host --dynamic --ssr --standalone --style=scss --addTailwind --e2eTestRunner=playwright --projectNameAndRootFormat=as-provided --prefix=host
npx nx g @nx/angular:remote apps/remote-a --host=host --ssr --standalone --style=scss --addTailwind --e2eTestRunner=playwright --projectNameAndRootFormat=as-provided --prefix=remote-a
npx nx g @nx/angular:remote apps/remote-b --host=host --ssr --standalone --style=scss --addTailwind --e2eTestRunner=playwright --projectNameAndRootFormat=as-provided --prefix=remote-b
npx nx serve host --devRemotes=remote-a,remote-b

For now it's still work as expected. But after add @nx/nest it's ocure error

npx nx add @nx/nest
npx nx g @nx/nest:application server/gateways/api-gateway  --projectNameAndRootFormat=as-provided 
npx nx serve host --devRemotes=remote-a,remote-b

Here is browser console log error Capture

Nx Report

Node   : 20.11.1
OS     : linux-x64
pnpm   : 8.15.5

nx (global)        : 18.1.2
nx                 : 18.1.2
@nx/js             : 18.1.2
@nx/jest           : 18.1.2
@nx/eslint         : 18.1.2
@nx/workspace      : 18.1.2
@nx/angular        : 18.1.2
@nx/devkit         : 18.1.2
@nx/eslint-plugin  : 18.1.2
@nx/nest           : 18.1.2
@nx/node           : 18.1.2
@nx/playwright     : 18.1.2
@nx/web            : 18.1.2
@nx/webpack        : 18.1.2
typescript         : 5.3.3

Failure Logs

No response

Package Manager Version

pnpm 8.15.5

Operating System

Additional Information

No response

johnitvn commented 6 months ago

It's back to work after i remove plugin @nx/webpack/plugin in nx.json. But nestjs app can't serve

> nx run api-gateway:serve:development

 NX   Cannot find build target api-gateway:build:development for project api-gateway

Error: Cannot find build target api-gateway:build:development for project api-gateway
    at nodeExecutor (/home/johnitvn/project/node_modules/.pnpm/@nx+js@18.1.2_@swc-node+register@1.8.0_@swc+core@1.3.107_@types+node@18.16.9_nx@18.1.2_typescript@5.3.3/node_modules/@nx/js/src/executors/node/node.impl.js:28:15)
    at nodeExecutor.next (<anonymous>)
    at getLastValueFromAsyncIterableIterator (/home/johnitvn/project/node_modules/.pnpm/nx@18.1.2_@swc-node+register@1.8.0_@swc+core@1.3.107/node_modules/nx/src/utils/async-iterator.js:13:27)
    at iteratorToProcessStatusCode (/home/johnitvn/project/node_modules/.pnpm/nx@18.1.2_@swc-node+register@1.8.0_@swc+core@1.3.107/node_modules/nx/src/command-line/run/run.js:43:94)
    at /home/johnitvn/project/node_modules/.pnpm/nx@18.1.2_@swc-node+register@1.8.0_@swc+core@1.3.107/node_modules/nx/src/command-line/run/run.js:179:16
    at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
    at async handleErrors (/home/johnitvn/project/node_modules/.pnpm/nx@18.1.2_@swc-node+register@1.8.0_@swc+core@1.3.107/node_modules/nx/src/utils/params.js:9:16)
    at async process.<anonymous> (/home/johnitvn/project/node_modules/.pnpm/nx@18.1.2_@swc-node+register@1.8.0_@swc+core@1.3.107/node_modules/nx/bin/run-executor.js:59:28)

Maybe this plugin is conflict...

johnitvn commented 6 months ago

remove plugin @nx/webpack/plugin in nx.json add manual add build target to api-gateway app. So all of it work perfect.

"build": {
      "executor": "@nx/webpack:webpack",
      "options": {
        "outputPath": "dist/server/gateways/api-gateway",
        "main": "server/gateways/api-gateway/src/main.ts",
        "tsConfig": "server/gateways/api-gateway/tsconfig.app.json",
        "assets": ["server/gateways/api-gateway/src/assets"],
        "target": "node",
        "compiler": "tsc",
        "scripts": [],
        "webpackConfig": "server/gateways/api-gateway/webpack.config.js"
      },
      "configurations": {
        "production": {
          "optimization": true
        },
        "development": {
          "buildOptimizer": false,
          "optimization": false,
          "vendorChunk": true,
          "extractLicenses": false,
          "sourceMap": true,
          "namedChunks": true
        }
      },
      "defaultConfiguration": "production"
    },

This seems like a workaround to fix the error temporarily

Coly010 commented 4 months ago

This is fixed in latest however, another unrelated issue will end up resulting in hitting an error when adding the api app.

If you run your commands prefixed with NX_ADD_PLUGINS=false, you'll get a working setup! 🙂

github-actions[bot] commented 3 months ago

This issue has been closed for more than 30 days. If this issue is still occuring, please open a new issue with more recent context.