Развертывание хостов с угловым 6.0

Ответ 1

Я обнаружил, что ng build --prod создаст dist и другую подпапку под этим, где расположено местоположение проекта.

dist
|--TheProject_Folder
|  |--assets|index.html - This index html is not using.
|--index.html - This is the html generated in the firebase init

Так что я сделал, чтобы снова инициализировать firebase init и изменить dist/TheProject_Folder каталог с dist на dist/TheProject_Folder:

- What do you want to use as your public directory? dist/TheProject_Folder
- Configure as a single-page app (rewrite all urls to /index.html)? Yes
- Overwrite? No

Ответ 2

Ниже приведен пошаговый процесс для размещения приложения angular6.0 на firebase.

1] npm install -g firebase-tool Установить инструмент npm install -g firebase-tool

2] firebase login Используйте инструменты CLI для входа в Firebase.

После подключения к нашей учетной записи /Gmail-аккаунту мы получим сообщение FirelBase CLI Login Successful в браузере.

3] firebase init

Вот ответы на вопросы, которые зададут инструменты Firebase:

? Вы готовы продолжить? да
? Какие функции Firebase CLI вы хотите настроить для этой папки? Нажмите пробел, чтобы выбрать функции, затем нажмите Enter, чтобы подтвердить свой выбор. Хостинг: настройка и развертывание сайтов хостинга Firebase

? Что вы хотите использовать в качестве публичного каталога? dist (This is important! Angular creates the dist folder.)

? Настроить как одностраничное приложение (переписать все URL в /index. Html)? да

4] ng build --prod

Это создаст совершенно новую папку dist/в нашем проекте с файлами, необходимыми для запуска нашего приложения.

5] Перед развертыванием приложения, перейдите в файл firebase.json и укажите публичное поле вашего проекта следующим образом

"public": "dist/your_project_name",

6] Теперь разверните проект в firebase, используя команду ниже

развертывание пожарной базы

После удаления вы получите сообщение ниже

• Развертывание завершено!

Консоль проекта: https://************ [вы получите реальное имя URL, а не звездочки]

URL хостинга: https://************* [вы получите реальное имя URL, а не звездочки]

Вы можете получить доступ к веб-сайту по URL, указанному в URL хостинга

Ответ 3

это сработало у меня после того, как я удалил кеш и обновил браузер, спасибо.

Ответ 4

Второй возможный способ - просто изменить outputPath в angular.json на dist, поэтому строка будет выглядеть так: "outputhPath": "dist"

Ответ 5

@bajran, возможно, подробно описал все шаги, но если вы переходите с углового значения 5 на 6, единственный важный шаг - это изменить "public": "dist", на "public": "dist/your_project_name", в firebase. JSON

Ответ 6

Есть еще одна проблема, которая может привести к этой же самой странице. Когда мы начинаем проект с помощью

firebase init

и, следуя процедуре, по умолчанию перезаписывает файл index.html. Таким образом, если файл уже собран (для получения dist/_Project_Folder), файл index.html будет перезаписан. Построил его снова после

firebase init 
ng build --prod

Ответ 7

Проблема в том, что на вопрос

Файл dist/apps/ditectrev/index.html уже существует. Переписать?

Если вы введете Y для Да, тогда он создаст свой собственный файл index.html, сгенерированный Firebase. Предоставив это N для Нет, я смог сохранить свой оригинальный index.html, который был сгенерирован после использования ng build --prod в dist/apps/ditectrev. Примечание: я использую рабочее пространство Nx, но то же самое должно применяться к другим проектам Angular. В обычном случае проекта Angular это будет другой путь, который будет просто dist.

Ответ 8

Мои действия по развертыванию Angular 7.2.15 в Firebase:

1. Запустите firebase init

   • Вы готовы продолжить? да
   • Какие функции Firebase CLI вы хотите настроить для этой папки? Нажмите пробел, чтобы выбрать функции, затем нажмите Enter, чтобы подтвердить свой выбор. Хостинг: настройка и развертывание сайтов хостинга Firebase
   • Что вы хотите использовать в качестве публичного каталога? расстояние
   • Настроить как одностраничное приложение (переписать все URL в /index.html)? да
   • Файл dist/index.html уже существует. Переписать? Нет Пропуск записи dist/index.html

2. Затем:

   нг сборка --prod

После этого проект имеет следующую структуру:

-.firebase
-dist
 - myapp
-node_modules
-myapp
  - dist
    -myapp
-public
-.firebaserc
-.gitignore
-.firebase.jsom
-package-lock.json 

2. Затем вы должны скопировать ВСЕ ФАЙЛЫ из myapp/dist/myapp в dist/myapp.

3. Затем запустите firebase deploy

Ответ 9

Если у вас нет одностраничного приложения (как у меня), когда Firebase спросит

File dist/apps/ditectrev/index.html already exists. Overwrite?

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

Ответ 10

Это сработало, когда я очистил кеш с помощью ctrl+shift+R аппаратного сброса в сети! Убедитесь, что правильный файл index.html развертывается на базе Firebase.