> ## Knowledge Base Index
> Fetch the complete knowledge base index at: https://help.squarecloud.app/sitemap.xml
> Use this file to discover available pages before exploring further.
> Pure-Markdown content can be obtained by appending a '.md' suffix to the content URLs listed in the sitemap (without the trailing slash).

# Como hospedar uma aplicação Angular

# Como hospedar aplicações Angular na Square Cloud

Diferente de um bot de Discord, o Angular não "roda" por si só; ele precisa de um servidor web para entregar os arquivos ao navegador do usuário. Na Square Cloud, a estratégia mais eficiente é compilar o projeto e serví-lo usando a biblioteca **serve**.

---

## 1. O Passo Fundamental: Build de Produção

O primeiro passo é transformar seu código TypeScript e componentes em arquivos que qualquer navegador entenda. Execute o comando de build na sua máquina local:

```bash
ng build --configuration production
```

Isso criará uma pasta chamada **`dist/`** na raiz do seu projeto. Dentro dela, haverá outra pasta com o nome do seu projeto contendo o `index.html` e os bundles de JavaScript.

---

## 2. Preparando o Servidor Web

Para que a Square Cloud saiba como entregar esses arquivos, utilizaremos a biblioteca **`serve`**, que é leve e ideal para SPAs.

### Adicionando a dependência
No seu arquivo `package.json`, adicione o `serve` às suas dependências:

```json
"dependencies": {
  "serve": "^14.0.0"
}
```

---

## 3. Configurando a Porta e o Comando de Início

A Square Cloud disponibiliza a **porta 80** para sua aplicação utilizar e receber requisições.  O `serve` facilita isso com parâmetros simples.

### O Comando de Start
Seu comando de inicialização (definido no Dashboard ou no arquivo de configuração) deve ser:

```bash
npx serve -s dist -p 80
```

*   **`-s` (Single Page Application):** Redireciona todas as rotas para o `index.html`. Isso é vital para que o roteamento do Angular (ex: `/dashboard`, `/login`) funcione sem dar erro 404 ao atualizar a página.
*   **`dist`:** O caminho exato onde seus arquivos compilados estão.
*   **`-p 80`:** Define a porta obrigatória da Square Cloud.

---

## 4. O que enviar no ZIP?

Para um deploy limpo, seu arquivo `.zip` deve conter:
1.  A pasta **`dist/`** completa.
2.  O arquivo **`package.json`**.

**Nota:** Não envie a pasta `node_modules` nem a pasta `src`. O servidor só precisa dos arquivos compilados e das instruções de instalação.

---

## 5. Dicas para Rotas e Performance

*   **Roteamento:** O parâmetro `-s` no comando do `serve` é o que garante que o roteamento do Angular não quebre. Sem ele, se o usuário acessar uma URL interna diretamente, o servidor tentará achar um arquivo físico que não existe.
*   **Variáveis de Ambiente:** Se sua aplicação Angular consome uma API, lembre-se de configurar as URLs nos arquivos `environment.prod.ts` antes de buildar, ou use soluções de injeção de variáveis em tempo de execução.