Within my Angular and Typescript 2.2 project, I occasionally import *.json files as test data for my components during development. To enable the importing of a .json file as a module, I made an addition to typings.d.ts:
declare module '*.json' {
const value: any;
export default value;
}
While I can assign the file content to a field with type 'any', my goal is to assign it to a field with a specific interface type instead of keeping it open to all types within the module definition.
import {ProcessMilestone} from '../../../domain';
import * as milestones from './test.json';
export class MilestoneSearchComponent implements OnInit {
data: ProcessMilestone[];
ngOnInit(): void {
this.data = <ProcessMilestone[]> milestones;
}
}
However, this approach results in the error:
Type 'typeof '*.json'' cannot be converted to type 'ProcessMilestone[]>'. Property 'includes' is missing in type 'typeof '*.json''.
It's evident that casting is not feasible due to the existing module definition of '*.json'. Is there a way to adjust this so casting becomes possible? I am unsure of the potential solutions.
I am looking for solutions that require minimal effort. If not, I will resort to fetching the data from the backend instead.