feat(angular): support esbuild middleware functions

[dmitry-stepanenko]

Current Behavior

Angular has added an ability to provide both plugins and middleware functions. However nx now only leverages the exposed plugins API.

Expected Behavior

Should be able to configure middleware functions in the @nx/angular:dev-server executor.

Related Issue(s)

Fixes #

[vercel]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Updated (UTC)
nx-dev	✅ Ready (Inspect)	Visit Preview	Jan 22, 2024 4:19pm

[nx-cloud]

☁️ Nx Cloud Report

CI is running/has finished running commands for commit 8b5265d. As they complete they will appear below. Click to see the status, the terminal output, and the build insights.

📂 See all runs for this CI Pipeline Execution

---

✅ Successfully ran 6 targets

• nx affected --target=e2e --base=87256aae6664a6f46cc02c5b41ccc2c4611361eb --head=8b5265ddf623aa268b540872a3faa898a250bb83 --parallel=1
• nx affected --targets=lint,test,build --base=87256aae6664a6f46cc02c5b41ccc2c4611361eb --head=8b5265ddf623aa268b540872a3faa898a250bb83 --parallel=3
• nx run-many -t check-imports check-commit check-lock-files check-codeowners documentation --parallel=1 --no-dte
• nx-cloud record -- nx format:check --base=87256aae6664a6f46cc02c5b41ccc2c4611361eb --head=8b5265ddf623aa268b540872a3faa898a250bb83
• nx documentation --no-dte
• nx affected -t e2e-macos --parallel=1 --base=87256aae6664a6f46cc02c5b41ccc2c4611361eb --head=8b5265ddf623aa268b540872a3faa898a250bb83

---

Sent with 💌 from NxCloud.

[dmitry-stepanenko]

Also, should I update the docs for dev-server with a mention of esbuildMiddleware prop similarly to https://nx.dev/nx-api/angular/executors/browser-esbuild ?

[dmitry-stepanenko]

Hi @leosvelperez, any chance this will be merged for the 17.3.0 release?

[leosvelperez]

Hi @leosvelperez, any chance this will be merged for the 17.3.0 release?

Yeah. I have it on my list for early next week. Thanks for contributing this!

[leosvelperez]

hey @dmitry-stepanenko! Thanks again for contributing this!

Also, should I update the docs for dev-server with a mention of esbuildMiddleware prop similarly to https://nx.dev/nx-api/angular/executors/browser-esbuild ?

Yeah, the current dev-server description actually requires an overhaul. It's solely focused on the prior state where only webpack was supported. You can take a stab at that if you want, but I think it requires more changes than what this PR is for. I also want to improve the examples to be more like the ones in https://github.com/nrwl/nx/pull/20556/files#diff-f7afde405397d901e0e6d3a714023e3b06448c5976af8b894db9aede4cfc2e1c.

We can skip this for now and do it separately. Let me know if you'd like to take a stab at it. Otherwise, I'll make those changes once this is merged.

[dmitry-stepanenko]

Thanks @leosvelperez. I will leave the docs for you in this case so that there's no back and forth on wording

[leosvelperez]

Sorry. One thing I forgot, we need to validate at runtime that the option was not provided when the workspace is using an Angular version that doesn't support it. Similar to what we do in https://github.com/nrwl/nx/blob/master/packages/angular/src/builders/webpack-server/webpack-server.impl.ts#L99.

[dmitry-stepanenko]

Oh, my bad, should have noticed that 🙈

Copied the error from the browser-esbuild executor

[leosvelperez]

LGTM! 🎉

[github-actions]

This pull request has already been merged/closed. If you experience issues related to these changes, please open a new issue referencing this pull request.