can't run nestjs project if it's using esm

[robertIsaac]

Current Behavior

it fails to build/serve

Expected Behavior

it works just fine

GitHub Repo

https://github.com/robertIsaac/nx-nest-esm

Steps to Reproduce

1. clone the project and try to run it

Nx Report

Node   : 18.16.0
   OS     : win32-x64
   npm    : 9.6.7

   nx                 : 16.10.0
   @nx/js             : 16.10.0
   @nx/jest           : 16.10.0
   @nx/linter         : 16.10.0
   @nx/workspace      : 16.10.0
   @nx/devkit         : 16.10.0
   @nx/eslint-plugin  : 16.10.0
   @nx/nest           : 16.10.0
   @nx/node           : 16.10.0
   @nrwl/tao          : 16.10.0
   @nx/webpack        : 16.10.0
   nx-cloud           : 16.5.2
   typescript         : 5.1.6

Failure Logs

Error [ERR_REQUIRE_ESM]: require() of ES Module C:\Users\rober\test\nx-nest-esm\apps\nx-nest-esm\webpack.config.js from C:\Users\rober\test\nx-nest-esm\node_modules\@nx\webpack\src\utils\webpack\custom-webpack.js not supported.
Instead change the require of webpack.config.js in C:\Users\rober\test\nx-nest-esm\node_modules\@nx\webpack\src\utils\webpack\custom-webpack.js to a dynamic import() which is available in all CommonJS modules.
    at require.extensions.<computed> [as .js] (C:\Users\rober\test\nx-nest-esm\node_modules\ts-node\dist\index.js:851:20)
    at resolveCustomWebpackConfig (C:\Users\rober\test\nx-nest-esm\node_modules\@nx\webpack\src\utils\webpack\custom-webpack.js:7:33)
    at getWebpackConfigs (C:\Users\rober\test\nx-nest-esm\node_modules\@nx\webpack\src\executors\webpack\webpack.impl.js:21:73)
    at webpackExecutor (C:\Users\rober\test\nx-nest-esm\node_modules\@nx\webpack\src\executors\webpack\webpack.impl.js:79:27)
    at webpackExecutor.next (<anonymous>)
    at C:\Users\rober\test\nx-nest-esm\node_modules\@nx\js\src\executors\node\node.impl.js:191:44 {
  code: 'ERR_REQUIRE_ESM'
}

Package Manager Version

No response

Operating System

• [ ] macOS
• [ ] Linux
• [X] Windows
• [ ] Other (Please specify)

Additional Information

running npx tsc --project .\apps\nx-nest-esm\tsconfig.app.json then node .\dist\out-tsc\apps\nx-nest-esm\src\main.js actually works, so the problem is solely in nx doing the same for nest project produced by nest cli works without a problem, example here https://github.com/robertIsaac/nest-esm

[jmls]

ah bloody hell, I've just hit this :( Is there a workaround ?

[robertIsaac]

ah bloody hell, I've just hit this :( Is there a workaround ?

if you don't use plugins, npx tsc --project .\apps\nx-nest-esm\tsconfig.app.json then node .\dist\out-tsc\apps\nx-nest-esm\src\main.js :)

[robertIsaac]

@AgentEnder any updates?

[jaysoo]

We'll need to patch @nx/webpack to adapt webpack.config.js files that use ESM. The only workaround in the meantime ifs to rename the file to webpack.config.ts, which Nx will transpile to CommonJS, or don't use ESM in the .js config file.

We can land the fix maybe in a few weeks unless people are completely blocked even with the above workarounds.

[robertIsaac]

@jaysoo I don't get what webpack.config.js I need to rename to webpack.config.ts I don't have any webpack.config.js in my project

[robertIsaac]

oh in the reprod repo there is a webpack file

[robertIsaac]

it didn't work, added you to the repo, feel free to add a commit to fix it

[github-actions[bot]]

This issue has been automatically marked as stale because it hasn't had any recent activity. It will be closed in 14 days if no further activity occurs. If we missed this issue please reply to keep it active. Thanks for being a part of the Nx community! 🙏

[robertIsaac]

I need to write a comment to stop the bot from closing the issue

[ormarek]

Is there any workaround or working solution to that issue? I'm encountering more and more packages that are ESM only

[jpsullivan]

Pinging this thread in case anyone has managed to figure out a fix. Node v22 added in the experimental flag to automatically patch in support for require() calls in ESM graphs. This flag is --experimental-require-module.

Does anyone know how to incorporate this into nx so that when I run, say, nx serve api, this flag is automatically set? Otherwise it's looking like I'll have to pivot away from nestjs and find something else which is very unfortunate.

[vsamofal]

same for me

[Clashsoft]

Same issue.

[Shuunen]

Same issue here :'(

[mklinke]

Pinging this thread in case anyone has managed to figure out a fix. Node v22 added in the experimental flag to automatically patch in support for require() calls in ESM graphs. This flag is --experimental-require-module.

Does anyone know how to incorporate this into nx so that when I run, say, nx serve api, this flag is automatically set? Otherwise it's looking like I'll have to pivot away from nestjs and find something else which is very unfortunate.

Add the "runtimeArgs" property to the "serve" target's "options" in project.json, e.g.:

    ...
    "serve": {
      "executor": "@nx/js:node",
      "options": {
        "buildTarget": "api:build",
        "runtimeArgs": ["--experimental-require-module"]
      }
    }
    ...

[robertIsaac]

hi @mklinke it doesn't work, you have the reprod feel free to send PR if you could make it to work

[Niewdanka]

Is there any workaround? This problem has been around for about 2 years now.

[robertIsaac]

Is there any workaround? This problem has been around for about 2 years now.

unfortunately no, it must be supported by the nx team, hoping with the new --experimental-require-module we could have a fix soon

[kasir-barati]

@robertIsaac your solution mentioned here did not work:

https://github.com/webpack/webpack-cli/issues/2916

NX   Running target serve for project nest and 1 task it depends on:

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

> nx run nest:build

> webpack-cli build --node-env=production

[webpack-cli] Failed to load '/home/kasir/projects/react/apps/nest/webpack.config.ts' config
[webpack-cli] TypeError: Unknown file extension ".ts" for /home/kasir/projects/react/apps/nest/webpack.config.ts
    at Object.getFileProtocolModuleFormat [as file:] (node:internal/modules/esm/get_format:176:9)
    at defaultGetFormat (node:internal/modules/esm/get_format:219:36)
    at defaultLoad (node:internal/modules/esm/load:133:22)
    at async ModuleLoader.load (node:internal/modules/esm/loader:570:7)
    at async ModuleLoader.moduleProvider (node:internal/modules/esm/loader:445:45)
    at async ModuleJob._link (node:internal/modules/esm/module_job:106:19) {
  code: 'ERR_UNKNOWN_FILE_EXTENSION'
}
Warning: command "webpack-cli build --node-env=production" exited with non-zero status code
——————————————————————————————————————————————————————————————————————————————————————————————————————————————————————————————————————————————

 NX   Running target serve for project nest and 1 task it depends on failed

Failed tasks:

- nest:build

Now I am asking myself why in the world Nx decided to use webpack in NestJS? It works perfectly fine without it 😢.

[kasir-barati]

JFI: When I decided to just go back to CommonJS since it was not a deal breaker for me I realized that hell yeah, there is a murder case here: NX Daemon is not running. Node process will not restart automatically after file changes.. So now I do not have hot reload in my NestJS app (do the manual restart yourself) 🚂.

[kasir-barati]

So I got it working with ESM on my machine but it is practically not usable in real life projects: https://github.com/kasir-barati/bugs/tree/esm-nestjs-nx