angular 7 - importing a json file - compilation error

Question

A really nice feature of angular 7 is the support for typescript 3.1:

I've Added the following 3 lines to the tsconfig.json file - under the 'compilerOptions' section:

"resolveJsonModule": true,
"esModuleInterop": true,
"allowSyntheticDefaultImports": true

Everything looks good - i can iterate over my json file without a problem.

But for some reason i'm getting a "TS2307: Cannot find module " error in my IDE:

I've tried changing the import syntax to the suggestions in here: Importing json file in TypeScript

But without success.

Any ideas?

Edit: I use Webstorm as an IDE.

Did you ever get this worked out? I'm dealing with the same. — Faraji Anderson, Jun 07 '19 at 15:26

score 2 · Accepted Answer · answered Jun 10 '19 at 16:20

2

So you didn't mention the IDE you were using but I use VSCode and what helped me was adding:

"angularCompilerOptions": {
"annotateForClosureCompiler": false  
}

To src/tsconfig.app.json

And I no longer have importing issues, with my IDE with .json files. Pro tip, try:

import { default as awsData } from `....`

This will get rid of the import being added as a default property in the returned JSON object.

answered Jun 10 '19 at 16:20

Faraji Anderson

I use Webstorm - Edited my question. – Rot-man Jun 10 '19 at 16:23
Not sure how this helps as default is `false` already: https://v7.angular.io/guide/aot-compiler#annotateforclosurecompiler – Mike Goodstadt Aug 22 '20 at 06:57

score -2 · Answer 2 · answered Dec 23 '18 at 17:37

-2

Restarting the IDE after setting "resolveJsonModule": true should work.

answered Dec 23 '18 at 17:37

user2191410

2 Answers2