In ES6/ES2015, you can import json file in your code. For example, Given you have this ` file: example.json {"name": "testing"} You could import it in ES6/ES2015 like this. // ES6/ES2015// app.js import * as data from './example.json'; const word = data.name; console.log(word); // output 'testing' In , however, the same code will throw error: Typescript Cannot find module 'example.json' [UPDATE] Solution: Typescript 2.9 supports JSON import! If you are using Typescript version 2.9, you don’t need to follow solution 2. Here is how you can do it: In your `tsconfig.json` file, under compiler options, add these two lines: {"compilerOptions": {"resolveJsonModule": true,"esModuleInterop": true}} Then you can import like this: json // Typescript// app.ts import data from './example.json'; const word = (<any>data).name; console.log(word); // output 'testing' Easy Peasy! Solution: Using Wildcard Module Name In Typescript , we can use . In your TS Definition file, e.g. `, you can add this line: version 2 + wildcard character in module name typings.d.ts declare module "*.json" {const value: any;export default value;} Then, your code will work like charm! // Typescript// app.ts import * as data from './example.json'; const word = (<any>data).name; console.log(word); // output 'testing' Sample code here: https://github.com/chybie/ts-json This solution works well with Angular project too. is how hackers start their afternoons. We’re a part of the family. We are now and happy to opportunities. Hacker Noon @AMI accepting submissions discuss advertising &sponsorship To learn more, , , or simply, read our about page like/message us on Facebook tweet/DM @HackerNoon. If you enjoyed this story, we recommend reading our and . Until next time, don’t take the realities of the world for granted! latest tech stories trending tech stories
Share Your Thoughts