Nuxt 3 Release Candidate beta já está disponível! Descobre mais sobre isso v3.nuxtjs.org

Translated page Contents of this page might be outdated.

O diretório static

O diretório static é diretamente mapeado para a raiz do servidor () e contém ficheiros que raramente serão mudados. Todos ficheiros incluídos serão automaticamente servidos pelo Nuxt e estão acessíveis através da URL raiz do seu projeto.


/static/robots.txt estará disponível em http://localhost:3000/robots.txt

/static/favicon.ico estará disponível em http://localhost:3000/favicon.ico

Esta opção é útil para ficheiros como robots.txt, sitemap.xml ou CNAME (o qual é importante para o processo de deploy no GitHub Pages).

Este diretório não pode ser renomeado sem configuração extra.

Os recursos estáticos

Se você não quiser usar os recursos do Webpack do diretório assets, você pode adicionar imagens ao diretório static.

Dentro do seu código, você pode então referenciar esses ficheiros relativamente a raiz (/):

<!-- Imagem estática do diretório static -->
<img src="/my-image.png" />

<!-- imagem empacotada pelo webpack do diretório assets -->
<img src="~/assets/my-image-2.png" />
O Nuxt não muda este caminho, assim se você personalizar a sua router.base então você precisará fazer questão de adicionar ele manualmente aos seus caminhos. Por exemplo:
<img :src="`${yourPrefix}/my-image.png`" />

A configuração do diretório static

Se você precisar você pode configurar o comportamento do diretório static/ dentro do ficheiro nuxt.config.js.

O prefixo do recurso estático

Se você desdobrar o Nuxt para uma sub-pasta, exemplo /blog/, a base do router será adicionada ao caminho do recurso estático por padrão. Se você quiser desativar este comportamento, você pode definir static.prefix para false dentro do nuxt.config.js.

export default {
  static: {
    prefix: false
  }
}

Padrão: /blog/my-image.png

Com o static.prefix desativado: /my-image.png

Edit this page on GitHub Updated at Tue, Aug 16, 2022