Angular: Add hashing to the files in assets during build

Viewed 6836

I have been looking up for the solution but nothing is useful is found yet.

Problem: I have an application in angular and I've added custom styles and scripts in my assets folder. The location of my assets folder is src->assets. I make the build of my project using ng build --prod --output-hashing=all but the problem with this command is that it only hashes components & images used in my component but all the other files such as CSS, js files, and images that added by CSS are not hashed in the build.

It is causing problem on the customer side as due to continuous releases, sometimes the browser doesn't refresh CSS, JS files for new deployed release and they complain that the styling and features are not working.

What I have tried: I tried many things like i mentioned above.

  1. ng build --prod
  2. output-hashing

But none of them have been beneficial for me. All i want is to get my custom css and js files get hashed during build. Is there any solution?

PLEASE FEEL FREE TO ASK ANYTHING ELSE THAT IS REQUIRED OR I MISSED IN MY QUESTION

*EDIT: * Similar question have been asked here but not answered properly yet.

1 Answers

Assets in the assets folder are not hashed only files in the root.

If you wish to hash files with --output-hashing=all, put them in the root as follows:

In angular.json in assest:[]

"assets": [
              "src/file.css",
              "src/file.js",
              "src/file.png",
              "src/assets",
              {
                "glob": "**/*",
                "input": "some/path",
                "output": "/"
              }
            ],

file.css. file.js, file.png and all files from some/path will be copied to dist/yourProjectName and will be hashed with the hash of their content. All files in assets will remain as is.

Related