manifest.json

Core Idea

Arquivo manifest.(json|webmanifest) (ou gerado via manifest.js|ts) na raiz de app que segue a Web Manifest Specification, fornecendo informações do web app para o browser (PWA).

Key Concepts

• Manifest estático: arquivo app/manifest.json ou app/manifest.webmanifest com JSON direto.
• Manifest gerado: app/manifest.ts exportando default uma função que retorna um objeto MetadataRoute.Manifest.
• Como Route Handler especial, manifest.js é cacheado por padrão a menos que use uma Request-time API ou dynamic config.

Code Examples

import type { MetadataRoute } from 'next'

export default function manifest(): MetadataRoute.Manifest {
  return {
    name: 'Next.js App',
    short_name: 'Next.js App',
    description: 'Next.js App',
    start_url: '/',
    display: 'standalone',
    background_color: '#fff',
    theme_color: '#fff',
    icons: [
      {
        src: '/favicon.ico',
        sizes: 'any',
        type: 'image/x-icon',
      },
    ],
  }
}

• O que demonstra: manifest gerado por código, tipado com MetadataRoute.Manifest.

Key Takeaways

1. Prefira manifest.ts a manifest.json quando precisar de valores dinâmicos ou tipagem via MetadataRoute.Manifest.
2. Consulte o tipo MetadataRoute.Manifest no editor (TypeScript) ou a doc do MDN para a lista completa de campos suportados.
3. O arquivo precisa estar na raiz de app.

Connects To

• favicon, icon, and apple-icon: os ícones referenciados no manifest costumam ser gerados/definidos por essa convenção.
• Metadata Files: página-índice desta e das demais convenções.