Angular.json具有脚本和样式两个属性

Question

我试图将样式和脚本添加到我的angular.json文件中，但由于某种原因，两者似乎都不起作用，引导和其他脚本都没有生效，后来我发现angular.jsn中有两个地方可以写脚本和样式，请参阅下面的

{
  "$schema": "./node_modules/@angular/cli/lib/config/schema.json",
  "version": 1,
  "newProjectRoot": "projects",
  "projects": {
    "angular-firebase": {
      "projectType": "application",
      "schematics": {
        "@schematics/angular:application": {
          "strict": true
        }
      },
      "root": "",
      "sourceRoot": "src",
      "prefix": "app",
      "architect": {
        "build": {
          "builder": "@angular-devkit/build-angular:browser",
          "options": {
            "outputPath": "dist/angular-firebase",
            "index": "src/index.html",
            "main": "src/main.ts",
            "polyfills": "src/polyfills.ts",
            "tsConfig": "tsconfig.app.json",
            "assets": [
              "src/favicon.ico",
              "src/assets"
            ],
            "styles": [
              "src/styles.css",
              "node_modules/bootstrap/dist/css/bootstrap.min.css"
          ],
          "scripts": [
              "node_modules/jquery/dist/jquery.min.js",
              "node_modules/popper.js/dist/umd/popper.min.js",
              "node_modules/bootstrap/dist/js/bootstrap.min.js"
          ]
          },
          "configurations": {
            "production": {
              "budgets": [
                {
                  "type": "initial",
                  "maximumWarning": "500kb",
                  "maximumError": "1mb"
                },
                {
                  "type": "anyComponentStyle",
                  "maximumWarning": "2kb",
                  "maximumError": "4kb"
                }
              ],
              "fileReplacements": [
                {
                  "replace": "src/environments/environment.ts",
                  "with": "src/environments/environment.prod.ts"
                }
              ],
              "outputHashing": "all"{
                "$schema": "./node_modules/@angular/cli/lib/config/schema.json",
                "version": 1,
                "newProjectRoot": "projects",
                "projects": {
                  "angular-crud": {
                    "projectType": "application",
                    "schematics": {
                      "@schematics/angular:application": {
                        "strict": true
                      }
                    },
                    "root": "",
                    "sourceRoot": "src",
                    "prefix": "app",
                    "architect": {
                      "build": {
                        "builder": "@angular-devkit/build-angular:browser",
                        "options": {
                          "outputPath": "dist/angular-crud",
                          "index": "src/index.html",
                          "main": "src/main.ts",
                          "polyfills": "src/polyfills.ts",
                          "tsConfig": "tsconfig.app.json",
                          "assets": [
                            "src/favicon.ico",
                            "src/assets"
                          ],
                          "styles": [
                            "src/styles.css"
                          ],
                          "scripts": []    
                        },
                        "configurations": {
                          "production": {

我的问题是，为什么我们有2个architect.build来在angular.json中插入样式和脚本？

Answer 1

因为有些项目可能需要特定环境的特定样式，或者仅在构建中或仅在服务器中，通过这种方式，您可以指定在什么环境中需要什么。

例如，我只想在我的生产构建中加载谷歌分析，而不是在服务器上加载，所以我将其包含在"build"中"production"配置的"scripts"中，而不是"development"配置中。