Angular-cli: Allow JSON files to be cacheable (in the assets folder)

[manekinekko]

Bug Report or Feature Request

• [ ] bug report -> please search issues before submitting
• [x] feature request

Desired functionality.

Allow JSON files that are in the assets folder to be processed by the url-loader (for cache busting).

Mention any other details that might be useful.

In some cases, JSON files may contain static content or extra business configuration that needs to be edited by non-dev folks. Those JSON files should be editable without having to rebuild the entire app.

Related PR: #7499
See initial request: https://twitter.com/maalaouiiheb/status/900827200861208576

[clydin]

The url-loader creates data URIs for relevant files that are referenced via require or import and also meet the size threshold. This allows the files to be embedded within the output. Those files which do not meet the size threshold are automatically added to the build output. In a production build, those files would also have their filenames altered to include a hash of their content. The files are not meant to be modified after the fact as this would cause the hash to no longer represent the content and, as a consequence, break the cache-busting intent of the filename.

In addition, files within a configured asset directory are copied verbatim to the output directory and are intentionally not otherwise processed.

For the use case outlined above, the JSON file should be placed in a configured asset directory and then fetched (e.g., with Angular's http service) at runtime by the app. Enabling ETag support on the web server would probably also be a good idea; especially if the file is intended to be changed after deployment. Alternatively, if the file is meant to changed frequently, caching could be disabled completely for the file.

[manekinekko]

Thanks @clydin for the clarification. Sounds good to me.

[filipesilva]

Great response by @clydin. Just want to link here to a related topic to this discussion (drop in config files) that also has an example: https://github.com/angular/angular-cli/issues/3855#issuecomment-301864970.

[angular-automatic-lock-bot[bot]]

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{_This action has been performed automatically by a bot._}