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

【问题标题】：Angular.json has two properties of script and stylesAngular.json 有脚本和样式两个属性
【发布时间】：2022-01-02 09:37:38
【问题描述】：

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

{
  "$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 中插入样式和脚本？

【问题讨论】：

标签： javascript json angular

【解决方案1】：

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

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

【讨论】：