nx serve works strangely with Webpack 5 and ESM

[tukusejssirs]

I want to build an app using Nx + Nest + Webpack 5 + TS + ESM + Nest Commander, but I have the following issue.

Reproduction steps:

0. [pnpm i] Install the dependencies.

1. [pnpm serve:gnew:dev or pnpm serve:gnew] nx serve does not work unless run with --inspect false and -r option being processed by (Nest) Commander.

$ pnpm serve:gnew:dev

> @gnew/[email protected] serve:gnew:dev $repo_root
> nx run gnew:serve -c development --inspect false --watch false


> nx run gnew:serve:development --inspect false --watch false

command : {
  inputs: [],
  options: {
    rrr: '$repo_root/node_modules/.pnpm/[email protected]/node_modules/source-map-support/register.js'
  }
}
{ stdAll: 'test', exitCode: 0 }

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

 >  NX   Successfully ran target serve for project gnew

2. [pnpm serve:gnew:dev:debug or pnpm serve:gnew:debug] When run with --inspect true, it is successful, but the app is not executed (at least no app logs are output).

$ pnpm serve:gnew:debug

> @gnew/[email protected] serve:gnew:debug $repo_root
> nx run gnew:serve --inspect true --host 0.0.0.0 --port 9221 --watch false


> nx run gnew:serve:development --inspect true --host 0.0.0.0 --port 9221 --watch false


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

 >  NX   Successfully ran target serve for project gnew

3. [node dist/apps/gnew/main.mjs] It works though when the app is built and executed using node.

$ node dist/apps/gnew/main.mjs
command : { inputs: [], options: {} }
{ stdAll: 'test', exitCode: 0 }

4. [pnpm serve:gnew:dev or pnpm serve:gnew] When I remove -r option (or comment out the @Option() decorator along with the parse*() method), nx serve --inspect false fails to output the logs too, though Nx says it was run successfully. Building and running the app using node works without issues.

$ pnpm serve:gnew:dev

> @gnew/[email protected] serve:gnew:dev $repo_root
> nx run gnew:serve -c development --inspect false --watch false


> nx run gnew:serve:development --inspect false --watch false


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

 >  NX   Successfully ran target serve for project gnew

[jmcdo29]

I believe this would have to do with how nx is passing node -r to register the source-map-support/register.js package so that the source maps are properly respected. This is one of those weird moments where essentially you'd be passing something like node -r source-map-support/register dist/apps/gnew/main.mjs -r some-other-option so commander could be seeing two -r's. I believe there should be a way to separate them out between the node command and your command, but I'll probably need to tinker with it a bit

[jmcdo29]

pnpm nx serve gnew --runtimeArgs='-r from-command-line'

This line on its own didn't work. The --inspect gets passed on and causes an error. I would say this is most likely an issue with how Nx is calling node programatically and how commander is parsing the arguments. That's definitely an error in Nx's format (nest-commander doesn't bold text by default) so it's something within their @nx/node:node executor.

[tukusejssirs]

This line on its own didn't work. The --inspect gets passed on and causes an error. I would say this is most likely an issue with how Nx is calling node programatically and how commander is parsing the arguments. That's definitely an error in Nx's format (nest-commander doesn't bold text by default) so it's something within their @nx/node:node executor.

Sorry for confusing you. Yes, I have tried it with and without --inspect false (but copied the command without it), all failed, until I added --watch false. I have already shared the output in this comment, but here you go again:

$ pnpm nx serve gnew --inspect=false --runtimeArgs="-r"

> nx run gnew:serve:development --inspect=false --runtimeArgs=-r

error: unknown option '-r'


>  NX  Process exited with code 1, waiting for changes to restart...

$ pnpm nx serve gnew --inspect=false --runtimeArgs="-r from-command-line"

> nx run gnew:serve:development --inspect=false --runtimeArgs=-r from-command-line

error: unknown option '-r'


>  NX  Process exited with code 1, waiting for changes to restart...

[jmcdo29]

Go figure 🤷 Might be a difference of shells? Or maybe how the OS is interpreting things and sending them on? Really hard to say. I still think it's an issue with nx more than nest-commander as nest-commander doesn't do command line arg validation

pnpm nx serve gnew --inspect=false --runtimeArgs="-r from-command-line"
# Found existing alias for "pnpm". You should use: "pn"

> nx run gnew:serve:development --inspect=false --runtimeArgs=-r from-command-line

command : { inputs: [], options: { rrr: ' from-command-line' } }
{ stdAll: 'test', exitCode: 0 }

>  NX  Process exited with code 0, waiting for changes to restart...

OS: Arch Linux 6.3.2
Shell: zsh 5.9
Node: 18.16.0
Package Manager: pnpm 8.4.0
Nx: 16.2.1

[tukusejssirs]

Our OS and versions are quick similar:

Type	Name	version	Is different?
OS	Arch Linux	rolling	no
Kernel	Linux	6.3.2-arch1-1	no
Shell	BASH	5.1.16	yes
	Node	20.2.0	yes (mine is newer)
Package Manager	PNPM	8.3.1	yes (yours is newer)
	Nx	16.2.1	no

I’ll upgrade my pnpm version, but I think that should not have much to do with this issue. Same for the shell: AFAIK in this case, both ZSH and BASH behave the same way.

I still think it's an issue with nx more than nest-commander as nest-commander doesn't do command line arg validation

Agreed. So I’ll open an issue there.

---

Thanks again for help! 🙏

[tukusejssirs]

I think I understand now the difference in your and my output: you run pnpm nx run gnew:serve:development --inspect=false --runtimeArgs="-r from-command-line" with -r option defined using @Option() decorator, however, I executed it when it was commented out. Therefore, now I know how to run it when I need to define my own -r option value.

However, when the -r option is not present in my app, pnpm nx run gnew:serve:development --inspect=false --runtimeArgs="-r from-command-line" will fail just as I have mentioned above.

Still, it seems like an issue with Nx, not with Nest Commander.