How to use Angular CLI build commands
Łukasz Holeczek
Follow Łukasz Holeczek on GitHub
Connect with Łukasz Holeczek on LinkedIn
Follow Łukasz Holeczek on X (Twitter)
Understanding Angular CLI build commands is essential for compiling applications efficiently with proper optimizations for different environments. As the creator of CoreUI with over 11 years of Angular development experience since 2014, I’ve optimized build configurations for countless production deployments. The most effective approach is to use Angular CLI’s build command with configuration flags for environment-specific builds. This system provides powerful optimization options and flexible output configurations.
Use ng build with configuration flags to compile Angular applications.
# Development build (default)
ng build
# Production build with optimizations
ng build --configuration production
# Production build (shorthand)
ng build --prod
# Build with specific output path
ng build --output-path dist/my-app
# Build with base href for subdirectory deployment
ng build --base-href /my-app/
# Watch mode for development
ng build --watch
# Build stats for bundle analysis
ng build --stats-json
# Build all projects in workspace
ng build --project my-app
The ng build command compiles your Angular application into an output directory (default: dist/). Production builds enable optimizations including ahead-of-time compilation, minification, dead code elimination, and source map generation. The --watch flag rebuilds automatically when files change. The --stats-json flag generates a stats file for analyzing bundle sizes with tools like webpack-bundle-analyzer.
Best Practice Note
This is the same build configuration we use for CoreUI Angular production deployments. Always use --configuration production for production builds to enable all optimizations. Monitor bundle sizes using --stats-json and the webpack bundle analyzer to identify optimization opportunities. Configure additional build configurations in angular.json for staging or testing environments.
