npx cms-create-site my-site O que gostaria de construir hoje?
DescobrirO que é o Vertex
Um site de conteúdo é um ficheiro de configuração. Todo o resto é problema do framework.
Vertex CMS é um framework Vue 3 construído sobre o vite-ssg. Você escreve JSON a descrever o que cada página contém; ele devolve um site estático pré-renderizado com encaminhamento, metadados, tema e imagens já resolvidos. Não há código de aplicação para escrever nem servidor para manter.
Páginas são dados, não código
Uma página é uma lista de componentes e o conteúdo de que esses componentes precisam. Acrescentar uma secção é acrescentar uma linha. Ninguém tem de abrir um ficheiro .vue para mudar um título, e editar conteúdo não pode quebrar a compilação.
O design é um manifesto de tokens
Um tema é um único objeto JavaScript de tokens de design — paleta, tipografia, superfícies, anéis de foco, elevação. O framework compila-o para propriedades personalizadas CSS, por isso redesenhar um site inteiro é um ficheiro, não uma auditoria de folhas de estilo.
Saída estática, SEO a sério
Cada rota é pré-renderizada no seu próprio HTML com URLs canónicos, alternativas hreflang, JSON-LD, etiquetas Open Graph, um sitemap e um robots.txt derivado das suas definições de rascunho. Publique a pasta em qualquer lugar que sirva ficheiros.
Início rápido
Do zero a um site publicável em quatro comandos.
O Vertex é distribuído como um único pacote npm mais um plugin do Vite. O gerador escreve um site funcional que pode compilar de imediato; a partir daí, edita JSON.
Gerar um site
Cria o diretório do site, um tema inicial e uma página inicial que já compila.
terminal npx cms-create-site my-site cd my-site npm installDescrever uma página
Chaves planas em notação de ponto com índices de array. O framework expande-as no objeto aninhado que os seus componentes leem ao renderizar.
site/content/en/pages/home.json { "components[0]": "Header", "components[1]": "Hero", "components[2]": "Footer", "content.hero.headline": "Welcome", "content.hero.subhead": "Built with Vertex CMS.", "content.hero.cta.text": "Get in touch", "content.hero.cta.href": "/contact", "path": "/" }Pré-visualizar
Servidor de desenvolvimento Vite com recarga a quente. As edições de conteúdo recarregam instantaneamente; as de imagens e tema também.
terminal npm run devCompilar o site estático
Pré-renderiza cada rota no seu próprio ficheiro HTML em dist/, gera variantes de imagem responsivas e escreve sitemap.xml, robots.txt, manifest.json e uma página 404.
terminal npm run build:ssg
É este o ciclo completo. Para o modelo de conteúdo integral, os tokens de tema e os destinos de publicação, leia a documentação →
O que está incluído
As peças de que todo o site de conteúdo precisa, já construídas.
Não são plugins que tenha de ir procurar. Estão no framework, ativos por omissão e configurados a partir do mesmo JSON que tudo o resto.
Encaminhamento pré-renderizado
As rotas derivam dos seus ficheiros de página. Cada uma é renderizada no seu próprio HTML em tempo de compilação — sem reescrita SPA, sem servir o invólucro da página inicial para URLs de conteúdo reais.
Conteúdo multilingue
Diretórios por idioma que se espelham. O idioma base carrega primeiro e cada idioma sobrepõe apenas as chaves que define, pelo que uma tradução parcial é uma tradução válida.
Imagens responsivas
Coloque um original em site/assets/img/. A compilação gera AVIF, WebP e JPEG em seis larguras, guarda-os em cache fora do seu repositório e serve-os através de um srcset dentro de <picture>.
Metadados de SEO
URLs canónicos, alternativas hreflang, cartões Open Graph e Twitter, JSON-LD, migalhas derivadas automaticamente, sitemap.xml, robots.txt e um manifesto de aplicação web — tudo gerado, nada mantido à mão.
Bloqueio de rascunhos
Proteja uma página, um prefixo de caminho ou o site inteiro com palavra-passe. As páginas bloqueadas são publicadas com noindex, ficam fora do sitemap e não renderizam corpo até serem desbloqueadas.
Temas e extensões
Os temas são manifestos de tokens. As extensões são pacotes de componentes validados. Ambos podem viver dentro do seu repositório ou ser publicados no npm e partilhados entre sites.
Componentes em três níveis
Os componentes locais do site sobrepõem-se aos das extensões, que se sobrepõem ao conjunto incluído. Ganha o mais específico, e os nomes qualificados pela origem desfazem ambiguidades quando colidem.
Um 404 a sério
O framework pré-renderiza /404.html com a identidade do seu próprio site, para que os URLs sem correspondência recebam uma página com marca que leva noindex, em vez de um corpo de resposta vazio.
Começar
Então — o que gostaria de construir hoje?
O Vertex CMS tem licença MIT e está publicado no npm. Gere um site, leia a documentação, ou leia o código-fonte.
npx cms-create-site my-site