Перенес приложение на Angular 6: Но, получая ошибки при запуске npm, запустите build --prod.Но команда npm run build --env = prod выполняется успешно

Question

Когда я использую команду npm, запустите build - --prod Я получаю следующие сообщения об ошибках:

• Свойство 'PropertyName1' является частным и доступно только в классеAppComponent
• Свойство PropertyName2 не существует в типе AppComponent

ОШИБКА в src \ app \ components \ app \ app.component.html (77, 56):: Свойство validate является закрытым и доступно только в классе AppComponent.src \ app \ components \ entitysearchlight \ entitysearchlight.component.html (3,157):: Свойство loadingMessage является закрытым и доступно только в классе EntitySearchLightComponent.src \ app \ components \ entitysearchlight \ entitysearchlight.component.html (23,91):: ожидается 0 аргументов, но получено 1. src \ app \ components \ entitysearchlight \ entitysearchlight.component.html (97,62):: свойство 'e 'не существует для типа' EntitySearchLightComponent '.src \ app \ components \ search \ search.component.html (3 157):: свойство 'loadingMessage' является закрытым и доступно только в классе 'SearchComponent'.src \ app \ components \ search \ search.component.html (23,91):: ожидалось 0 аргументов, но получено 1. src \ app \ components \ search \ search.component.html (57,43):: свойство 'onFilterItemSelect 'является закрытым и доступен только внутри класса' SearchComponent '.src \ app \ components \ search \ search.component.html (90,58):: свойство 'e' не существует для типа 'SearchComponent'.

То же приложение успешно создается при запуске: npm run build --env = prod

Не могли бы вы дать мне знать, как меняется процесс сборки или конфигурации из-за этих двух команд?

Answer 1

Флаг --prod активирует множество флагов оптимизации.Один из них - --aot для компиляции Ahead Of Time.Шаблоны ваших компонентов компилируются во время сборки, поэтому TypeScript может обнаружить больше проблем в вашем коде.Вы можете скомпилировать в режиме разработки, но при этом активировать флаг --aot, если хотите увидеть эту ошибку перед сборкой для продукта.

Из официальной документации компилятора

Раннее обнаружение ошибок шаблона

Компилятор AOT обнаруживает и сообщает об ошибках привязки шаблона на этапе сборки, прежде чем пользователи смогут их увидеть.

Answer 2

Когда вы посмотрите на angular.json, вы увидите, что есть еще несколько опций, которые вы можете установить для флага npm run build --prod, но когда вы запускаете npm run build --env=prod, вы просто изменили файл environment.ts, чтобыздесь не будут использоваться опции.

Environment.ts

В папке environment вы можете найти два файла (по умолчанию), один используется для производства, а второйследует использовать локально.Запустив npm run build --env=prod, вы просто создаете свое приложение с environment.prod.ts, но по умолчанию ng build, а не ng build --prod.

В коде вы можете использовать среду для регистрации некоторых модулей только в производственной сборке, а не влокальная конфигурация.

Пример:

ServiceWorkerModule.register('/ngsw-worker.js', { enabled: environment.production }),

Answer 3

Как было написано выше, вам нужно изменить модификатор доступа private на public.У вас есть несколько файлов, где это необходимо.Тем не менее, вам нужно избегать проблем с функцией.

Я рекомендовал использовать tslint и проверить ваш код.Добавьте tslint.json новое правило

"rules": {
...
    "member-access": true,

и везде добавьте модификатор доступа.

Создайте команду в package.json, где вы можете проверить сборку

 "scripts": {
    "lint": "ng lint",
     ...
    "building:prod": "npm i && ng lint && ng build --prod"
  },

Answer 4

Когда вы запускаете компиляцию с ключом --prod, в Angular 6 по умолчанию используется AOT (компиляция раньше времени компонентов шаблона), и изменение заключается в том, что реквизиты из класса компонентов (файлы ts) используются в шаблоне (файл HTML или HTML).шаблон внутри компонента) должен быть общедоступным:

удалить приватное или защищенное от проверки, удалить приватное или защищенное от loadingMessage, ...

в файле компонентов.Привет! * * 1005