Publique seu
projeto Vue
Envie a saída estática de Vue, Vite, Vue CLI ou Nuxt e publique com fallback para history mode, HTTPS, entrega global e domínios personalizados quando precisar.
base: './',
Saiba qual pasta Vue enviar
A maioria dos problemas de publicação Vue começa antes da hospedagem: pasta de saída errada, base path errado ou build não pré-visualizado localmente.
Vite + Vue
O Vite coloca o build de produção em dist por padrão. Se sua configuração muda build.outDir ou base, envie a pasta de saída correta e teste URLs de assets.
Vue CLI
Builds estáticos do Vue CLI normalmente saem em dist. Se o app roda em subcaminho, publicPath precisa combinar com a estrutura final da URL.
Saída estática Nuxt
Nuxt pode gerar saída estática, mas rotas renderizadas no servidor e APIs de servidor precisam de runtime. Envie apenas os arquivos públicos estáticos gerados neste fluxo.
O que o history mode do Vue Router precisa
URLs limpas valem a pena
Rotas com hash funcionam em quase qualquer lugar, mas URLs com # parecem improviso e são ruins para compartilhar, medir e dar acabamento ao produto.
O history mode do Vue Router dá caminhos limpos como /about ou /dashboard/settings. A troca é que o host precisa saber servir index.html para rotas que não existem como arquivos.
Como o DeployPages trata history mode
Quando uma requisição não bate em um arquivo estático, o DeployPages serve o index.html raiz e deixa o Vue Router resolver a tela final no navegador.
- Acessos diretos a rotas aninhadas não falham de imediato.
- O documento raiz é retornado como resposta de fallback.
- O Vue monta, lê a URL atual e renderiza a rota correta.
Checagens antes de publicar Vue
Um app Vue pode funcionar em dev e ainda falhar depois do envio. Estas checagens pegam falhas comuns antes do link sair.
Base path
No Vite, confirme base. No Vue CLI, confirme publicPath. Valores errados aparecem como CSS, JS, fontes ou imagens faltando.
Fallback de history
Abra uma rota aninhada diretamente e atualize. Se a página continuar viva, o fallback está fazendo seu trabalho.
Saída apenas estática
O DeployPages serve arquivos estáticos. API routes, middleware de servidor e comportamento só de SSR precisam de backend ou runtime separado.
Prévia local
Use um servidor local para pré-visualizar o build de produção. Abrir dist/index.html com file:// pode esconder ou criar problemas que não batem com a publicação.
Fluxo de publicação Vue
Gere arquivos estáticos
Rode o build de produção em Vite, Vue CLI ou modo estático do Nuxt para emitir o app como arquivos que o navegador carrega diretamente.
Encontre a pasta de saída
A maioria dos projetos Vue e Vite sai em dist. Projetos Nuxt estáticos normalmente publicam .output/public ou um dist gerado, dependendo da configuração.
Builds estáticos do Nuxt normalmente enviam .output/public ou dist, dependendo da configuração do projeto.
Envie e valide links
Envie a pasta de saída inteira e verifique links profundos, navegação do roteador e caminhos de assets depois que o site estiver no ar.
Problemas comuns em publicação Vue
Atualizar uma rota aninhada retorna 404
O Vue Router está em history mode, mas o host procura um arquivo para aquela rota. Use fallback de SPA para rotas de documento desconhecidas retornarem index.html.
Arquivos CSS ou JS retornam 404
Confira Vite base ou Vue CLI publicPath. Também confirme que você enviou a pasta dist completa, incluindo assets gerados.
O app funciona em hash mode, mas não em history mode
Hash mode mantém o roteamento depois de # no navegador. History mode usa URLs limpas e precisa de fallback do servidor para acessos diretos.
A saída Nuxt perdeu comportamento de servidor
Saída estática do Nuxt pode ser hospedada como arquivos. Rotas de servidor, middleware de servidor e comportamento só de SSR exigem runtime com servidor.
FAQ de publicação Vue
Por que CSS e JS retornam 404?
Normalmente os caminhos de assets foram gerados para uma base diferente, ou o diretório de assets não foi enviado. No Vite, revise base. No Vue CLI, revise publicPath.
Isso suporta Nuxt?
Sim para saída estática. Gere o site estático primeiro e envie a pasta pública gerada. O DeployPages não é o destino certo para renderização de servidor ou API routes do Nuxt.
Devo usar hash mode ou history mode?
Use history mode quando quiser URLs limpas e o host suportar fallback para index.html. Hash mode é mais simples de hospedar, mas deixa # em cada rota de cliente.
Devo enviar o projeto fonte Vue?
Não. Envie a pasta de produção, geralmente dist. O projeto fonte contém arquivos de desenvolvimento e dependências que não foram feitos para serem servidos diretamente.
O estado do Pinia ou Vuex sobrevive a refresh?
Não automaticamente. Um refresh do navegador reseta estado em memória. Persista estado importante com localStorage ou seu plugin de persistência preferido.
Posso restaurar para uma versão anterior?
Sim. O DeployPages mantém histórico de publicações para você voltar a um build estático anterior quando precisar.