Site básico
Nesta página
O site sitelo útil mais pequeno: uma página, uma folha de estilos e configurações de alojamento que publicam dist/. Copia as configurações para qualquer projeto sitelo — só assumem npm run build → dist/.
Há uma cópia executável no repositório do sitelo, em examples/basic/.
O que obténs
- Um site estático de uma página construído com o sitelo
netlify.toml,vercel.json,wrangler.tomleamplify.yml- Implementação num clique ou ligando o repositório a partir da pasta do exemplo
Estrutura do projeto
my-site/
sitelo.config.js
netlify.toml # Netlify
vercel.json # Vercel
wrangler.toml # Cloudflare Pages
amplify.yml # AWS Amplify
package.json
src/
index.ht.js
css/
styles.cssexport default () => `
<html lang="pt">
<head>
<title>sitelo — exemplo básico</title>
<link rel="stylesheet" href="/css/styles.css">
</head>
<body>
<h1>Olá do sitelo</h1>
</body>
</html>
`import { html, head, title, link, body, h1 } from 'javascript-to-html'
export default () =>
html({ lang: 'pt' },
head(
title('sitelo — exemplo básico'),
link({ rel: 'stylesheet', href: '/styles.css' }),
),
body(h1('Olá do sitelo')),
)export default function Home() {
return (
<html lang="pt">
<head>
<title>sitelo — exemplo básico</title>
<link rel="stylesheet" href="/css/styles.css" />
</head>
<body>
<h1>Olá do sitelo</h1>
</body>
</html>
)
}Compilação
npm install
npm run buildImplementação
A partir do monorepo do sitelo, define o diretório raiz ou base da plataforma como examples/basic.
Netlify
[build]
command = "npm run build"
publish = "dist"Vercel
{
"$schema": "https://openapi.vercel.sh/vercel.json",
"framework": null,
"buildCommand": "npm run build",
"outputDirectory": "dist",
"installCommand": "npm install"
}Implementar no Vercel · Implementar no Netlify (define o diretório base como examples/basic quando for pedido).
Cloudflare Pages
Painel: comando de compilação npm run build, diretório de saída dist. Ou npx wrangler pages deploy dist depois de uma compilação local.
name = "sitelo-basic"
compatibility_date = "2025-01-01"
pages_build_output_dir = "dist"AWS Amplify
Liga o repositório no Amplify Hosting. Para S3 + CloudFront simples, compila localmente e sincroniza dist/ com o bucket.
version: 1
frontend:
phases:
preBuild:
commands:
- npm install
build:
commands:
- npm run build
artifacts:
baseDirectory: dist
files:
- '**/*'
cache:
paths:
- node_modules/**/*Trabalhas com o Cursor, o Copilot ou outro agente? Copia o AGENTS.md deste exemplo (ou vê Criar com IA) para que as ferramentas não inventem padrões de React/Next.
Primeiros passos · Criar com IA · App de tarefas · Exemplo de ilhas de servidor