Pular para o conteúdo
Navegar na documentação
Nesta página

Assets

CSS

Core/Assets/main.css é a entrada nativa e somente leitura do Tailwind. O build sempre a compila, calcula os dez primeiros caracteres do SHA-256 e grava:

dist/assets/main.<hash>.css

O caminho relativo assets/main.<hash>.css é entregue às views como $cssAsset. Entradas CSS adicionais são resolvidas pelo manifesto compartilhado $assets; por exemplo, {{ $assets->path('css/admin.css') }} resolve para o arquivo hasheado correspondente. No servidor dev, os watchers escrevem o CSS nativo em public/assets/main.css e cada CSS do usuário em public/assets/css/, sem hash.

Arquivos em Content/assets/js/ são publicados com hash e resolvidos pelo mesmo manifest. Arquivos em Content/public/ são copiados recursivamente para o mesmo caminho relativo em dist/, sem processamento.

Cada entrada CSS é compilada separadamente pelo Tailwind. A entrada nativa inclui Content/Views/**/*.blade.php e Content/Pages/**/*.blade.php; classes presentes em MDX não são descobertas automaticamente e exigem um @source explícito na entrada que as utiliza. O CSS é compilado antes da geração das views MDX.

O build valida node_modules/.bin/tailwindcss antes de limpar dist/ ou renderizar páginas. O executável deve ser fornecido por @tailwindcss/cli ^4.0.0; se estiver ausente ou sem permissão de execução, o diagnóstico informa o caminho, a versão esperada e sugere npm ci (ou npm install). Em CI e na imagem builder, mantenha o node_modules ou o cache do npm persistente para evitar reinstalações a cada build.

Convenção de diretórios

Core/Assets/main.css é a entrada nativa da engine. Todos os CSS dentro de Content/assets/css/ são entradas independentes do usuário; app.css não tem tratamento privilegiado e pode inclusive não existir. JavaScript deve ficar em Content/assets/js/ e recebe hash de conteúdo. Todo arquivo que precise ser copiado sem processamento deve ficar em Content/public/; sua estrutura relativa é preservada em dist/.

Esses diretórios são a configuração: não há lista de assets obrigatória no config.yaml. Content/assets/css/main.css é reservado e faz o build falhar. O nome Content/assets/css/mermaid.css é reservado para customizações visuais do Mermaid; quando existe, ele é carregado automaticamente depois do CSS principal nos layouts. Outras colisões entre saídas geradas e arquivos literais também são rejeitadas.

.mermaid-diagram .node rect {
    fill: #f5f3ff !important;
}

.mermaid-diagram .edgePath .path {
    stroke: #6d28d9 !important;
}

Fontes materializadas

site.fonts.families declara famílias sem expor URLs internas do provedor. provider: google monta a URL do Google Fonts a partir de family, weights, styles e display; provider: local lê somente WOFF2 explicitamente declarados em Content/assets/fonts/. O pipeline comum valida, deduplica por conteúdo, gera @font-face, calcula hashes e reescreve tudo para assets locais. Produção gera assets/fonts.<hash>.css e assets/fonts/<hash>.woff2; dev usa public/assets/fonts.css.

O formato antigo site.fonts.google.stylesheets continua aceito para migração. Ele deve conter URLs HTTPS completas, uma família por link, e não pode ser combinado com site.fonts.families. Nenhum formato aceita provedores remotos arbitrários, TTF/OTF ou descoberta automática.

O cache fica em storage/framework/fonts/ e é reutilizado sem rede. A lista ordenada de URLs é sua chave: mudar famílias, pesos, opções ou ordem cria outro cache. --refresh-fonts força a substituição atômica mantendo o cache anterior se o download falhar. Apenas HTTPS em fonts.googleapis.com e fonts.gstatic.com é aceito; sem configuração, nenhum asset ou tag de fonte é emitido.

Reveal.js

feature.revealjs publica os assets locais usados pelas páginas MDX com type: presentation. O recurso é opt-in e desligado por padrão. A engine registra os nomes lógicos js/reveal.js e css/reveal.css; use o manifesto em layouts ou componentes, sem copiar hashes:

@if ($assets->has('css/reveal.css'))
    <link rel="stylesheet" href="{{ $siteUrl->asset($assets->path('css/reveal.css')) }}">
@endif

No build, os arquivos são publicados como dist/assets/reveal/reveal.<hash>.mjs e dist/assets/reveal/reveal.<hash>.css. No dev, os nomes são public/assets/reveal/reveal.mjs e public/assets/reveal/reveal.css. Os helpers de asset preservam site.basePath.

Para ver como esses nomes são usados no layout e como personalizar o CSS e o runtime sem fixar hashes, consulte Criar e personalizar apresentações.

Pagefind

feature.pagefind publica uma busca estática depois da geração do HTML. O Pagefind lê as páginas finais, cria os fragmentos WASM/JSON e grava toda a publicação em:

dist/pagefind/

O layout normal carrega pagefind-component-ui.css e pagefind-component-ui.js e exibe um modal acionado por mod+k. O conteúdo indexável fica marcado com data-pagefind-body; a navegação e o modal ficam fora dessa área. O recurso é desligado por padrão, não usa CDN e respeita site.basePath nas URLs públicas. Consulte Saída gerada para a posição do estágio e a estrutura publicada. A customização visual deve ser feita no CSS do site, normalmente Content/assets/css/app.css, usando os tokens --pf-*; o guia Gerenciar assets documenta os tokens, seletores de exceção, ordem das folhas e cuidados de acessibilidade.

Remix Icon

feature.remixicon publica a webfont oficial do Remix Icon como assets locais, sem CDN. O recurso é opt-in e desligado por padrão.

Quando ligado, o estágio remix-icon lê node_modules/remixicon/fonts/remixicon.css, valida cada url(...) como uma referência local ao diretório do pacote, calcula hash de conteúdo para cada fonte e registra a entrada lógica css/remixicon.css no manifesto. Fragments como #remixicon são preservados; query strings de cache são removidas. Produção gera:

dist/assets/remixicon/remixicon.<hash>.css
dist/assets/remixicon/fonts/remixicon.<hash>.{woff2,woff,ttf,eot,svg}

dev usa o nome estável public/assets/remixicon/remixicon.css, com fontes hashadas no mesmo namespace. A publicação é preparada em diretório temporário e ativada atomicamente. Sites desativados removem somente o namespace gerenciado e não publicam nenhum <link> adicional. A ausência do pacote remixicon em node_modules/, do arquivo remixicon.css ou de qualquer fonte referenciada aborta o build com um erro que nomeia o caminho esperado e sugere npm ci.

Use as classes ri-* diretamente em Blade ou HTML:

<i class="ri-home-line" aria-hidden="true"></i>
<i class="ri-github-fill" aria-hidden="true"></i>

A convenção oficial é ri-{nome}-{estilo}, com as variantes -line e -fill. Classes de dimensionamento como ri-2x e ri-fw são preservadas. Classes que aparecerem somente em MDX não são descobertas automaticamente pelo Tailwind; use @source na entrada CSS correspondente quando necessário. O Remix Icon é distribuído sob a licença Remix Icon v1.0; a licença permite uso e redistribuição e recomenda mencionar o projeto, sem tornar isso obrigatório.

Favicons

Estes arquivos são obrigatórios:

Content/assets/favicon.ico
Content/assets/icon.svg
Content/assets/apple-touch-icon.png

Todos são copiados para a raiz de dist/. Se um ou mais estiverem ausentes, o estágio lista os ausentes, não copia nenhum e falha.

Colisões

Antes de limpar dist/, a engine registra as saídas de páginas, assets, public/, sitemap, robots, llms e capas. Se dois produtores reivindicarem o mesmo caminho, o build falha informando o caminho e os dois produtores.