manifest.json

在 app 目录的根目录下添加或生成一个符合 Web Manifest 规范的 manifest.(json|webmanifest) 文件，为浏览器提供有关你的 Web 应用程序的信息。

静态 Manifest 文件

app/manifest.json

{
  "name": "我的 Next.js 应用",
  "short_name": "Next.js 应用",
  "description": "使用 Next.js 构建的应用程序",
  "start_url": "/"
  // ...
}

生成 Manifest 文件

添加一个返回 Manifest 对象的 manifest.js 或 manifest.ts 文件。

值得注意的是：manifest.js 是一种特殊的路由处理程序，默认情况下会被缓存，除非它使用了动态函数或动态配置选项。

app/manifest.ts

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

app/manifest.js

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

Manifest 对象

Manifest 对象包含一个广泛的选项列表，这些选项可能会因新的 Web 标准而更新。有关所有当前选项的信息，如果使用 TypeScript，请参考代码编辑器中的 MetadataRoute.Manifest 类型，或查看 MDN 文档。