I'm working on a node project (screenshot). I have a single function (urls) in helpers.js which I'm exporting at the bottom as:
module.exports = {
urls: urls,
};
In my index.js I'm trying to import it with:
import { urls } from './helpers';
const myUrls = urls(1,3);
When I run it I get
Error [ERR_MODULE_NOT_FOUND]: Cannot find module '/home/optionhomes11/nodeprojects/hayes/helpers' imported from /home/optionhomes11/nodeprojects/hayes/index.js Did you mean to import ../helpers.js?
What am I doing wrong?
You have used
"type":"module"
then make sure you have import
file must be .js
extension
You should be importing from './helpers'
, not '.helpers'
.
Try this as below
search in your "/home/optionhomes11/nodeprojects/hayes/index.js"
And looking for "/home/optionhomes11/nodeprojects/hayes/helpers"
change
"/home/optionhomes11/nodeprojects/hayes/helpers"
to
"/home/optionhomes11/nodeprojects/hayes/helpers.js"
You're not doing anything wrong. The current resolution algorithm for EcmaScript Modules of file extensions and the ability to import directories that have an index file requires using an experimental flag. see esm , the bottom part.
so to make your work as it is, instead of
$ node index.js
you do:
$ node --experimental-specifier-resolution=node index.js
You can also create a script in your package.json
like so:
"scripts": {
"start": "NODE_OPTIONS='--experimental-specifier-resolution=node' node src/index.js
I would also recommend you install the Path Intellisense
VS code extension. It will really help when handling nested paths.
When you are using ECMAScript modules you are forced to provide the file extension: https://nodejs.org/api/esm.html#esm_mandatory_file_extensions
So, on top of what other suggested of using "type": "module"
on package.json you also need to specify the file extension import {urls} from './helpers.js'
. You can also use the flag --es-module-specifier-resolution=node
to make it resolve js files as modules just like it did before with require
//helpers.js
export default urls;
//index.js
import urls from './helpers.js';
//package.json (under name)
"type": "module"
This Happens because when using ES Modules we are enforced to specify the file extension in the import statement
import * from "./demo.js" // Works fine
import * from "./demo" // Will throw error as you see
Note that: The above two options are both valid when using commonJs instead
//try this if yoг change package.json
npm i
This answer does not require using a runtime flag --es-module-specifier-resolution=node
at execution time
However, you have to modify your ts source code, which is a pain if there is are a lot of files. And, the modified files will no longer compile in "commonjs" mode, if you want to go back or use dual "commonjs"/"module" modes.
Modify your tsconfig.json to ensure at least these setting versions:
compilerOptions:{
"lib": ["es2020"],
"module": "ES2022",
"moduleResolution": "node",
"target": "es2022",
}
Works with typescript 4.6.3. (Note sure about 4.6.1 or lower). *
Modify index.js
import {urls} from "#helpers";
Modify package.json
"imports": {
"#helpers": "./helpers.js"
}
The leading "#" is mandatory
In addition to not requiring the node runtime execution flag, this answer also satisifes:
*.*ts
source code (thus leaving it compilable under commonjs if you ever chose to do so(*note))(*note) When using rollup, inline maps are required - so there may sometimes be advantage to using commonjs during development and switching to "module" for release.
First modify package.json , create rollup.config.js , and then perform a post tsc action using rollup .
package.json
...
"exports":{
"require":"./index.cjs",
"import":"./index.js"
},
"types": "./index.d.ts",
"type": "module" // you already had this
rollup.config.js
// import resolve from "@rollup/plugin-node-resolve";
import dts from "rollup-plugin-dts";
import commonjs from "@rollup/plugin-commonjs";
import * as path from "path";
import pkg from "./package.json";
export default [
{
input: "index.js",
external:[], // you may quash 'unresolved' warning by adding here
output: [
{ file: pkg.exports.require, format: "cjs" },
{ file: pkg.exports.import, format: "es" },
],
plugins: [
commonjs(),
],
},
{
input: "./index.d.ts",
output: [
{ file: pkg.types, format: "es" },
],
plugins: [dts()],
},
];
Call tsc
then rollup
:
npx tsc
npx rollup -c
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.