JavaScript file names are getting changed after building using "ng build" command in Angular

Issue

I am new to Angular. I see that, there are some files like runtime.js, polyfills.js, main.js, styles.css etc getting generated by Angular cli when creating a new project.
When I build the app using ng build command, inside the dist directory, I am getting similar files with a random number added in these file names like main.some_random_number.js

Is there any configuration that will stop this file name change? I am having issues on accessing these files through Express.js path since I don’t know what file name will be after I run ng build command.

enter image description here

Solution

Angular is cache busting the files, so that when you deploy a new version, there is no chance that, old code will be viewed in your browser.

If you want to cache bust your application, you need to toggle the flag.

--output-hashing – controls addition of the cache busting random string.

As per angular documentation.

–output-hashing Define the output filename cache-busting hashing mode.

none | all | media | bundles

So set it to none to remove the hash.

You can either set it in the command ng build --output-hashing=none or in the angular.json configurations array

Answered By – Naren Murali

This Answer collected from stackoverflow, is licensed under cc by-sa 2.5 , cc by-sa 3.0 and cc by-sa 4.0

Leave a Reply

(*) Required, Your email will not be published