Menu
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!
692
To minify CSS, try CSSNano and csso. To minify JavaScript, try UglifyJS. The Closure Compiler is also very effective. You can create a build process that uses these tools to minify and rename the development files and save them to a production directory.
ng build --prod still does NOT minify / uglify / remove comments using angular-cli 9 (and 8) #17550.
To minify JS, CSS and HTML files, comments and extra spaces need to be removed, as well as crunch variable names so as to minimize code and reduce file size. The minified file version provides the same functionality while reducing the bandwidth of network requests.
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.
152
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"
]
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
