Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[BUG] ExperimentalWarning: Support for loading ES Module in require() is an experimental feature and might change at any time #7857

Closed
2 tasks done
alexsch01 opened this issue Oct 18, 2024 · 43 comments
Labels
Bug thing that needs fixing Needs Triage needs review for next steps

Comments

@alexsch01
Copy link

Is there an existing issue for this?

  • I have searched the existing issues

This issue exists in the latest npm version

  • I am using the latest npm

Current Behavior

When installing any package with Node.js v23.0.0 and npm v10.9.0, I get the following warning

(node:10424) ExperimentalWarning: Support for loading ES Module in require() is an experimental feature and might change at any time
(Use `node --trace-warnings ...` to show where the warning was created)

Expected Behavior

No response

Steps To Reproduce

No response

Environment

  • npm: 10.9.0
  • Node.js: 23.0.0
  • OS Name: Windows 10 22H2
  • npm config: default
; node bin location = C:\Program Files\nodejs\node.exe
; node version = v23.0.0
; npm local prefix = C:\Users\$USER\Downloads\test
; npm version = 10.9.0
; cwd = C:\Users\$USER\Downloads\test
; HOME = C:\Users\$USER
; Run `npm config ls -l` to show all defaults.
@alexsch01 alexsch01 added Bug thing that needs fixing Needs Triage needs review for next steps labels Oct 18, 2024
@shadowspawn
Copy link
Contributor

This is triggered by the experimental --experimental-require-module flag being made the default behaviour in Node.js 23. Related links:

@doni108108doni doni108108doni mentioned this issue Oct 19, 2024
2 tasks
@MikeMcC399
Copy link
Contributor

It's not necessary to install anything with npm to provoke the ExperimentalWarning.

For example, even with no npm modules installed, executing npm view npm version results in the ExperimentalWarning:

$ npm view npm version
(node:5212) ExperimentalWarning: Support for loading ES Module in require() is an experimental feature and might change at any time
(Use `node --trace-warnings ...` to show where the warning was created)
10.9.0

Ubuntu 24.04.1 LTS
Node.js v23.0.0
npm 10.9.0 (latest)

Same ExperimentalWarning for many other CLI commands from https://docs.npmjs.com/cli/v10/commands:

npm audit
npm ci
npm doctor
npm init
npm install
npm install-ci-test
npm ls
npm outdated
npm prune
npm repo
npm show
... etc

@MikeMcC399
Copy link
Contributor

@MikeMcC399
Copy link
Contributor

Setting the environment variable NODE_OPTIONS='--trace-warnings' produces some trace output.

$ NODE_OPTIONS='--trace-warnings' npm view npm view
(node:6610) ExperimentalWarning: Support for loading ES Module in require() is an experimental feature and might change at any time
    at emitExperimentalWarning (node:internal/util:273:11)
    at loadESMFromCJS (node:internal/modules/cjs/loader:1388:5)
    at Module._compile (node:internal/modules/cjs/loader:1525:5)
    at Object..js (node:internal/modules/cjs/loader:1680:16)
    at Module.load (node:internal/modules/cjs/loader:1328:32)
    at Function._load (node:internal/modules/cjs/loader:1138:12)
    at TracingChannel.traceSync (node:diagnostics_channel:315:14)
    at wrapModuleLoad (node:internal/modules/cjs/loader:218:24)
    at Module.require (node:internal/modules/cjs/loader:1350:12)
    at require (node:internal/modules/helpers:138:16)

@avivkeller
Copy link

FYI the ESM being require()d is supports-color.

@MikeMcC399
Copy link
Contributor

@redyetidev

FYI the ESM being require()d is supports-color.

You're right!

"supports-color": "^9.4.0",

where [email protected] and above is pure ESM

const supportsColor = require('supports-color'); 

where debug is effectively allowing an ESM version of supports-color to be installed and used:

  "peerDependenciesMeta": {
    "supports-color": {
      "optional": true
    }

So I guess the underlying issue debug-js/debug#975 needs to be resolved by debug.

@MikeMcC399
Copy link
Contributor

MikeMcC399 commented Oct 19, 2024

npm install [email protected] -g

and there was no more warning under Node.js v23.0.0 from

npm view npm version

rnazmo added a commit to rnazmo/my-web-tools that referenced this issue Oct 21, 2024
Why?:
Because the following error will happen when running server.

```bash
$ npm run dev

> [email protected] dev
> vite

  VITE v5.4.9  ready in 310 ms

  ➜  Local:   http://localhost:5173/
  ➜  Network: use --host to expose
  ➜  press h + enter to show help
(node:59826) ExperimentalWarning: Support for loading ES Module in
require() is an experimental feature and might change at any time
(Use `node --trace-warnings ...` to show where the warning was created)
file:///home/toor/repos/github.com/rnazmo/my-web-tools/tailwind.config.js:56
  plugins: [require("tailwindcss-animate")],
           ^

ReferenceError: require is not defined
    at
file:///home/toor/repos/github.com/rnazmo/my-web-tools/tailwind.config.js:56:12
    at ModuleJobSync.runSync
(node:internal/modules/esm/module_job:367:35)
    at ModuleLoader.importSyncForRequire
(node:internal/modules/esm/loader:325:47)
    at loadESMFromCJS (node:internal/modules/cjs/loader:1392:24)
    at Module._compile (node:internal/modules/cjs/loader:1525:5)
    at Object..js (node:internal/modules/cjs/loader:1680:16)
    at Module.load (node:internal/modules/cjs/loader:1328:32)
    at Function._load (node:internal/modules/cjs/loader:1138:12)
    at TracingChannel.traceSync (node:diagnostics_channel:315:14)
    at wrapModuleLoad (node:internal/modules/cjs/loader:218:24)
    at Module.require (node:internal/modules/cjs/loader:1350:12)
    at require (node:internal/modules/helpers:138:16)
    at
/home/toor/repos/github.com/rnazmo/my-web-tools/node_modules/tailwindcss/lib/lib/load-config.js:54:27
    at loadConfig
(/home/toor/repos/github.com/rnazmo/my-web-tools/node_modules/tailwindcss/lib/lib/load-config.js:58:6)
    at getTailwindConfig
(/home/toor/repos/github.com/rnazmo/my-web-tools/node_modules/tailwindcss/lib/lib/setupTrackingContext.js:71:116)
    at
/home/toor/repos/github.com/rnazmo/my-web-tools/node_modules/tailwindcss/lib/lib/setupTrackingContext.js:100:92
    at
/home/toor/repos/github.com/rnazmo/my-web-tools/node_modules/tailwindcss/lib/processTailwindFeatures.js:46:11
    at plugins
(/home/toor/repos/github.com/rnazmo/my-web-tools/node_modules/tailwindcss/lib/plugin.js:38:69)
    at LazyResult.runOnRoot
(/home/toor/repos/github.com/rnazmo/my-web-tools/node_modules/postcss/lib/lazy-result.js:329:16)
    at LazyResult.runAsync
(/home/toor/repos/github.com/rnazmo/my-web-tools/node_modules/postcss/lib/lazy-result.js:258:26)
    at LazyResult.async
(/home/toor/repos/github.com/rnazmo/my-web-tools/node_modules/postcss/lib/lazy-result.js:160:30)
    at LazyResult.then
(/home/toor/repos/github.com/rnazmo/my-web-tools/node_modules/postcss/lib/lazy-result.js:404:17)

Node.js v23.0.0
```

What I did:

```bash
$ mise use node@22
✔mise ~/repos/github.com/rnazmo/my-web-tools/.mise.toml tools:
[email protected]
$ node --version
v22.9.0
```

Ref:
    npm/cli#7857
    https://mise.jdx.dev/cli/use.html

See also:
    https://tailwindcss.com/docs/configuration
rnazmo added a commit to rnazmo/vite-react-ts-tailwind-template that referenced this issue Oct 21, 2024
What I did:

```bash
$ mise --version
2024.10.7 linux-x64 (7d15bd5 2024-10-14)

$ mise ls-remote node | tail -n 5
22.7.0
22.8.0
22.9.0
22.10.0
23.0.0

$ mise use node@22
mise ~/repos/github.com/rnazmo/vite-react-ts-tailwind-template/.mise.toml tools: [email protected]

$ node --version
v22.9.0
````

NOTE:
    Use 22 not 23 because 23 is still new and will cause trouble.

Ref:
    https://mise.jdx.dev/demo.html
    https://mise.jdx.dev/lang/node.html
    https://mise.jdx.dev/cli/ls-remote.html
    https://mise.jdx.dev/cli/use.html
    npm/cli#7857
@MikeMcC399
Copy link
Contributor

MikeMcC399 commented Oct 25, 2024

Under Node.js v23.1.0 the warning provides additional debugging information which confirms the previous analysis:

$ npm view npm version
(node:13088) ExperimentalWarning: CommonJS module /home/mike/n/lib/node_modules/npm/node_modules/debug/src/node.js is loading ES Module /home/mike/n/lib/node_modules/npm/node_modules/supports-color/index.js using require().
Support for loading ES Module in require() is an experimental feature and might change at any time
(Use `node --trace-warnings ...` to show where the warning was created)
10.9.0

@deleonjulio
Copy link

Out of nowhere, npm install and npm start doesnt work in my project. I have to downgrade my node version to make it work.

@MikeMcC399
Copy link
Contributor

@deleonjulio

Out of nowhere, npm install and npm start doesnt work in my project. I have to downgrade my node version to make it work.

That sounds like a different issue. This issue is about an ExperimentalWarning only, where npm continues to work.

@SparK-Cruz
Copy link

What can we do other than rewrite everything between npm to debug, inclusive, in ESM?

@ljharb
Copy link
Contributor

ljharb commented Oct 30, 2024

@SparK-Cruz you can't do anything, whatsoever. Only node, npm, or debug, can do something about it.

@LitoMore

This comment was marked as off-topic.

@SparK-Cruz
Copy link

SparK-Cruz commented Oct 30, 2024

@SparK-Cruz you can't do anything, whatsoever. Only node, npm, or debug, can do something about it.

@ljharb We can always open a pull request... if gets approved or not is another story. Worst case scenario I can fork it and add it to the AUR.

@ljharb
Copy link
Contributor

ljharb commented Oct 30, 2024

@SparK-Cruz yes, a PR to debug would be a possible path forward.

Forking things to AUR without the consent of the maintainer doesn’t actually help the ecosystem, though, and it makes things worse for AUR users because they’re not really using the actual software.

zloirock added a commit to zloirock/core-js that referenced this issue Oct 30, 2024
@mantoni
Copy link
Contributor

mantoni commented Oct 31, 2024

Hm, I think the cause of this is npm cli directly depending on a different major version of supports-color than chalk and debug. I tried downgrading to v7.x in #7887 and it fixes the problem and seems to work fine.

@alexsch01 alexsch01 reopened this Oct 31, 2024
@wellwelwel
Copy link

wellwelwel commented Nov 4, 2024

I opened a PR with a really simple approach to fix it from supports-color side, by adding an automation to also export the index.js (ESM) to index.cjs. This allows the supports-color to support both CommonJS, ES Modules and browsers, fixing the issue in both debug and npm/cli, and allowing Node.js to keep the experimental warning.

Also, no changes would be necessary either on the debug or npm/cli side (except maybe forcing an update to the new supports-color version, if approved).


EDIT: Unfortunately, supports-color's decision is in fact not to be compatible with CommonJS.

@damisparks
Copy link

I get this error on npm publish:

(node:85003) ExperimentalWarning: Support for loading ES Module in require() is an experimental feature and might change at any time
(Use `node --trace-warnings ...` to show where the warning was created)
npm error code ENOENT
npm error syscall open

I was only able to publish by using node 22.

@ljharb
Copy link
Contributor

ljharb commented Nov 4, 2024

@damisparks node v23.0.0 is broken, so you'd need to be on v23.1.0. The experimental warning would still occur, though.

@damisparks
Copy link

@ljharb After upgrading to v23.1.0 , I could publish.
I still see the experimental warning, as you said.

(node:19390) ExperimentalWarning: CommonJS module /Users/damisparks/.nvm/versions/node/v23.1.0/lib/node_modules/npm/node_modules/debug/src/node.js is loading ES Module /Users/damisparks/.nvm/versions/node/v23.1.0/lib/node_modules/npm/node_modules/supports-color/index.js using require().
Support for loading ES Module in require() is an experimental feature and might change at any time
(Use `node --trace-warnings ...` to show where the warning was created)

@ljharb
Copy link
Contributor

ljharb commented Nov 8, 2024

@planetarquasar those are just log messages, it shouldn't interfere with a build process. you can set NODE_OPTIONS='--disable-warning=ExperimentalWarning', though, and suppress them.

@planetarquasar
Copy link

Where should I put this?

@ljharb
Copy link
Contributor

ljharb commented Nov 8, 2024

in your environment - it's an environment variable. Happy to help with further questions, but let's please not continue pinging people by commenting on this issue :-)

(npm folks, feel free to hide some of these tangents as off topic)

@gba-foundever
Copy link

For information, this 'WARNING' was make my yoeman installation not working with issue: yeoman/yeoman#1778

putting
export NODE_OPTIONS='--disable-warning=ExperimentalWarning' in bash removed the WARNING and the issue

@orome
Copy link

orome commented Nov 18, 2024

For information, this 'WARNING' was make my yoeman installation not working with issue: yeoman/yeoman#1778

putting export NODE_OPTIONS='--disable-warning=ExperimentalWarning' in bash removed the WARNING and the issue

So is this what we should all be doing? Any reason not to?

@shivanraptor
Copy link

Where should I put this?

Example:

NODE_OPTIONS='--disable-warning=ExperimentalWarning' npm i

@wraithgar
Copy link
Member

wraithgar commented Nov 26, 2024

This was fixed in the latest versions of both npm 9 and 10

Debug was updated but this didn't resolve the issue. See later comments in this issue.

@songyang-dev
Copy link

This is still happening to me. I'll make a new issue

@shivanraptor
Copy link

shivanraptor commented Nov 27, 2024

This is still happening to me. I'll make a new issue

Confirmed. I use npm version 10.9.0, this issue still appears.

Environment:

  • macOS 15.1.1
  • npm 10.9.0
  • node v23.3.0
  • vite 5.4.11
  • react 18.3.1

package.json

{
  "name": "my-project-name",
  "private": true,
  "version": "0.0.0",
  "type": "module",
  "scripts": {
    "dev": "vite",
    "build": "tsc -b && vite build",
    "lint": "eslint .",
    "preview": "vite preview"
  },
  "dependencies": {
    "@chatui/core": "^2.4.2",
    "react": "^18.3.1",
    "react-dom": "^18.3.1"
  },
  "devDependencies": {
    "@eslint/js": "^9.13.0",
    "@types/react": "^18.3.12",
    "@types/react-dom": "^18.3.1",
    "@vitejs/plugin-react-swc": "^3.5.0",
    "eslint": "^9.13.0",
    "eslint-plugin-react-hooks": "^5.0.0",
    "eslint-plugin-react-refresh": "^0.4.14",
    "globals": "^15.11.0",
    "typescript": "~5.6.2",
    "typescript-eslint": "^8.11.0",
    "vite": "^5.4.10"
  }
}

@wraithgar
Copy link
Member

debug was updated in npm, but didn't fix the issue. This is not something npm can fix. This is an issue with node and/or debug. Please follow debug-js/debug#975 for more info.

This should not be a problem in node 22 anymore (ref: debug-js/debug#975 (comment)).

@ljharb
Copy link
Contributor

ljharb commented Nov 27, 2024

(it's something npm can work around, by pinning to an older version of supports-color, but it's best resolved in node itself)

nursoda added a commit to datenschutz-individuell/twofactor_email that referenced this issue Dec 5, 2024
@Veronicandemo
Copy link

I downgraded to node version (20.18.1). and it resolved the issue.

@damisparks
Copy link

I downgraded to node version (20.18.1). and it resolved the issue.

@Veronicandemo You could do something similar to what @nursoda did here.

"NODE_OPTIONS='--disable-warning=ExperimentalWarning' npm install"

See datenschutz-individuell/twofactor_email@160a26c#diff-60f21b0825bc73d363d1e587d92fd2ce197c32fd602dd9f32e078e55793bd431R4

@MikeMcC399
Copy link
Contributor

BEFORE (Node.js v23.3.0)

$ node -v
v23.3.0
$ npm -v
10.9.0
$ npm view npm version
(node:5688) ExperimentalWarning: CommonJS module C:\Users\mikem\AppData\Roaming\nvm\v23.3.0\node_modules\npm\node_modules\debug\src\node.js is loading ES Module C:\Users\mikem\AppData\Roaming\nvm\v23.3.0\node_modules\npm\node_modules\supports-color\index.js using require().
Support for loading ES Module in require() is an experimental feature and might change at any time
(Use `node --trace-warnings ...` to show where the warning was created)
10.9.2

AFTER (Node.js v23.4.0)

$ node -v
v23.4.0
$ npm -v
10.9.2
$ npm view npm version
10.9.2

@lutfiadnan92
Copy link

lutfiadnan92 commented Jan 6, 2025

@deleonjulio

Out of nowhere, npm install and npm start doesnt work in my project. I have to downgrade my node version to make it work.

That sounds like a different issue. This issue is about an ExperimentalWarning only, where npm continues to work.

yes, it happened on node v23
try using v22

@aqlnce-af
Copy link

I was getting this error on MacOS as well. Updating node to v22.12.0 fixed the problem.

@xLuisCumbi
Copy link

xLuisCumbi commented Jan 21, 2025

I upgrade to node 23.6.0 and warning disappear, lets give a try if you need to use ^23 version

High5Apps added a commit to High5Apps/organize-rn that referenced this issue Feb 8, 2025
- Perform changes recommended by the Upgrade Helper
  - Didn't update gradle-wrapper.jar since it is a binary file
  - Didn't manually remove all of the RnDiffAppTests/OrganizeTests references. I only kept the ones that were created by removing OrganizeTests.m and OrganizeTests Info.plist
  - Converted AppDelegate.mm to AppDelegate.swift
    - https://github.com/guardianproject/orbot-apple/blob/57dae6f/Orbot/AppDelegate.swift#L29
    - https://github.com/haqq-network/haqq-wallet/blob/c6687e3/ios/AppDelegate.swift#L67-L73
  - https://react-native-community.github.io/upgrade-helper/?from=0.75.3&to=0.77.0&package=app.getorganize.organize&name=Organize
- Update local dev machine node from v23.3.0 to v23.6.1 and npm from 10.9.0 to 10.9.2 to fix a warning that happened when running `npm run` commands
  - npm/cli#7857 (comment)
- Use align-deps to update and align dependencies
- Fix "2 vulnerabilities (1 moderate, 1 high)" with `npm audit fix`
- Update react-native-vision-camera from 4.5.3 to 4.6.3 to fix a build error
  - mrousavy/react-native-vision-camera#3263
- Fixed another react-native-vision-camera Android build error
  - Opened PR: mrousavy/react-native-vision-camera#3394
  - Added devDependency on [email protected] to bring this fix in locally until the PR is merged
    - https://github.com/ds300/patch-package
- Upgraded react-native-modal-datetime-picker from 17.1.0 to 18.0.0 to fix a default props warning
  - mmazzarolo/react-native-modal-datetime-picker#755
  - https://github.com/mmazzarolo/react-native-modal-datetime-picker/releases/tag/v18.0.0
- Fix Android shadows looked bad by migrating from elevation to boxShadow, which was newly added in 77
  - https://reactnative.dev/docs/view-style-props#boxshadow
  - https://developer.mozilla.org/en-US/docs/Web/CSS/box-shadow
- Update react-native-pager-view from 6.4.1 to 6.7.0 to fix an android crash when navigating to FlaggedContent, then hitting the back button
  - callstack/react-native-pager-view#944
  - https://github.com/callstack/react-native-pager-view/releases/tag/v6.6.1
- Fix CountdownClockBorder flicker on touch down by migrating from react native's built-in Animated to react-native-reanimated
  - This was caused by react native 77 using the new architecture by default
  - Add dependency on [email protected]
    - https://docs.swmansion.com/react-native-reanimated/docs/fundamentals/getting-started/
    - Previously removed in 7b0b38a
- Fix iOS RefreshControl not shown on mount
  - This was caused by react native 77 using the new architecture by default
  - Created PR on react-native: facebook/react-native#49240
  - Used patch-package to bring this in locally until the PR is merged
- Fix failing jest tests by removing jestSetupMockReactNavigation.ts
  - According to the docs, the mock is only needed when using DrawerNavigator or (non-native) StackNavigator
    - https://reactnavigation.org/docs/testing/#mocking-native-modules
- Fix ListEmptyComponent briefly shown even though first page was non-empty
  - This was caused by react native 77 using the new architecture by default
  - This affected useModels, usePrependedModels, and useLeadItems because they used useEffect when they should have used useMemo, causing a render delay between when ready was true and when models were non-empty
    - As a result of the change from useEffect to useMemo in Models, I had to remove the isEqual check. This caused useModel consumers to have more renders than previously, since previously the isEqual check debounced many re-renders, e.g. when fetching data from the backend updated the cache, but didn't affect any of the ids watched by the specific instance of useModels
      - I updated useModelCache, which aleviated some of these unnecessary re-renders, but the scenario mentioned above still causes re-renders
      - The only place these new renders caused real issues was with OrgGraph. The useModelCache change fixed a re-render on pull-to-refresh of the OrgGraph. However, I specifically needed to debounce officers in VisGraphData or else selecting a node would trigger an OrgGraph re-render
- Update react-native-screens from 4.5.0 to 4.6.0 to fix an issue where HeaderButton onPress was ignored on Android devices
  - react-navigation/react-navigation#12274
  - software-mansion/react-native-screens#2219 (comment)
- Add an override to rnx-kit config, since it expected react-native-screens to be 4.5.0 instead of 4.6.0 for react native 77
  - https://microsoft.github.io/rnx-kit/docs/tools/align-deps#presets
  - https://microsoft.github.io/rnx-kit/docs/architecture/dependency-management#extensions
  - https://github.com/microsoft/rnx-kit/tree/main/packages/align-deps#configure
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Bug thing that needs fixing Needs Triage needs review for next steps
Projects
None yet
Development

No branches or pull requests