31

I am wondering how to extend ng build to run tasks after it has finished.

At the moment, my end goal is to copy my 'package.json' to the dist folder.

Something like this if I was using plain npm:

"postbuild": "cpx ./package.json ./dist/",

I know in the angular-cli.json I can use "assets" to copy static files, but it does not work for files outside of src. So, I'm wondering if I can do the copy task after ng build completes.

pjpscriv
  • 866
  • 11
  • 20
mrshickadance
  • 1,213
  • 4
  • 20
  • 34

2 Answers2

46

Define an npm script 

"build":" "ng build"

and add the postbuild script, too. 

"postbuild": "cpx ./package.json ./dist/",

This way the copy script gets called after you run npm run build.

Alexander Ciesielski
  • 10,506
  • 5
  • 45
  • 66
  • 45
    Is there a way to make this work when using `ng build --watch` and run a script after every build? – kapoko Nov 23 '17 at 13:18
  • @kapser Seems like someone came up with a solution: https://stackoverflow.com/questions/42364234/hook-into-angular-cli-build-watch – Amir Shirazi May 09 '18 at 17:19
  • 4
    Tested in Angular 7.2, but it only works when --configure equals development, not production. How to run postbuild script for production builds? – Anderson Madeira Jan 22 '19 at 14:23
9

You can execute any custom script before or after any npm script. This is called 'hooks' and it is included in npm. In your case you can execute a 'post' hook but keep in mind that it is also possible to execute 'pre' hook.

define these 3 scripts in your package.json: 

"hello": "echo execute hello",
"prehello": "echo execute prehello",
"posthello": "echo execute posthello"

You can find many more useful information about that here: https://www.marcusoft.net/2015/08/pre-and-post-hooks-for-npm-scripting.html

pegaltier
  • 494
  • 4
  • 11