@angular-devkit/build-webpack
Advanced tools
Package description
The @angular-devkit/build-webpack package is a toolkit designed to work with Angular projects, providing utilities and features to enhance the build process of Angular applications using Webpack. It abstracts complex configurations and optimizations into more manageable and Angular-centric commands and configurations.
Custom Webpack Configuration
Allows developers to extend or override the default Webpack configuration used by Angular CLI, enabling customizations and optimizations specific to their project's needs.
const { buildWebpackConfig } = require('@angular-devkit/build-webpack');
const customWebpackConfig = {
// Custom Webpack configurations
};
const webpackConfig = buildWebpackConfig(defaultConfig, customWebpackConfig);Webpack Dev Server Integration
Facilitates the integration of Webpack Dev Server with Angular projects, simplifying the process of serving applications locally for development with live reloading and other development-friendly features.
const { serveWebpackBrowser } = require('@angular-devkit/build-webpack');
serveWebpackBrowser({
// Options for serving
});Optimization Utilities
Provides utilities to optimize the Webpack configuration for production builds, including minification, tree shaking, and other performance enhancements.
const { optimizeWebpackConfig } = require('@angular-devkit/build-webpack');
const optimizedConfig = optimizeWebpackConfig(defaultConfig, {
// Optimization options
});Webpack is the core technology behind @angular-devkit/build-webpack. It's a static module bundler for JavaScript applications. While @angular-devkit/build-webpack provides Angular-specific integrations and abstractions, Webpack itself is more generic and can be used with any JavaScript framework or library.
Angular CLI is a command-line interface tool that you use to initialize, develop, scaffold, and maintain Angular applications. It uses @angular-devkit/build-angular, which in turn relies on @angular-devkit/build-webpack for its Webpack integration. Angular CLI abstracts away much of the complexity of the build configuration, making it easier to use but less flexible than directly using Webpack or @angular-devkit/build-webpack.
Create React App is a similar tool to Angular CLI but for React applications. It abstracts the Webpack configuration for React projects, providing a simplified development experience. Unlike @angular-devkit/build-webpack, it's tailored specifically for React and doesn't offer the same level of Angular integration or customization.
Readme
This package allows you to run Webpack and Webpack Dev Server using Architect.
To use it on your Angular CLI app, follow these steps:
npm install @angular-devkit/build-webpack.angular.json. "projects": {
"app": {
// ...
"architect": {
// ...
"build-webpack": {
"builder": "@angular-devkit/build-webpack:webpack",
"options": {
"webpackConfig": "webpack.config.js"
}
},
"serve-webpack": {
"builder": "@angular-devkit/build-webpack:webpack-dev-server",
"options": {
"webpackConfig": "webpack.config.js"
}
}
}
ng run app:build-webpack to build, and ng run app:serve-webpack to serve.All options, including watch and stats, are looked up inside the webpack configuration.
FAQs
Webpack Builder for Architect
The npm package @angular-devkit/build-webpack receives a total of 2,193,316 weekly downloads. As such, @angular-devkit/build-webpack popularity was classified as popular.
We found that @angular-devkit/build-webpack demonstrated a healthy version release cadence and project activity because the last version was released less than a year ago. It has 2 open source maintainers collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
UnitedHealth Group disclosed that the ransomware attack on Change Healthcare compromised protected health information for millions in the U.S., with estimated costs to the company expected to reach $1 billion.
Security News
GitHub is susceptible to a CDN flaw that allows attackers to host malware on any public repository.
Security News
At Node Congress, Socket CEO Feross Aboukhadijeh uncovers the darker aspects of open source, where applications that rely heavily on third-party dependencies can be exploited in supply chain attacks.