Option resolveJsonModule doesn't work without esModuleInterop #25400

ikokostya · 2018-07-03T13:47:28Z

TypeScript Version: 2.9.2, 3.0.0-dev.20180703

Search Terms:

resolveJsonModule, esModuleInterop

Code

import * as test from './test.json';

tsconfig.json:

{
    "compilerOptions": {
        "module": "commonjs",
        "moduleResolution": "node",
        "target": "es2017",
        "lib": ["es2017"],
        "strict": true,
        "sourceMap": true,
        "noEmitOnError": true,
        "baseUrl": ".",
        "resolveJsonModule": true,
        "outDir": "out"
    }
}

Expected behavior:

No errors.

Actual behavior:

Compile error:

$ tsc
test.ts:1:23 - error TS2497: Module '"/home/kostya/tmp/resolve-json-test/test"' resolves to a non-module entity and cannot be imported using this construct.

1 import * as test from './test.json';
                        ~~~~~~~~~~~~~

When I add esModuleInterop option to tsconfig.json:

diff --git a/tsconfig.json b/tsconfig.json
index 7f1afb8..e949135 100644
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -9,6 +9,7 @@
         "noEmitOnError": true,
         "baseUrl": ".",
         "resolveJsonModule": true,
+        "esModuleInterop": true,
         "outDir": "out"
     }
 }

and change import statement to:

diff --git a/test.ts b/test.ts
index 07bb9b7..dddcffb 100644
--- a/test.ts
+++ b/test.ts
@@ -1 +1 @@
-import * as test from './test.json';
+import test from './test.json';

it works. But with esModuleInterop option I need to change many imports in my project, which is undesirable.

Playground Link:

Related Issues:

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

ikokostya · 2018-07-03T14:00:29Z

~~Also with resolveJsonModule, but without esModuleInterop, json file appears in output directory.~~

Fixes #25400

ne1410s · 2018-12-24T11:26:09Z

After setting resolveJsonModule to "true", I was having the same issue in VS Code, (TypeScript 3.2.2, VSCode 1.30.1). Restarting VS Code resolved the issue for me - I did not have to alter any other ts config

faltysad · 2019-02-04T21:24:24Z

Confirmed that setting resolveJsonModule to true in my tsconfig.json resolved this issue.

intelliot · 2019-06-03T22:39:44Z

Manually restarting VS Code resolves this issue.

ErnestoIslas · 2019-06-21T05:06:19Z

After setting resolveJsonModule to "true", I was having the same issue in VS Code, (TypeScript 3.2.2, VSCode 1.30.1). Restarting VS Code resolved the issue for me - I did not have to alter any other ts config

Thank you, it worked!

ps-arndwestermann · 2019-07-16T08:00:18Z

After setting resolveJsonModule to "true", I was having the same issue in VS Code, (TypeScript 3.2.2, VSCode 1.30.1). Restarting VS Code resolved the issue for me - I did not have to alter any other ts config

Worked for me as well, thanks!

brionmario · 2019-08-11T11:15:27Z

After setting resolveJsonModule to "true", I was having the same issue in VS Code, (TypeScript 3.2.2, VSCode 1.30.1). Restarting VS Code resolved the issue for me - I did not have to alter any other ts config

This actually worked. Thanks 😃

redi-monappab · 2019-10-27T04:14:13Z

After setting resolveJsonModule to "true", I was having the same issue in VS Code, (TypeScript 3.2.2, VSCode 1.30.1). Restarting VS Code resolved the issue for me - I did not have to alter any other ts config

Thanks, It worked like a charm!

ltomes · 2019-12-02T14:55:07Z

I see similar behavior in intellij to what @intelliot described above for vs code. Thanks for the suggestion.

ghost · 2020-01-31T12:48:55Z

For those who have updated their target to esnext you need to add the following to your tsconfig:
...
"target" : "esnext",
"moduleResolution": "node",
...

chrisj-skinner · 2020-03-02T17:15:46Z

Initially after a restart the file is green, then 3 seconds later highlighted in red again. So restarting in my case doesn't fix this issue.

imanuelgittens · 2020-03-02T20:27:26Z

@chrisj-skinner same with me. Not sure why this is happening.

ta3pks · 2020-03-12T07:56:07Z

Why is this issue close since this problem still exists ?

a-x- · 2020-03-16T08:56:27Z

I have

    "esModuleInterop": true,
    "resolveJsonModule": true,
    "moduleResolution": "node",

and
const pkgJSON = require('../../package.json');

- Consider using '--resolveJsonModule' to import module with '.json' extensionts(2732)

I use resolveJsonModule already.

joofholland · 2020-03-19T12:54:11Z

If you use WebStorm you shall also restart.

Mauricio-Arantes · 2020-03-27T01:22:54Z

I have the same issue here,

Initially after a restart the file is green, then 3 seconds later highlighted in red again. So restarting in my case doesn't fix this issue.

axe-me · 2020-04-07T23:57:51Z

Initially after a restart the file is green, then 3 seconds later highlighted in red again. So restarting in my case doesn't fix this issue.

I had same issue, but that because I forgot to include the new created folder / ts file in the tsconfig.json

clearloop · 2020-04-14T07:04:18Z

I had same issue, but that because I forgot to include the new created folder / ts file in the tsconfig.json

Same, thanks bro!

davide1995 · 2020-05-05T14:48:29Z

In my case: "File" -> "Invalidate Caches / Restart..." -> "Invalidate and Restart", solved the issue

danmalloc · 2020-05-20T05:23:21Z

In my case, I fixed this by doing:

        "moduleResolution": "node"

This can also fix the issue:

        "module": "commonjs"

sdseenu · 2021-03-04T11:21:31Z

Stil i got same issues do it all steps above but noting to work. Any idea
import * as data from '../e2e/src/testData/login.json';

import error

Anyone to help

bujoriosif · 2021-03-04T11:32:46Z

Stil i got same issues do it all steps above but noting to work. Any idea
import * as data from '../e2e/src/testData/login.json';

import error

Anyone to help

Dummy question maybe: did you restarted VS Code after adding/changing moduelResolution?
Also resolveJsonModule is false, based on experience and answers above, it should be true.
Also try changing target to 'esNext'.

sdseenu · 2021-03-04T11:43:49Z

@bujoriosif is done all but not working

sdseenu · 2021-03-04T12:21:05Z

Any one to suggest am able to import json file. unfortunately not working

bujoriosif · 2021-03-04T12:46:23Z

Any one to suggest am able to import json file. unfortunately not working

what is the more specific error now? (as I understood, the previous one regarding import is gone now)

sdseenu · 2021-03-04T12:50:07Z

Any one to suggest am able to import json file. unfortunately not working

what is the more specific error now? (as I understood, the previous one regarding import is gone now)

This is error

sdseenu · 2021-03-04T12:52:12Z

Any one to suggest am able to import json file. unfortunately not working

what is the more specific error now? (as I understood, the previous one regarding import is gone now)

This is error

cdpautsch · 2021-03-15T13:22:03Z

I am running into the same issue. None of the suggested fixes work for me. I am using VSCode 1.54.2

My tsconfig.json:

"target": "esnext",    
"moduleResolution": "node",
"esModuleInterop": true,
"resolveJsonModule": true

I have reloaded and restarted but I am still getting the error.

MohammedFarooqS · 2021-04-21T14:32:21Z

Resolved this error: May help others,

In tsconfig.json

{
"compilerOptions": {
"target": "esnext",
"lib": [
"dom",
"dom.iterable",
"esnext"
],
"allowJs": true,
"skipLibCheck": true,
"esModuleInterop": true,
"allowSyntheticDefaultImports": true,
"strict": true,
"forceConsistentCasingInFileNames": true,
"module": "esnext",
"moduleResolution": "node",
"resolveJsonModule": true,
"isolatedModules": true,
"noEmit": true,
"jsx": "preserve"
},
"include": [
"src"
]
}

Then Npm install
Then Restart VSCODE...

Ibrahim-Mohamed2100 · 2021-04-22T00:40:35Z

Added these two flags Fixed it,

"compilerOptions": {
"resolveJsonModule": true,
"allowSyntheticDefaultImports":true
}

then import as default Like:
import jsonData from '../../../assets/sample-data/jsonFile.json';

Hope to Help!

shivamjjha · 2021-05-04T16:47:24Z

See Importing JSON file in TypeScript

hamidhadi · 2021-07-08T13:55:42Z

I still have this issue, and none of the mentioned solutions works for me.

edandweb · 2021-11-16T12:06:52Z

I add in the include "./**/*.json"
My include: "include": [ "./**/*", "./**/*.json" ],

For me it did the job :).

razshare · 2022-01-26T12:55:12Z

Adding "resolveJsonModule": true and restarting works as mentioned already, but you don't have to actually restart VSCode, you can just restart typescript itself:

mwilc0x · 2022-03-25T03:34:18Z

+1 restarting VSCode after adding "resolveJsonModule": true to tsconfig.json solved issue for me.

kahilkubilay · 2022-04-26T21:05:27Z

+1 restarting VSCode after adding "resolveJsonModule": true to tsconfig.json solved issue for me.

Could you share screenshots of tsconfig and rollup.config.js files?

In combination with tsconfig, maybe setting "resolveJsonModule": true in rollup.config.js will solve your problem.

rubnawazqureshidev · 2022-06-21T11:13:29Z

After setting resolveJsonModule to "true", I was having the same issue in VS Code, (TypeScript 3.2.2, VSCode 1.30.1). Restarting VS Code resolved the issue for me - I did not have to alter any other ts config

This actually worked. Thanks 😃

I same.

dgallardox · 2022-07-01T15:29:06Z

After setting resolveJsonModule to "true", I was having the same issue in VS Code, (TypeScript 3.2.2, VSCode 1.30.1). Restarting VS Code resolved the issue for me - I did not have to alter any other ts config

Same here. A simple restart fixed it. Thanks!

bzayn02 · 2022-07-05T00:46:43Z

Adding "moduleResolution":"Node" in tsconfig.json file, can help fix this issue.

EdsonAOJ · 2022-07-06T01:57:34Z

I just add the code

  "moduleResolution": "node",

and it stopped to get error.

alyelalwany · 2022-07-06T15:09:09Z

I restarted the TS Server and it did not help. Here are my tsconfig and my ts file.

ThayllanVivas · 2022-07-11T01:37:59Z

I added "moduleResolution": "node" and it worked

PrinceBrown · 2022-08-08T05:03:59Z

For those who have updated their target to esnext you need to add the following to your tsconfig: ... "target" : "esnext", "moduleResolution": "node", ...

This actually works when your
"target": "esNext"
Thank you

Michael-Swordys · 2022-09-01T13:58:32Z

Depois de definir resolveJsonModule como "true", eu estava tendo o mesmo problema no VS Code (TypeScript 3.2.2, VSCode 1.30.1). Reiniciar o VS Code resolveu o problema para mim - não precisei alterar nenhuma outra configuração ts

it didn't help me, but it should help some. on the stack there is already someone reporting this problem that helped me. in short add the field "moduleResolution": "node" in the compilerOptions object of the file 'tsconfig.js'

link below:

https://pt.stackoverflow.com/questions/553926/a-op%c3%a7%c3%a3o-resolvejsonmodule-n%c3%a3o-pode-ser-especada-sem-a-estrat%c3%a9gia-de-reso/553970#553970

yk-curu2 · 2022-12-20T03:07:38Z

I could not imoprt the package.json file to the vite.config.ts file.
I solved the problem by editing tsconfig.node.json as follows.

{
  "compilerOptions": {
    "composite": true,
    "module": "ESNext",
    "moduleResolution": "Node",
    "resolveJsonModule": true, // add
    "allowSyntheticDefaultImports": true
  },
  "include": [
    "vite.config.ts",
    "package.json" // add.
  ]
}

vite.config.ts

import pkg from './package.json'.

Finally, run it in VSCode's command palette.

Typescript: Restart TS server

We hope this helps.

avendesta · 2023-06-05T04:20:44Z

Okay, this is weird. I'm on Mac and using Vite to create my React app. I tried most of the above but none worked. I uninstalled VSCode, upgrade typescript, recreated my project and it worked.

bamoha · 2023-08-10T07:05:28Z

Updating VScode and restarting it fixed the issue for me.

zahidshowrav · 2023-09-30T09:56:39Z

In my Nextjs (v13.5.3) Typescript(v5.2.2) project, I had to keep "moduleResolution": "bundler", but I was getting the same error. Then I got that my vs code was running an older version of Typescript(v4.8.2). I have changed the vs code's Typescript use version to my workspace(V5.2.2). Bingoo... error gone :).

Following is how to change the vs code Typescript use version in 3 steps:

Opening the command palette (Ctrl/⌘ + Shift + P)
Searching for "TypeScript: Select TypeScript Version"
Selecting "Use Workspace Version"

Screenshot (Step 2):

Screenshot (Step 3):

Sanket-Rathod · 2023-11-16T09:06:25Z

updating "moduleResolution": "node16" worked for me in tsconfig.json file

mhegazy added the Bug A bug in TypeScript label Jul 3, 2018

mhegazy assigned sheetalkamat Jul 3, 2018

mhegazy added this to the TypeScript 3.0.1 milestone Jul 3, 2018

sheetalkamat added a commit that referenced this issue Jul 5, 2018

Do not report esModuleInterop needed error for json imports

cb622b4

Fixes #25400

sheetalkamat mentioned this issue Jul 5, 2018

Do not report esModuleInterop needed error for json imports #25457

Merged

mhegazy modified the milestones: TypeScript 3.0.1, TypeScript 3.0 Jul 5, 2018

mhegazy added the Fixed A PR has been merged for this issue label Jul 5, 2018

mhegazy closed this as completed in #25457 Jul 5, 2018

Sayan751 mentioned this issue May 23, 2019

CLI-less webpack build aurelia/cli#1105

Closed

timothypark33 mentioned this issue Aug 6, 2022

[Error] Option '--resolveJsonModule' cannot be specified without 'node' module resolution strategy. GUAJEGUICHAN-Practices/template_practice#5

Closed

Option resolveJsonModule doesn't work without esModuleInterop #25400

Option resolveJsonModule doesn't work without esModuleInterop #25400

Comments

ikokostya commented Jul 3, 2018

ikokostya commented Jul 3, 2018 • edited Loading

ne1410s commented Dec 24, 2018 • edited Loading

faltysad commented Feb 4, 2019

intelliot commented Jun 3, 2019

ErnestoIslas commented Jun 21, 2019

ps-arndwestermann commented Jul 16, 2019

brionmario commented Aug 11, 2019

redi-monappab commented Oct 27, 2019

ltomes commented Dec 2, 2019

ghost commented Jan 31, 2020

chrisj-skinner commented Mar 2, 2020

imanuelgittens commented Mar 2, 2020

ta3pks commented Mar 12, 2020

a-x- commented Mar 16, 2020 • edited Loading

joofholland commented Mar 19, 2020

Mauricio-Arantes commented Mar 27, 2020

axe-me commented Apr 7, 2020

clearloop commented Apr 14, 2020

davide1995 commented May 5, 2020

danmalloc commented May 20, 2020 • edited Loading

sdseenu commented Mar 4, 2021

bujoriosif commented Mar 4, 2021

sdseenu commented Mar 4, 2021

sdseenu commented Mar 4, 2021

bujoriosif commented Mar 4, 2021

sdseenu commented Mar 4, 2021

sdseenu commented Mar 4, 2021

cdpautsch commented Mar 15, 2021 • edited Loading

MohammedFarooqS commented Apr 21, 2021 • edited Loading

Ibrahim-Mohamed2100 commented Apr 22, 2021 • edited Loading

shivamjjha commented May 4, 2021

hamidhadi commented Jul 8, 2021

edandweb commented Nov 16, 2021

razshare commented Jan 26, 2022 • edited Loading

mwilc0x commented Mar 25, 2022

kahilkubilay commented Apr 26, 2022

rubnawazqureshidev commented Jun 21, 2022

dgallardox commented Jul 1, 2022

bzayn02 commented Jul 5, 2022

EdsonAOJ commented Jul 6, 2022 • edited Loading

alyelalwany commented Jul 6, 2022 • edited Loading

ThayllanVivas commented Jul 11, 2022

PrinceBrown commented Aug 8, 2022

Michael-Swordys commented Sep 1, 2022 • edited Loading

yk-curu2 commented Dec 20, 2022 • edited Loading

avendesta commented Jun 5, 2023

bamoha commented Aug 10, 2023

zahidshowrav commented Sep 30, 2023

Sanket-Rathod commented Nov 16, 2023

ikokostya commented Jul 3, 2018 •

edited

Loading

ne1410s commented Dec 24, 2018 •

edited

Loading

a-x- commented Mar 16, 2020 •

edited

Loading

danmalloc commented May 20, 2020 •

edited

Loading

cdpautsch commented Mar 15, 2021 •

edited

Loading

MohammedFarooqS commented Apr 21, 2021 •

edited

Loading

Ibrahim-Mohamed2100 commented Apr 22, 2021 •

edited

Loading

razshare commented Jan 26, 2022 •

edited

Loading

EdsonAOJ commented Jul 6, 2022 •

edited

Loading

alyelalwany commented Jul 6, 2022 •

edited

Loading

Michael-Swordys commented Sep 1, 2022 •

edited

Loading

yk-curu2 commented Dec 20, 2022 •

edited

Loading