Angular CLI 6.0.1 如何控制开发环境和webpack
Angular CLI 6.0.1 how to control dev environment and webpack
这是angular.json的一部分:
"configurations": {
"production": {
"optimization": true,
"outputHashing": "all",
"sourceMap": false,
"extractCss": true,
"namedChunks": false,
"aot": true,
"extractLicenses": true,
"vendorChunk": false,
"buildOptimizer": true,
"fileReplacements": [
{
"replace": "src/environments/environment.ts",
"with": "src/environments/environment.prod.ts"
}
]
}
我想做的是控制开发环境。例如,将 sourceMap
更改为 false
,我不想通过向 ng build
添加参数来做到这一点。 在angular.json
里面有没有等同于production
的东西,指的是发展?
还有一些非常重要的事情:在Angular-CLI 6 中没有ng eject
!那么,如何查看和修改 webpack.config.js ?
所有环境的默认设置都在 architect > build > options
属性
"projects": {
"MyProject": {
"root": "",
"sourceRoot": "src",
"projectType": "application",
"architect": {
"build": {
"builder": "@angular-devkit/build-angular:browser",
"options": {
"outputPath": "dist",
"index": "src/index.html",
"main": "src/main.ts",
"tsConfig": "src/tsconfig.app.json",
"polyfills": "src/polyfills.ts",
//Add settings here
"sourceMap": false,
"fileReplacements": [
{
"replace": "src/environments/environment.ts",
"with": "src/environments/environment.anotherdevenv.ts"
}
]
这些设置按原样用于开发环境,因此您可以修改它(但如果其他环境不覆盖指定设置,这将影响它们)
您还可以创建自己的 "development" 配置(例如,通过复制生产 conf,并根据您的需要进行更改),并在该 conf 中指定特定于开发环境的设置。然后运行下面的命令
ng serve -c development
eject
命令暂时禁用,但根据 angular cli 团队 (https://github.com/angular/angular-cli/issues/10945)[=15= 核心成员的评论,应该会尽快添加回来]
我在这里找到了 webpack 配置:node_modules/@angular-devkit/build-angular/src/angular-cli-files/models/webpack-configs/common.js
这是angular.json的一部分:
"configurations": {
"production": {
"optimization": true,
"outputHashing": "all",
"sourceMap": false,
"extractCss": true,
"namedChunks": false,
"aot": true,
"extractLicenses": true,
"vendorChunk": false,
"buildOptimizer": true,
"fileReplacements": [
{
"replace": "src/environments/environment.ts",
"with": "src/environments/environment.prod.ts"
}
]
}
我想做的是控制开发环境。例如,将 sourceMap
更改为 false
,我不想通过向 ng build
添加参数来做到这一点。 在angular.json
里面有没有等同于production
的东西,指的是发展?
还有一些非常重要的事情:在Angular-CLI 6 中没有ng eject
!那么,如何查看和修改 webpack.config.js ?
所有环境的默认设置都在 architect > build > options
属性
"projects": {
"MyProject": {
"root": "",
"sourceRoot": "src",
"projectType": "application",
"architect": {
"build": {
"builder": "@angular-devkit/build-angular:browser",
"options": {
"outputPath": "dist",
"index": "src/index.html",
"main": "src/main.ts",
"tsConfig": "src/tsconfig.app.json",
"polyfills": "src/polyfills.ts",
//Add settings here
"sourceMap": false,
"fileReplacements": [
{
"replace": "src/environments/environment.ts",
"with": "src/environments/environment.anotherdevenv.ts"
}
]
这些设置按原样用于开发环境,因此您可以修改它(但如果其他环境不覆盖指定设置,这将影响它们)
您还可以创建自己的 "development" 配置(例如,通过复制生产 conf,并根据您的需要进行更改),并在该 conf 中指定特定于开发环境的设置。然后运行下面的命令
ng serve -c development
eject
命令暂时禁用,但根据 angular cli 团队 (https://github.com/angular/angular-cli/issues/10945)[=15= 核心成员的评论,应该会尽快添加回来]
我在这里找到了 webpack 配置:node_modules/@angular-devkit/build-angular/src/angular-cli-files/models/webpack-configs/common.js