----frontendProject param doesn't work as expected

[chestnyh]

Current Behavior

Trying to specify frontend project to backen't project with --frontendProject param which suppose to create proxy as described in documentation here https://nx.dev/recipes/node/application-proxies

But no proxy file is created and api requests from frontend part are not proxied to backend part

Expected Behavior

--frontendProject should work as declared in documentation here - https://nx.dev/recipes/node/application-proxies

GitHub Repo

No response

Steps to Reproduce

To reproduce I running these commands:

1. Create workspace:

npx create-nx-workspace my-org --pm yarn 

Choosen options:

✔ Which stack do you want to use? · none
✔ Package-based monorepo, integrated monorepo, or standalone project? · integrated
✔ Do you want Nx Cloud to make your CI fast? · skip

2. Go to workspace folder:

cd my-org

3. Add react plugin to monorepo:

nx add @nx/react

4. Generate application:

nx generate @nx/react:app apps/site

Choosen options:

✔ Which stylesheet format would you like to use? · css
✔ Would you like to add React Router to this application? (y/N) · true
✔ Which E2E test runner would you like to use? · cypress
✔ Which bundler do you want to use to build the application? · webpack

5. Adding express plugin:

nx add @nx/express

6. Generate backend api and specify --frontendProject

nx g @nx/express:app api --directory=apps/api --frontendProject site

7. Add code which suppose to make request to api backend in my-org/apps/site/src/app/app.tsx:

import {useState, useEffect} from 'react';
/// ....
 const [apiResponse, setApiResponse] = useState({message: "Loading..."});
  useEffect(() => {
    fetch('/api').then(r=>r.json()).then(setApiResponse)
  }, []);

8. Running apps:

nx run-many -t serve

9. In browser go to page 'http://localhost:4200' and after reload in dev tool network I see /api 404 error
   

Nx Report

After `nx run-many -t serve` I see that everything is running:

 NX   Running target serve for 2 projects:

- site
- api

———————————————————————————————————————————————————————————————————————————————————————————————————————————————————————————————————————————————————————————————————————————————————————————————————————————————————————————————————————————————————————————————————————————————————

> nx run site:serve


> nx run api:serve:development

> webpack-cli serve --node-env=development

> nx run api:build
> webpack-cli build --node-env=production
<i> [webpack-dev-server] Project is running at:
<i> [webpack-dev-server] Loopback: http://localhost:4200/
<i> [webpack-dev-server] On Your Network (IPv4): http://192.168.0.178:4200/
<i> [webpack-dev-server] Content not from webpack is served from '/home/alex/Projects/monorepo-testing/my-org/apps/site/public' directory
chunk (runtime: main) main.js (main) 828 bytes [entry] [rendered]
webpack compiled successfully (1ed83f48e2b7edb5)
 NX   Successfully ran target build for project api
Debugger listening on ws://localhost:9229/1bee89a6-b576-4a62-910a-c98bec4ce0f4
For help, see: https://nodejs.org/en/docs/inspector

Listening at http://localhost:3333/api
Entrypoint main [big] 1.64 MiB (2.21 MiB) = runtime.js 47.2 KiB vendor.js 1.54 MiB main.js 60.6 KiB 3 auxiliary assets
Entrypoint styles 234 KiB (385 KiB) = runtime.js 47.2 KiB styles.css 119 bytes styles.js 187 KiB 3 auxiliary assets
chunk (runtime: runtime) main.js (main) 56.9 KiB [initial] [rendered]
chunk (runtime: runtime) runtime.js (runtime) 31.7 KiB [entry] [rendered]
chunk (runtime: runtime) styles.css, styles.js (styles) 180 KiB (javascript) 80 bytes (css/mini-extract) [initial] [rendered]
chunk (runtime: runtime) vendor.js (vendor) (id hint: vendor) 1.51 MiB [initial] [rendered] split chunk (cache group: vendor) (name: vendor)
webpack compiled successfully (f93c3d561791c76d)
No errors found.

Failure Logs

No response

Package Manager Version

yarn - 1.22.22

Operating System

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

Additional Information

After some research I found that project.json for frontend part(site) looks like this:

{
  "name": "site",
  "$schema": "../../node_modules/nx/schemas/project-schema.json",
  "sourceRoot": "apps/site/src",
  "projectType": "application",
  "tags": [],
  "// targets": "to see all targets run: nx show project site --web",
  "targets": {}
}

"targets" is empty onject
And after some debugging I found that code which is responsible for proxy file creation

nx/packages/node/src/generators/application/application.ts

Line 246 in dbad02a

if (projectConfig.targets && projectConfig.targets.serve) {

Checks if serve target exists.

[Coly010]

Hey! Thanks for raising this. It looks like a missing feature parity issue with our Inferred Plugin approach and Executor approach.

I do not have a workaround right now for you, but I'll look into this.