Article image
Stephanie Campelo
Stephanie Campelo27/04/2023 17:34
Compartilhe

Angular: deploy com GitHub Pages

  • #GitHub
  • #TypeScript
  • #Angular

Para realizar o deploy do seu projeto Angular com GitHub Pages execute os seguintes passos:

1.Instale o angular-cli-ghpages:

npm i -g angular-cli-ghpages

Depois, execute o comando:

ng build --configuration production --base-href="./[your-repo-name]" 
angular-cli-ghpages --dir=dist/[your-project-name]

💡 ./[your-repo-name] - seu repositório no GitHub.

Sendo assim, caso o seu projeto esteja em https://github.com/myname/dio-angular, o valor serĂĄ --base-href="./dio-angular" .

2.ApĂłs, serĂĄ criado no seu repositĂłrio uma segunda branch “gh-pages”, Ă© a partir dessa branch que serĂĄ feito o deploy.

3.VĂĄ as configuraçÔes do seu repositĂłrio no GitHub → Pages

  • Em Source, mude para “Deploy from a branch”;
  • E entĂŁo selecione a branch criada “gh-pages” e /root

4.Por fim, salve e aguarde o deploy.

  • VocĂȘ pode ver o deploy sendo realizado na aba “Actions”
  • Se tudo ocorre bem, todas as tarefas aparecerĂŁo em verde, se ocorrer algum erro a tarefa ficarĂĄ em vermelho.

5.ParabĂ©ns, seu projeto estĂĄ ativo com GitHub Pages! 🎉

Compartilhe
ComentĂĄrios (4)
Davi Barcelos
Davi Barcelos - 27/04/2023 17:37

A DIO precisa implementar urgentemente uma funcionalidade de salvar artigos kkkk vou pegar o link e deixar guardadinho no meu whatsapp... Muito obrigado Stephanie !

Lilian Hakutake
Lilian Hakutake - 02/06/2023 15:52

Obrigada por compartilhar!! Me Ajudou muito <3

Felipe Assis
Felipe Assis - 06/05/2023 01:57

Muito bom, estava com essa dĂșvida e acabei achando seu artigo antes mesmo de pesquisar sobre na documentação.

FelipĂŁo DIO
FelipĂŁo DIO - 28/04/2023 11:35

ParabĂ©ns pelo conteĂșdo Stephanie, verei como adicionar na formação oficial de Angular, e citar vocĂȘ e o seu artigo 😉