Angular CLI create a css file "copy" on scss build

Question

I have an angular 7 application, everything builds fine. I have a bunch of SASS files, they get complied and included at runtime. All is well.

I am trying to create some static html pages for developer documentation that use the same theme as the compiled one, problem is, in our test environment the css file that gets built/included is a cache-bust version like styles.ac795370d5a11a9e4dc3.css so i cant hard code a link to my static HTML pages.

Is there a way with angular.json during the build to create another "copy" of the generated css file and drop it in a folder of my choosing?

So, as far as another copy is concerned, it looks like it's not possible within the angular.json itself. A simple solution would be to make an npm script that runs the build, then use a postscript to copy the files without the hash. I'll add this as an answer. — Jacques
– Jacques, Commented Aug 5, 2019 at 2:28

Jacques · Accepted Answer · 2019-08-05 02:43:14Z

3

As far as "another copy" is concerned, it looks like it's not possible within the angular.json itself.

A simple solution would be to make an npm script that runs the build, then use a postscript to copy the files without the hash.

Eg - package.json

{
  ...
  scripts: [
    "build:prod": "ng build --prod",
    "postbuild:prod": "cp dist/<your-proj-dir>/styles.*.css dist/<your-proj-dir>/styles.css"
  ],
  ...
}

In the cp command, you can copy it anywhere. I just assumed you would want it in the same directory.

answered Aug 5, 2019 at 2:43

Jacques

3,7942 gold badges23 silver badges45 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

swandog Over a year ago

If your build machine is a different OS (linux) then you'll have problems. I like the postbuild. Here is what I used...I needed the raw style copied to the dist folder. used a package called shx to run powershell.... "build:prod": "ng build --prod --source-map", "postbuild:prod": "shx cp -f ./src/styles.scss ./dist/styles.scss",

Collectives™ on Stack Overflow

Angular CLI create a css file "copy" on scss build

1 Answer 1

1 Comment

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Related