要实现Angular自定义webpack多目标设置,可以按照以下步骤进行操作:
打开项目根目录下的angular.json
文件。
在projects
下的你的项目名称中添加一个新的配置项,例如customWebpack
:
"projects": {
"your-project-name": {
...
"architect": {
...
"customWebpack": {
"builder": "@angular-builders/custom-webpack:browser",
"options": {
"customWebpackConfig": {
"path": "./custom-webpack.config.js"
},
"outputPath": "dist"
}
}
}
}
}
custom-webpack.config.js
的文件,并在其中定义自定义的webpack配置。例如,以下是一个简单的示例:module.exports = {
module: {
rules: [
{
test: /\.txt$/,
use: 'raw-loader'
}
]
}
};
angular.json
的scripts
下,为新配置项指定使用的webpack配置文件路径:"projects": {
"your-project-name": {
...
"architect": {
...
"customWebpack": {
...
"options": {
...
"scripts": [
{
"input": "custom-webpack.config.js"
}
]
}
}
}
}
}
ng run your-project-name:customWebpack
这样就可以使用自定义的webpack配置来构建Angular项目了。请根据实际需求修改自定义webpack配置以满足你的项目需求。