Include folder of JSON files at build time

Question

My Angular 12 application -- a dashboard for an embedded system -- relies on JSON files, which are used at runtime to generate forms etc.

Some files are known before compilation. I declared an interface to be able to type check their values in code, and added a typings.d.ts file to declare them as modules:

declare module 'params.json' {
  const value: IParams;
  export default value;
}

Then, in my services, I just include them that way:

import params from 'src/assets/data/params.json';

That way, I can avoid making asychronous HTTP calls to read the files. Instead, their content is included in my application at build time.

However, I have a problem with a folder of JSON files which can contain a varying number of files. I tried going the same way:

declare module 'sensors/*.json' {
  const value: ISensor;
  export default value;
}

But then, how would I be able to import the files?

In an ideal world, I'd like to get a Record with filenames as key, and JSON file contents as value.

Please ask me for more details if the question isn't clear enough.

Include folder of JSON files at build time

0 Answers