[ERROR] Must use import to load ES module #314

angelhdzmultimedia · 2022-05-31T03:28:28Z

Issue description

Context

Totally new Node project with typescript, @types/node, and ts-node-dev packages installed.
I only get this error when I set type: "module" in package.json.

ts-node-dev: ^2.0.0

OS version (is it docker or host?), ts-node-dev version

Did you try to run with ts-node?

Did you try to run with --files option enabled?

Did you try to run with --debug option enabled?

Do you have a repro example (git repo) with simple steps to reproduce your problem?

The text was updated successfully, but these errors were encountered:

danlupascu · 2022-06-02T12:24:40Z

I'm having the same problem

ts-node-dev version: 2.0.0
typescript version: 4.7.2

angelhdzmultimedia · 2022-06-02T17:36:42Z

Switched to babel with @babel/preset-typescript, and nodemon. Everything is working there. Can use imports without filenames, can use directories with implied index.ts, and can use mongoose. Will try other packages later to confirm that everything works now.

angelhdzmultimedia · 2022-06-21T22:42:25Z

Still having this issue with ts-node-dev. No matter what I try (type: "module" in package.json, module:"esnext" and module:"commonjs" in tsconfig.json, etc.)

Right now, my problem is with the package inquirer. It's ready for ESM in new version v9.0.0. But if I remove type: "module" from package.json, inquirer complains. Then I replaced the import with a dynamic import await import('inquirer'), but then I get an error that can't use top level await with a commonjs module...

It's a paradox.

But with babel and nodemon, and babel typescript presets it works flawlessly.

I'm reaching the conclusion that ts-node-dev isn't ready for ESM so I will continue using babel and nodemon.

halvors · 2022-07-04T12:21:57Z

I have this exact same problem too, would it be possible to support this?

dawosch · 2022-07-29T10:44:10Z

Same problem.
I'm using ts-node-dev while i'm developing. And there the error occures.
When i build my project for production with bable it's woking.

angelhdzmultimedia · 2022-07-30T14:35:29Z

Same problem. I'm using ts-node-dev while i'm developing. And there the error occures. When i build my project for production with bable it's woking.
Yeah, with babel works.

You can try this config, I tested it with most ES2022 features (including Top Level Await) and it works.

{
  "type": "module",
  "name": "test_typescript_esm",
  "version": "1.0.0",
  "description": "",
  "scripts": {
    "dev": "nodemon -I --exec node --experimental-specifier-resolution=node  --loader ts-node/esm ./src/main.ts"
  },
  "keywords": [],
  "author": "",
  "license": "ISC",
  "dependencies": {
    "nodemon": "^2.0.19",
    "ts-node": "^10.9.1",
    "typescript": "^4.7.4"
  },
  "exports": "./dist/index.js",
  "devDependencies": {
    "@babel/core": "^7.18.2",
    "@babel/node": "^7.17.10",
    "@babel/plugin-proposal-decorators": "*",
    "@babel/preset-env": "^7.18.2",
    "@types/node": "^18.6.2"
  }
}

ghost · 2022-08-01T05:51:06Z

mark

ChromeGG · 2022-08-29T20:09:22Z

Same problem here. I tried with

ts-node-esm --experimental-specifier-resolution=node --transpile-only ./src/index

and it works BUT it'll not restart automatically if files will change

angelhdzmultimedia · 2022-09-11T23:31:58Z

Update

Besides it working with Babel, I achieved to make it working with nodemon and ts-node.

Install nodemon and ts-node and of course typescript, set type: "module" in package.json,
and set tsconfig.json to:

{
  "compilerOptions": {
    "esModuleInterop": true,
    "moduleResolution": "Node",
    "module": "ESNext",
    "target": "ESNext"
  }
}

And then: nodemon --exec node --loader ts-node/esm src/main.ts

zhoutengshen · 2023-01-04T14:55:00Z

I also encountered this problem. These contents may help you

node version : v16.13.2

package.json

{
  "devDependencies": {
    "@types/node": "^18.11.18",
    "nodemon": "^2.0.20",
    "ts-node": "^10.9.1",
    "typescript": "^4.9.4"
  },
  "scripts": {
    "dev": "nodemon --exec ts-node index.ts --project ./tsconfig.json"
  },
  "type": "module"
}

tsconfig.json

{
  "extends": "ts-node/node16/tsconfig.json",
  "ts-node": {
    "transpileOnly": true,
    "files": true,
    // Tell ts-node CLI to install the --loader automatically, explained below
    "esm": true,
    "compilerOptions": {
      "module": "ESNext"
    }
  },
  "compilerOptions": {
    "module": "ESNext",
    "moduleResolution": "Node",
    "lib": [
      "DOM",
      "ES2015"
    ],
    "target": "ES2015"
  }
}

angelhdzmultimedia · 2023-01-04T15:57:17Z

I also encountered this problem. These contents may help you

node version : v16.13.2

package.json

{
  "devDependencies": {
    "@types/node": "^18.11.18",
    "nodemon": "^2.0.20",
    "ts-node": "^10.9.1",
    "typescript": "^4.9.4"
  },
  "scripts": {
    "dev": "nodemon --exec ts-node index.ts --project ./tsconfig.json"
  },
  "type": "module"
}

tsconfig.json

{
  "extends": "ts-node/node16/tsconfig.json",
  "ts-node": {
    "transpileOnly": true,
    "files": true,
    // Tell ts-node CLI to install the --loader automatically, explained below
    "esm": true,
    "compilerOptions": {
      "module": "ESNext"
    }
  },
  "compilerOptions": {
    "module": "ESNext",
    "moduleResolution": "Node",
    "lib": [
      "DOM",
      "ES2015"
    ],
    "target": "ES2015"
  }
}

Thank you!

Replace ts-node-dev with nodemon + ts-node: wclr/ts-node-dev#314 (comment)

oxilor · 2023-02-25T20:59:53Z

According to the typescript documentation the moduleResolution must be:

node for Node.js’ CommonJS implementation
nodenext for Node.js’ ECMAScript Module Support from TypeScript 4.7 onwards.

So the moduleResolution must be nodenext for ESM. I created the repository with minimum configuration for restarting the node app when the file changes. It uses nodemon, because the ts-node-env doesn't seem to support ESM yet.

angelhdzmultimedia · 2023-02-25T22:29:11Z

I'm using tsx now. No issues so far.

But thanks for the update. I'm gonna try ts-node-dev again with module resolution set to nodenext.

Is the ts-node set to esm mandatory?

oxilor · 2023-02-26T00:05:40Z

@angelhdzmultimedia Wow, tsx looks even better. I'll try it. Thanks.

Is the ts-node set to esm mandatory?

Unfortunately, I don't quite understand your question. To make ts-node compatible with ESM, we should use the appropriate loader in one of the following ways, but ts-node-dev (v2.0.0) still throws an error if ESM is used (Must use import to load ES Module).

P.S. tsx does not support type checking. We can, of course, run the TS compiler at first tsc --noEmit && tsx watch src/index.ts, but in this case, if we violated some types during watch mode, tsx doesn't show any errors. This seems to be the main reason why tsx is faster than, for example, ts-node. IMO it's inconvenient, because we don't immediately know about mistakes in types.

We are looking forward to ESM support in ts-node-dev. In the meantime, we can use nodemon + ts-node if we need to check types in watch mode, or tsx if not.

angelhdzmultimedia · 2023-02-26T04:15:36Z

@angelhdzmultimedia Wow, tsx looks even better. I'll try it. Thanks.

Is the ts-node set to esm mandatory?

Unfortunately, I don't quite understand your question. To make ts-node compatible with ESM, we should use the appropriate loader in one of the following ways, but ts-node-dev (v2.0.0) still throws an error if ESM is used (Must use import to load ES Module).

P.S. tsx does not support type checking. We can, of course, run the TS compiler at first tsc --noEmit && tsx watch src/index.ts, but in this case, if we violated some types during watch mode, tsx doesn't show any errors. This seems to be the main reason why tsx is faster than, for example, ts-node. IMO it's inconvenient, because we don't immediately know about mistakes in types.

We are looking forward to ESM support in ts-node-dev. In the meantime, we can use nodemon + ts-node if we need to check types in watch mode, or tsx if not.

My question is, is it mandatory to add this:

And yes, you're right about tsx.

I've been also using nodemon --exec "node --loader ts-node/esm src/main.ts" or just node --loader ts-node/esm and it works great.

I'm exited to see ts-node-dev being improved.

oxilor · 2023-02-26T16:10:38Z

@angelhdzmultimedia,

My question is, is it mandatory to add this

We should somehow tell ts-node to use the loader that supports ESM. This can be done in one of the following ways:

1. Specify in `tsconfig.json` that the `ts-node` uses ESM loader

{
  "ts-node": {
    "esm": true
  }
}

In this case, you don't need to specify additional arguments in nodemon command:

nodemon src/index.ts

2. Specify the `ts-node` command with ESM in nodemon:

nodemon --exec ts-node-esm src/index.ts

or

nodemon --exec 'ts-node --esm' src/index.ts

In this case, you don't need to change the tsconfig.json file.

3. Set `ts-node` with ESM as the node loader

NODE_OPTIONS='--loader ts-node/esm' nodemon src/index.ts

or

nodemon --exec 'node --loader ts-node/esm' src/index.ts

I prefer the first case (set ts-node.esm to true in tsconfig), because it looks cleaner.

angelhdzmultimedia · 2023-02-26T16:18:11Z

I appreciate your kind responses A LOT!!! They have been on fire🔥, on point👌!

Sorry to bother you with one last question... ❔

Difference between ts-node/esm and ts-node-esm flags? Both allowed or is one of them deprecated?

Wishing you health, peace, and success!

oxilor · 2023-02-26T16:24:00Z

Seems that ts-node-esm and ts-node --esm are aliases of commands. ts-node/esm is the node loader.

I don't see any of them being deprecated at the moment. So you can use any of these methods that you like best.

ThallesP · 2023-04-11T14:42:49Z

Got one-liner working with nodemon:

npx nodemon -e ts,json --exec 'node --experimental-specifier-resolution=node --loader ts-node/esm' <path>.js

RangerCoder99 · 2023-04-24T15:00:37Z

npx nodemon -e ts,json --exec 'node --experimental-specifier-resolution=node --loader ts-node/esm' <path>.js

not working on windows :(

angelhdzmultimedia · 2023-04-24T22:56:06Z

I don't know what you're trying to achieve, but I got it working with:

npx nodemon -e ts,json --exec node --experimental-specifier-resolution=node --loader ts-node/esm main.ts

Where main.ts is my main file in the root of my project.

RicFer01 · 2023-05-16T17:44:36Z

@angelhdzmultimedia,

My question is, is it mandatory to add this

We should somehow tell ts-node to use the loader that supports ESM. This can be done in one of the following ways:

1. Specify in tsconfig.json that the ts-node uses ESM loader
{
  "ts-node": {
    "esm": true
  }
}
In this case, you don't need to specify additional arguments in nodemon command:
nodemon src/index.ts
2. Specify the ts-node command with ESM in nodemon:
nodemon --exec ts-node-esm src/index.ts
or
nodemon --exec 'ts-node --esm' src/index.ts
In this case, you don't need to change the tsconfig.json file.

3. Set ts-node with ESM as the node loader
NODE_OPTIONS='--loader ts-node/esm' nodemon src/index.ts
or
nodemon --exec 'node --loader ts-node/esm' src/index.ts
I prefer the first case (set ts-node.esm to true in tsconfig), because it looks cleaner.

Thanks to your suggestions I got it working! There is one thing I didn't get, I'm using TS, why do I need to import file adding the extension and this extension has be in .js?

import app from './api.js'

cincarnato · 2023-05-20T20:48:36Z

@RicFer01 Your last question have the answer here: https://www.typescriptlang.org/docs/handbook/esm-node.html

RicFer01 · 2023-05-21T18:16:19Z

@RicFer01 Your last question have the answer here: typescriptlang.org/docs/handbook/esm-node.html

Thank you!

ivannalon · 2023-05-23T14:27:40Z

I'm using tsx now. No issues so far.

But thanks for the update. I'm gonna try ts-node-dev again with module resolution set to nodenext.

Is the ts-node set to esm mandatory?

Are you using it in conjunction with docker? My tsx doesn't work watch mode in the container.

rtlayzell · 2023-06-20T14:29:33Z

Repo is looking stale, fair to say this isn't getting fixed any time soon?

jaclas · 2023-07-24T10:30:47Z

and still nothing?

itxtoledo · 2023-08-10T02:38:29Z

same error here

Marcelofj · 2023-08-23T21:45:14Z

I solved my problem by simply removing "type" : "module" from package.json

ThallesP · 2023-08-24T01:16:54Z

if anyone want an alternative, i use tsx for about sometime and i love it, simple to use and maintained.

rolanday · 2023-10-16T06:17:11Z

I solved my problem by simply removing "type" : "module" from package.json

Sorry, but this is not a solution.

rolanday · 2023-10-16T06:28:07Z

+1 for tsx -- it doesn't perform type checking though, so just keep that in mind. I just add "check": "tsc --noEmit" to my package.json script and spot check occasionally (or a full build), and good linter setup goes a long way.

Marcelofj · 2023-10-16T16:09:26Z

I solved my problem by simply removing "type" : "module" from package.json

Sorry, but this is not a solution.

For me it is. Works fine.

My package.json:

{ "name": "general", "version": "1.0.0", "description": "", "main": "app.js", "scripts": { "dev": "ts-node-dev --respawn --transpile-only src/app.ts" }, "keywords": [], "author": "", "license": "ISC", "devDependencies": { "ts-node-dev": "^2.0.0", "typescript": "^5.1.6" } }

devgrunge · 2023-10-27T19:16:51Z

I also encountered this problem. These contents may help you

node version : v16.13.2

package.json

{
  "devDependencies": {
    "@types/node": "^18.11.18",
    "nodemon": "^2.0.20",
    "ts-node": "^10.9.1",
    "typescript": "^4.9.4"
  },
  "scripts": {
    "dev": "nodemon --exec ts-node index.ts --project ./tsconfig.json"
  },
  "type": "module"
}

tsconfig.json

{
  "extends": "ts-node/node16/tsconfig.json",
  "ts-node": {
    "transpileOnly": true,
    "files": true,
    // Tell ts-node CLI to install the --loader automatically, explained below
    "esm": true,
    "compilerOptions": {
      "module": "ESNext"
    }
  },
  "compilerOptions": {
    "module": "ESNext",
    "moduleResolution": "Node",
    "lib": [
      "DOM",
      "ES2015"
    ],
    "target": "ES2015"
  }
}

It worked well for me!
using at my package.json:

"dev": "nodemon --exec ts-node ./src/index.ts --project ./tsconfig.json"

I recognize this may not be optimal for performance, but it's simpler to set up. I might revise this approach in the future. Found the command here: wclr/ts-node-dev#314 (comment)

t-benze · 2023-12-25T03:42:55Z

I'm using tsx now. No issues so far.

But thanks for the update. I'm gonna try ts-node-dev again with module resolution set to nodenext.

Is the ts-node set to esm mandatory?

This is good! Thanks

mblackrittr · 2024-03-17T04:55:19Z

I solved my problem by simply removing "type" : "module" from package.json

Sorry, but this is not a solution.

For me it is. Works fine.

Löl, no, it doesn't! 😹💦

Well, yeah, yeah, always the same everywhere - it "works" for them... löl
... exactly until they'll've to resolve it - just because "type": "module" is NOT something optional one can set as he wishes - gruesome! 🙀

mblackrittr · 2024-03-17T05:07:49Z

if anyone want an alternative, i use tsx for about sometime and i love it, simple to use and maintained.

Thanks @angelhdzmultimedia and @ThallesP, works as great as you say - WoooF! 😻 😹💦

teadrinker2015 · 2024-03-19T15:21:28Z

It is built on top of ts-node, and ts-node is a ... please search on stackoverflow for solutions like --esm, remove { "type": "module" } ... you will end up being recommended with tsx any way.

angelhdzmultimedia · 2024-03-20T05:19:28Z

I'm lately using node --watch ts-node/esm src/main.ts

And in tsconfig.json:
{
"ts-node": {
"experimentalSpecifierResolution": "node",
"transpileOnly": true,
"esm": true,
}
}

And works... good...
I dream of a day where there's only 1 configuration and working with TypeScript + Node is a pleasure...
Waiting for Bun Windows 👀

mblackrittr · 2024-03-20T07:13:19Z

I'm lately using node --watch ts-node/esm src/main.ts

I wonder what issues await the brave on that path (with latest Node, etc.), but would you share with us - why it's not TSX anymore for you?

Just using it a day now, but works great so far, even already with Node 21.7.1.

And beside tons of features, it can also watch, same as TS-Node-Dev:

> tsx watch ./file.ts

IzaelGomes · 2024-04-15T03:55:57Z

i solved this problem removing "type": "module" from my package.json and keeping just "module": "CommonJS" on my tsconfig.json. it works fine.

angelhdzmultimedia · 2024-04-15T04:03:40Z

Bun for Windows is out guys! 🔥👀✌️🤣

Bun, tsx, unjs/jiti. Solid options now.

Closing this.

mblackrittr · 2024-04-15T04:59:27Z

i solved this problem removing "type": "module" from my package.json and keeping just "module": "CommonJS" on my tsconfig.json. it works fine.

Yeah, yeah, "solved" and "works fine" (always were the words of the ignorant) - see you again later in the day when you figure out it'll blow on all these "EVIL" ESM only packages or any other valid reason for ESM, e.g. publishing a package for others to use - then no ESM?! 🙀

dargmuesli mentioned this issue Jun 1, 2022

ts-node-dev 1.1.8 is broken with TypeScript 4.7 #311

Open

DesignByOnyx mentioned this issue Dec 9, 2022

Add esm to ts-node flags #312

Open

soedirgo added a commit to supabase/postgres-meta that referenced this issue Jan 16, 2023

fix: docs:export

a9fc6a2

Replace ts-node-dev with nodemon + ts-node: wclr/ts-node-dev#314 (comment)

soedirgo mentioned this issue Jan 16, 2023

fix: docs:export supabase/postgres-meta#465

Merged

soedirgo added a commit to supabase/postgres-meta that referenced this issue Jan 16, 2023

fix: docs:export

100b5d9

Replace ts-node-dev with nodemon + ts-node: wclr/ts-node-dev#314 (comment)

zebreus mentioned this issue Feb 6, 2023

Compilation errors zebreus/replicate-api#1

Closed

peko-thunder mentioned this issue Feb 11, 2023

to ESM from CJS peko-thunder/discord-bot#1

Closed

guillemparrado mentioned this issue Mar 20, 2023

[ERROR] Must use import to load ES module IT-Academy-BCN/ita-wiki#20

Closed

mblackrittr mentioned this issue Mar 18, 2024

Only works for public packages iamchathu/changeset-conventional-commits#25

Open

angelhdzmultimedia closed this as completed Apr 15, 2024

[ERROR] Must use import to load ES module #314

[ERROR] Must use import to load ES module #314

Comments

angelhdzmultimedia commented May 31, 2022

Issue description

Context

ts-node-dev: ^2.0.0

danlupascu commented Jun 2, 2022 • edited

angelhdzmultimedia commented Jun 2, 2022

angelhdzmultimedia commented Jun 21, 2022

halvors commented Jul 4, 2022

dawosch commented Jul 29, 2022

angelhdzmultimedia commented Jul 30, 2022

ghost commented Aug 1, 2022

ChromeGG commented Aug 29, 2022

angelhdzmultimedia commented Sep 11, 2022 • edited

Update

zhoutengshen commented Jan 4, 2023

package.json

tsconfig.json

angelhdzmultimedia commented Jan 4, 2023

package.json

tsconfig.json

oxilor commented Feb 25, 2023 • edited

angelhdzmultimedia commented Feb 25, 2023

oxilor commented Feb 26, 2023 • edited

angelhdzmultimedia commented Feb 26, 2023

oxilor commented Feb 26, 2023 • edited

1. Specify in tsconfig.json that the ts-node uses ESM loader

2. Specify the ts-node command with ESM in nodemon:

3. Set ts-node with ESM as the node loader

angelhdzmultimedia commented Feb 26, 2023 • edited

oxilor commented Feb 26, 2023 • edited

ThallesP commented Apr 11, 2023 • edited

RangerCoder99 commented Apr 24, 2023

angelhdzmultimedia commented Apr 24, 2023 • edited

RicFer01 commented May 16, 2023

1. Specify in tsconfig.json that the ts-node uses ESM loader

2. Specify the ts-node command with ESM in nodemon:

3. Set ts-node with ESM as the node loader

cincarnato commented May 20, 2023

RicFer01 commented May 21, 2023

ivannalon commented May 23, 2023

rtlayzell commented Jun 20, 2023

jaclas commented Jul 24, 2023

itxtoledo commented Aug 10, 2023

Marcelofj commented Aug 23, 2023

ThallesP commented Aug 24, 2023

rolanday commented Oct 16, 2023

rolanday commented Oct 16, 2023

Marcelofj commented Oct 16, 2023 • edited

devgrunge commented Oct 27, 2023

package.json

tsconfig.json

t-benze commented Dec 25, 2023

mblackrittr commented Mar 17, 2024

mblackrittr commented Mar 17, 2024 • edited

teadrinker2015 commented Mar 19, 2024

angelhdzmultimedia commented Mar 20, 2024

mblackrittr commented Mar 20, 2024 • edited

IzaelGomes commented Apr 15, 2024 • edited

angelhdzmultimedia commented Apr 15, 2024

mblackrittr commented Apr 15, 2024 • edited

danlupascu commented Jun 2, 2022 •

edited

angelhdzmultimedia commented Sep 11, 2022 •

edited

oxilor commented Feb 25, 2023 •

edited

oxilor commented Feb 26, 2023 •

edited

oxilor commented Feb 26, 2023 •

edited

1. Specify in `tsconfig.json` that the `ts-node` uses ESM loader

2. Specify the `ts-node` command with ESM in nodemon:

3. Set `ts-node` with ESM as the node loader

angelhdzmultimedia commented Feb 26, 2023 •

edited

oxilor commented Feb 26, 2023 •

edited

ThallesP commented Apr 11, 2023 •

edited

angelhdzmultimedia commented Apr 24, 2023 •

edited

1. Specify in `tsconfig.json` that the `ts-node` uses ESM loader

2. Specify the `ts-node` command with ESM in nodemon:

3. Set `ts-node` with ESM as the node loader

Marcelofj commented Oct 16, 2023 •

edited

mblackrittr commented Mar 17, 2024 •

edited

mblackrittr commented Mar 20, 2024 •

edited

IzaelGomes commented Apr 15, 2024 •

edited

mblackrittr commented Apr 15, 2024 •

edited