Сообщение "Создание пакетов приложений браузера" при создании версии для разработчиков

Question

Я использую Angular 12.0.2 и вижу сообщение Generating browser application bundles. Я не строить лезвием версии, но работает в Dev версии. Это нормальное поведение для Angular Development Build?

Исходные файлы Google Chrome DevTools:

Answer 1

Я попытался решить эту проблему для себя, но мне не повезло, но я смог найти решение этой проблемы, которое позволит вам увидеть исходный код в инструменте разработки. Все, что вам нужно сделать, это создать конфигурацию dev в файле angular.json, а затем в serve:browsertarget указать имя вашей конфигурации.

Так же, как этот блок:- Вы найдете свой angular.json с приведенным ниже кодом

            "configurations": {
        "production": {
          "fileReplacements": [
            {
              "replace": "src/environments/environment.ts",
              "with": "src/environments/environment.prod.ts"
            }
          ],
          "optimization": true,
          "outputHashing": "all",
          "sourceMap": false,
          "extractCss": true,
          "namedChunks": false,
          "extractLicenses": true,
          "vendorChunk": false,
          "buildOptimizer": true,
          "budgets": [
            {
              "type": "initial",
              "maximumWarning": "2mb",
              "maximumError": "5mb"
            },
            {
              "type": "anyComponentStyle",
              "maximumWarning": "6kb",
              "maximumError": "10kb"
            }
          ]
        }
      }
    },
    "serve": {
      "builder": "@angular-devkit/build-angular:dev-server",
      "options": {
        "browserTarget": "geospatial:build"
      },
      "configurations": {
        "production": {
          "browserTarget": "geospatial:build:production"
        }
      }
    }

Все, что вам нужно сделать, это обновить этот блок кода своей собственной конфигурацией разработчика. Как это:

            "configurations": {
        "production": {
          "fileReplacements": [
            {
              "replace": "src/environments/environment.ts",
              "with": "src/environments/environment.prod.ts"
            }
          ],
          "optimization": true,
          "outputHashing": "all",
          "sourceMap": false,
          "extractCss": true,
          "namedChunks": false,
          "extractLicenses": true,
          "vendorChunk": false,
          "buildOptimizer": true,
          "budgets": [
            {
              "type": "initial",
              "maximumWarning": "2mb",
              "maximumError": "5mb"
            },
            {
              "type": "anyComponentStyle",
              "maximumWarning": "6kb",
              "maximumError": "10kb"
            }
          ]
        }
      }
      "development": {
          "optimization": false,
          "buildOptimizer": false
        }
    },
    "serve": {
      "builder": "@angular-devkit/build-angular:dev-server",
      "options": {
        "browserTarget": "geospatial:build:development"
      },
      "configurations": {
        "production": {
          "browserTarget": "geospatial:build:production"
        }
      }
    }

Итак, здесь вы создаете свою собственную конфигурацию разработки, в которой вы можете отменить оптимизацию и buildOptimizer. После этого вы можете просто выполнить ng serve, и он покажет весь исходный код в инструментах разработчика. Также это не повлияет на вашу производственную сборку.

Я все еще пытаюсь понять, почему angular оптимизирует код даже для среды разработки. Я обновлю ответ после этого. Но пока приведенный выше код отвечает на ваш вопрос.

Answer 2

Да, это нормально. Он даже говорит вам не использовать эту сборку для выпусков PRODUCTION.