I created a project with Angular 2 using Angular-cli. When I run
ng build --prod
I don't have my js and css files minifyed. These files are located in assets/js/ and assets/css/.
How do I minify them? Thanks!
Add a comment
|
2 Answers
the assets-folder is included in your build because the folder is listed in the assets-array in angular-cli.json.
everything in the assets-array is copied "as-is" on build.
if you add your css and scripts to the styles and scripts -arrays in angular-cli.json they will be bundled on build so that all your css will be in styles.bundle.js (yes js).
you should not reference the css or js files in your index.html, angular-cli will insert the bundles in index.html.
If you still want the files to live inside the assets folder, remember it is copied "as is" so you can use any tool you like to minify whats in that folder, (e.g. https://www.npmjs.com/package/minifier) angular-cli will not touch it, just copy it on build.
2 Comments
mi-ho
Yes, I get it now. Thank you for the explanation. I am now wondering one more thing though - If I am using these styles for development, am I supposed to manually delete the included css/js files from my index.html, or should I for example do some other configuration? What is the correct workflow for this?
mi-ho
Oh I see - it works the same way with ng serve. It seems like it gets whatever files in those asset folders and minify them, so they are not required for dev either. Thanks
Add your styles & js in angular-cli.json
"styles": [
"assets/css/style.css",
"assets/css/fonts.css"
],
"scripts": [
"assets/js/app.js",
"assets/js/other.js"
]
