# Preparar a produção

Faça o build do seu workspace WU, sirva a saída dist e verifique as microapps antes de publicá-las.

<span id="revisar-lo-que-vas-a-publicar"></span>

<span class="section-anchor" id="section-1"></span>

## Revisar o que você vai publicar

No desenvolvimento, você testou seu código-fonte. Agora vai gerar os arquivos que sua hospedagem entregará e verificar essas versões compiladas no navegador.

Continue na raiz `mi-plataforma/` de [Sua primeira microapp](/pt/docs/guides/quickstart/). Se concluiu [Adicionar uma segunda app](/pt/docs/guides/add-an-app/), também fará o build do Vue. Os mesmos comandos funcionam com uma ou duas apps.

<span id="1-construir-el-workspace"></span>

<span class="section-anchor" id="section-2"></span>

## 1. Fazer o build do workspace

Pare o servidor de desenvolvimento com **Ctrl+C** e execute:

```sh
wu build
```

Espere até que termine sem erros. O WU reúne o shell Astro e os builds das microapps na pasta **`dist/` da raiz do workspace**. Essa pasta reúne a saída completa; `shell/dist/` contém apenas o shell.

Com React e Vue, verifique se existem `dist/index.html` e uma pasta para cada microapp:

```text
dist/
├── index.html
├── apps.json
├── wu-manifest.json
├── assets/...
├── mf-mi-plataforma/
│   ├── wu.json
│   └── assets/...
└── mf-inspector/
    ├── wu.json
    └── assets/...
```

Se criou apenas React, não haverá uma pasta `mf-inspector/`. O build pode adicionar outros arquivos, incluindo os de política HTTP. Cada `wu.json` aponta para as entradas compiladas da sua app.

Se o comando falhar, resolva o primeiro erro antes de continuar. Uma pasta `dist/` de um build anterior pode continuar existindo; vê-la no disco não confirma que o último build terminou corretamente.

<span id="2-servir-la-salida-construida"></span>

<span class="section-anchor" id="section-3"></span>

## 2. Servir a saída compilada

Na mesma raiz, execute:

```sh
wu serve 4100
```

Deixe o terminal aberto e acesse [http://127.0.0.1:4100](http://127.0.0.1:4100). O número `4100` é a porta desta revisão. Se estiver ocupada, use outro número e abra a URL correspondente.

`wu serve` entrega os arquivos de `dist/`. **Se alterar o código-fonte, execute `wu build` novamente para incorporar essas alterações à revisão.**

<span id="3-comprobar-las-apps-en-producción"></span>

<span class="section-anchor" id="section-4"></span>

## 3. Verificar as apps em produção

1. Confira **Overview**, **Welcome to WU** e os nomes das apps que criou.
2. Abra **mi-plataforma** e verifique **React**, o nome da app e seu contador: **+** muda **0 → 1** e **−** volta a **0**.
3. Se adicionou Vue, abra **inspector** e repita a verificação do contador.
4. Volte a **Overview**, recarregue a página e abra as apps novamente.
5. Verifique se não há erros de carregamento de JavaScript ou respostas 404 nas ferramentas de desenvolvimento do navegador.

Isso verifica se o shell encontra as apps compiladas e se seus componentes funcionam. Se uma app funcionava no desenvolvimento, mas fica vazia aqui, revise os caminhos dos assets e seu manifesto; [Build para produção](/pt/docs/cli/build/) explica como inspecionar essa saída.

Ao terminar, pare o servidor com **Ctrl+C**.

<span id="publicar-y-seguir-aprendiendo"></span>

<span class="section-anchor" id="section-5"></span>

## Publicar e continuar aprendendo

O conteúdo reunido em `dist/` é o artefato a publicar na sua hospedagem. Antes disso, siga [Servir e implantar](/pt/docs/cli/serve/) para revisar rotas, estilos e cabeçalhos do ambiente em que será hospedado. A verificação na porta 4100 valida essa saída local; revise também a URL publicada após a implantação.

`wu doctor` fornece diagnóstico adicional. Suas verificações complementam as interações que você acabou de testar.

Para adicionar comportamento compartilhado a essas mesmas apps, continue com [Um contador entre React e Vue](/pt/docs/guides/shared-counter/). Depois, você pode adicionar [Uma soma entre aplicações](/pt/docs/guides/rpc-between-apps/), com cliente, provedor e permissões. Ambas as receitas incluem todos os arquivos e suas verificações de desenvolvimento e produção. [Como executar os exemplos](/pt/docs/guides/running-examples/) também reúne os laboratórios e os exemplos Node.