Nuxt 3: To load an ES module, set "type": "module" in the package.json
See original GitHub issueHi! 👋
Firstly, thanks for your work on this project! 🙂
Today I used patch-package to patch @popperjs/core@2.10.2
for the project I’m working on.
I tried to use popper in Nuxt 3 project, but I found a problem with importing createPopper
:
(node:11549) Warning: To load an ES module, set "type": "module" in the package.json or use the .mjs extension.
(Use `node --trace-warnings ...` to show where the warning was created)
/Users/lukaszflorczak/project/node_modules/@popperjs/core/lib/enums.js:1
export var top = 'top';
^^^^^^
SyntaxError: Unexpected token 'export'
at Object.compileFunction (node:vm:352:18)
at wrapSafe (node:internal/modules/cjs/loader:1025:15)
at Module._compile (node:internal/modules/cjs/loader:1059:27)
at Object.Module._extensions..js (node:internal/modules/cjs/loader:1147:10)
at Module.load (node:internal/modules/cjs/loader:975:32)
at Function.Module._load (node:internal/modules/cjs/loader:822:12)
at ModuleWrap.<anonymous> (node:internal/modules/esm/translators:190:29)
at ModuleJob.run (node:internal/modules/esm/module_job:185:25)
at async Promise.all (index 0)
at async ESMLoader.import (node:internal/modules/esm/loader:281:24)
Here is the diff that solved my problem:
diff --git a/node_modules/@popperjs/core/package.json b/node_modules/@popperjs/core/package.json
index d4edd3a..e0e5975 100644
--- a/node_modules/@popperjs/core/package.json
+++ b/node_modules/@popperjs/core/package.json
@@ -26,6 +26,7 @@
"/dist",
"/lib"
],
+ "type": "module",
"sideEffects": false,
"scripts": {
"clean": "rimraf lib && rimraf dist && rimraf test/visual/dist",
This issue body was partially generated by patch-package.
Issue Analytics
- State:
- Created 2 years ago
- Reactions:1
- Comments:6
Top Results From Across the Web
Nux3 3.0.0-rc.2 met Warning: To load an ES module, set "type ...
Nux3 3.0.0-rc.2 met Warning: To load an ES module, set "type": "module" in the package.json or use the .mjs extension. #4936.
Read more >"module" in the package.json or use the .mjs extension - Stack ...
So I set "type":"module" on package.json and press f5 again. and another error show up. Process exited with code 1 Uncaught ...
Read more >ES Modules · Nuxt Concepts
The two most common ways to enable ESM syntax are: set type: 'module' within your package.json and keep using .js extension; use the...
Read more >"module" in the package.json or use the .mjs extension 2022
The warning To load an ES module, set “type”: “module” in the package.json or use the .mjs extension occurs when using ES6 Module...
Read more >To load an ES module, set "type" - "module" in JavaScript
The "To load an ES module, set "type": "module" in package.json" error occurs when using the ES6 Modules syntax in a Node.js application...
Read more >Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start FreeTop Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
Top GitHub Comments
Commenting here to say that this was extremely useful to me!
In particular, using Nuxt3 and was trying to get a bootstrap 5 Dropdown (popper.js) working properly. The patch-package process worked great.
Thank you both.
Solved!
I have to run:
npx patch-package --exclude 'nothing' @popperjs/core