react manifest

Last updated on November 20, 2024 am

🧙 Questions

manifest 是留给浏览器做网站基础信息识别用的,像不同设别的icon显示,safari的浏览器创建应用时的图标以及名称显示。

☄️ Ideas

引入manifest
<!DOCTYPE html>
<html lang='en'>

  <head>
    <link rel='manifest' href='/assert/manifest.json' />
  </head>

  <body>
    <div id='root'></div>
  </body>

</html>
配置manifest
vim leo-react/public/assert/manifest.json
{
  "background_color": "white", // 背景色
  "categories": ["life","生活"], // 分类
  "description": "nice life", // 网站描述
  "display_override": ["fullscreen", "minimal-ui"],
  "display": "standalone", // 默认展示方式
  "name": "leo", // 应用名称
   "short_name": "leo",
  "icons": [ // 默认icon
    {
      "src": "/assert/favicon.png",
      "sizes": "64x64",
      "type": "image/png"
    }
  ],
  "start_url": "https://leo.isxcode.com/", // 进入访问页面,要和正式访问地址保持一直。如果访问本地localhost:2222会warning
  "theme_color": "white"
}

react manifest
https://ispong.isxcode.com/vue/react/react manifest/
Author
ispong
Posted on
October 17, 2022
Licensed under