Error [ERR_REQUIRE_ESM]: Must use import to load ES Module: D:\...\node_modules\normalize-url\index.js
[0] require() of ES modules is not supported.
[0] require() of D:\...\node_modules\normalize-url\index.js from D:\...\routes\api\users.js is an ES module file as it is a .js file whose nearest parent package.json contains "type":
"module" which defines all .js files in that package scope as ES modules.
[0] Instead rename index.js to end in .cjs, change the requiring code to use import(), or remove "type": "module" from D:\Personnel\Linu
x downloads n docs\Docs\Project 2\node_modules\normalize-url\package.json.
I tried to downgrade the node-fetchand type:module, nothing worked.
You installed a new version of normalize-url whose package.json contains {type:module} this is deduced from:
...package.json contains "type":"module"
Because modules are loaded using 'import' and not 'require', Node returns an error.
How to solve
You probably need the CJS scripts.
Remove and reinstall the package the standard way (npm remove normalize-url && npm i normalize-url). If npm i normalize-url#latest is installed then it is a ES2015 and only work with import statements.
Downgraded the node version to LTS, and it started working.
Related
I created a fresh Next.js project and followed the Uniswap Widget guideline.
// create next app
npx create-next-app#latest
// add Uniswap widget dependency
yarn add #uniswap/widgets
// add Uniswap widget code
<div className="Uniswap">
<SwapWidget
provider={provider}
jsonRpcEndpoint={jsonRpcEndpoint} />
</div>
However, I get this error suggesting I should change React or Uniswap code to make it compatible with Next.js setup.
Is there anyway I can make this work without changing React or Uniswap libraries, as suggested by the error message?
error - Error [ERR_REQUIRE_ESM]: require() of ES Module /home/pomatti/pjs/uniswap/uniswap-widget/node_modules/#uniswap/widgets/node_modules/#web3-react/core/dist/cjs/index.js from /home/pomatti/pjs/uniswap/uniswap-widget/node_modules/#uniswap/widgets/dist/widgets.js not supported.
index.js is treated as an ES module file as it is a .js file whose nearest parent package.json contains "type": "module" which declares all .js files in that package scope as ES modules.
Instead rename index.js to end in .cjs, change the requiring code to use dynamic import() which is available in all CommonJS modules, or change "type": "module" to "type": "commonjs" in /home/pomatti/pjs/uniswap/uniswap-widget/node_modules/#uniswap/widgets/node_modules/#web3-react/core/package.json to treat all .js files as CommonJS (using .mjs for all ES modules instead).
I'd like to use Sveltekit together with hardhat but hardhat uses commonjs require syntax, if run npx hardhat test with js ending I get the error:
Error [ERR_REQUIRE_ESM]: require() of ES Module hardhat.config.js from node_modules\hardhat\internal\core\config\config-loading.js not supported. hardhat.config.js is treated as an ES module file as it is a .js file whose nearest parent package.json contains "type": "module" which declares all .js files in that package scope as ES modules. Instead rename hardhat.config.js to end in .cjs, change the requiring code to use dynamic import() which is available in all CommonJS modules, or change "type": "module" to "type": "commonjs" in package.json to treat all .js files as CommonJS (using .mjs for all ES modules instead).
If I change to type: commonjs I get this error if I run npm run dev:
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)
svelte.config.js:1
import preprocess from "svelte-preprocess";
^^^^^^
SyntaxError: Cannot use import statement outside a module
If I change svelte.config.js to svelte.config.mjs I get the follwing error: You need to create a svelte.config.js file and if I rename hardhat.config.js hardhat doesn't find the config and wants to create a new project.
Is there any way to combine these two even tho there is a mixture of import and require statements?
I am getting the following error when trying to run npm build on my serverless aws-nodejs-typescript project and do not understand how to fix it. Anyone able to point me in the right direction please?
npm build
(node:44390) UnhandledPromiseRejectionWarning: Error [ERR_REQUIRE_ESM]: Must use import to load ES Module: /usr/local/lib/node_modules/npm/node_modules/chalk/source/index.js
require() of ES modules is not supported.
require() of /usr/local/lib/node_modules/npm/node_modules/chalk/source/index.js from /usr/local/lib/node_modules/npm/lib/utils/explain-dep.js is an ES module file as it is a .js file whose nearest parent package.json contains "type": "module" which defines all .js files in that package scope as ES modules.
Instead rename index.js to end in .cjs, change the requiring code to use import(), or remove "type": "module" from /usr/local/lib/node_modules/npm/node_modules/chalk/package.json.
...
Thanks very much!
The latest version of chalk has changed to ES6 import/export syntax instead of CJS (CommonJS with require). So instead of:
const chalk = require('chalk');
You have to do:
import chalk from 'chalk';
You'll (unfortunately) have to change all the other requires into imports as well, then change all your module.exports into export default and all your exports.whatever to export whatever; where whatever is your thing, or as suggested rename your file to index.cjs to force CJS.
Then there are the docs for import and export if you need them.
Then, you need to add type: "module" to package.json. So much for chalk :)
I didn't like that so I used to just use colors intead, but...
I am trying to use Background Geolocation in ionic.
When I run ionic cordova run android it is giving me following error:
> cordova.cmd build android
cordova-android-support-gradle-release: ERROR: EXCEPTION: Error [ERR_REQUIRE_ESM]: Must use import to load ES Module: C:\xampp\htdocs\myApp\node_modules\strip-final-newline\index.js
require() of ES modules is not supported.
require() of C:\xampp\htdocs\myApp\node_modules\strip-final-newline\index.js from C:\xampp\htdocs\myApp\platforms\android\cordova\node_modules\execa\index.js is an ES module file as it is a .js file whose nearest parent package.json contains "type": "module" which defines all .js files in that package scope as ES modules.
Instead rename C:\xampp\htdocs\myApp\node_modules\strip-final-newline\index.js to end in .cjs, change the requiring code to use import(), or remove "type": "module" from C:\xampp\htdocs\myApp\node_modules\strip-final-newline\package.json.
Unable to load Platform API from C:\xampp\htdocs\myApp\platforms\android\cordova\Api.js:
Must use import to load ES Module: C:\xampp\htdocs\myApp\node_modules\strip-final-newline\index.js
require() of ES modules is not supported.
require() of C:\xampp\htdocs\myApp\node_modules\strip-final-newline\index.js from C:\xampp\htdocs\myApp\platforms\android\cordova\node_modules\execa\index.js is an ES module file as it is a .js file whose nearest parent package.json contains "type": "module" which defines all .js files in that package scope as ES modules.
Instead rename C:\xampp\htdocs\myApp\node_modules\strip-final-newline\index.js to end in .cjs, change the requiring code to use import(), or remove "type": "module" from C:\xampp\htdocs\myApp\node_modules\strip-final-newline\package.json.
> native-run.cmd android --app platforms\android\app\build\outputs\apk\debug\app-debug.apk
[native-run] No hardware devices found, attempting emulator...
[native-run] ERR_NO_TARGET: No targets devices/emulators available. Cannot create AVD because there is no suitable API installation. Use --sdk-info to reveal missing packages and other issues.
[native-run]
[native-run] More details for this error may be available online:
[native-run]
[native-run] https://github.com/ionic-team/native-run/wiki/Android-Errors
[ERROR] An error occurred while running subprocess native-run.
native-run.cmd android --app platforms\android\app\build\outputs\apk\debug\app-d... exited with exit code 1.
Re-running this command with the --verbose flag may provide more information.
After installing npm install strip-final-newline I am finding above error Could you please help?
I had the same problem
I uninstalled strip-final-newline and then downgraded to 2.0.0 with
npm install strip-final-newline#2.0.0
I think I've read every thread on SO and every related page on the internet on this, everything has some variation of a problem
I want:
To use webpack to bundle my web app up
To use ES Modules within my source js and have them transpiled down for wider browser support
To use ES Modules within my webpack configuration
Node 14 allegedly supports ESM, so lets use that
Setup 1
I have "type": "module" in my package.json
then my webpack.config.js looks something like:
import { somethingUseful } from './src/js/useful-things.js';
export default (env, argv) => {
return {
// webpack config here
};
}
running > webpack (webpack-cli) I get:
Error [ERR_REQUIRE_ESM]: Must use import to load ES Module: D:\git\Useroo\webpack.config.js
require() of ES modules is not supported.
require() of webpack.config.js from C:\nvm\v14.14.0\node_modules\webpack-cli\lib\groups\resolveConfig.js is an ES module file as it is a .js file whose nearest parent package.json contains "type": "module" which defines all .js files in that package scope as ES modules.
Instead rename webpack.config.js to end in .cjs, change the requiring code to use import(), or remove "type": "module" from package.json.
OK, so lets do what the error message says
Setup 2a
If I remove "type": "module" from my package.json I get
webpack.config.js
import { somethingUseful } from './src/js/useful-things.js';
^^^^^^
SyntaxError: Cannot use import statement outside a module
right.... So lets try the other suggested alternative:
Setup 2b
module.exports = async (env, argv) => {
var somethingUseful = await import('./src/js/useful-things.js');
return {
// webpack config here
};
}
I get a segfault.
/c/Program Files/nodejs/webpack: line 14: 14272 Segmentation fault "$basedir/node" "$basedir/node_modules/webpack/bin/webpack.js" "$#"
webpack-cli now supports ES Modules. All that is required is
adding "type": "module" to your package.json
or
name your webpack config with the mjs extension: webpack.config.mjs
At the time of writing, webpack-cli just doesn't support ES6 modules, so you basically have to re-implement it yourself.
It's not that hard really, just annoying. You need something like this (simplified for brevity): Just RTFM here https://webpack.js.org/api/node/
import webpack from 'webpack';
import webpackConfig from './webpack.config.js';
var config = await webpackConfig(mode);
var compiler = webpack(config);
compiler.watch()
Webpack does not have native support for ESM config files, as the other answer states, but it does support automatically transpiling them. If your config file is named webpack(.whatever).babel.js, and you have babel properly installed, your config file will be quietly downleveled before use.
As far as I know, the only way to configure Babel in this case is to use a top level .babelrc in your project directory. Mine simply contains {"presets": ["#babel/preset-env"]}. It does mean that if I want to use Babel in the build, I have to configure it through e.g. plugin options, but it works for me.
ETA: user #bendwarn says in a deleted comment that as of Webpack CLI 4.5.0 you can name your config file webpack.config.mjs or just call it webpack.config.js if your package is type: "module" and it should work natively. I haven't tried it (and frankly that second one sounds like a terrible idea).