Cannot find module on import with local JSON file - json

Question

I have this simple angular project and I'm having trouble importing a local json file that I created. Here's the JSON file:
{
"id": 1,
"firstName": "Uziel",
"lastName": "Cabanban",
"car" : {
"brand": "Toyota",
"model": "Vios",
"year": 2017
}
}
The JSON file is stored in this directory: src/assets/sampleJson.json.
Here is my component that tries to import said json file:
import { Component, OnInit } from '#angular/core';
import SampleJson from '../assets/sampleJson.json';
#Component({
selector: 'app-root',
templateUrl: './app.component.html',
styleUrls: ['./app.component.css']
})
export class AppComponent {
}
I haven't written anything yet as I'm getting a red line in the import SampleJson from '../assets/sampleJson.json
Any suggestion will be much appreciated

Answer 1

Thanks for all of the suggestions but I went another direction and didn't use import anymore. Instead I used require and I used it like this:
import { Component } from '#angular/core';
import { user } from './user.model';
declare var require: any;
var myUser: user = require('../assests/sampleJson.json');
#Component({
selector: 'app-root',
templateUrl: './app.component.html',
styleUrls: ['./app.component.css']
})
export class AppComponent {
constructor () {
console.log(myUser);
}
}
So far it prints the contents of my json file

Answer 2

.json file is not a TypeScript module. Since you want local file (assuming it is hardcoded), you can do it by creating a .ts file and export a constant/variable from it like following:
sampleJson.ts
export const SampleJson = {
"id": 1,
"firstName": "Uziel",
"lastName": "Cabanban",
"car" : {
"brand": "Toyota",
"model": "Vios",
"year": 2017
}
}
Then in the component:
import SampleJson from '../assets/sampleJson'; // path can change
Hope this helps
More on TypeScript Modules: https://www.typescriptlang.org/docs/handbook/modules.html
Update
Or you can import a JSON file using
import * as SampleJSON from 'path/to/json/sampleJson.json
with TypeScript v2.9.+ according to this answer:
https://stackoverflow.com/a/50674344/1331040