在线生成Web应用清单文件 - 可视化配置manifest.json
PWA Manifest(Web应用清单)是一个JSON文件,定义了渐进式Web应用的名称、图标、启动URL、显示模式等信息。它让Web应用可以像原生应用一样安装到设备主屏幕。
核心字段包括:name(应用名称)、short_name(短名称)、start_url(启动URL)、display(显示模式)、icons(图标数组)、background_color和theme_color(颜色)。可选字段包括description、orientation、scope等。
四种模式:standalone(独立应用,无浏览器UI)、fullscreen(全屏,无任何UI)、minimal-ui(有基本导航按钮)、browser(普通浏览器标签页)。推荐使用standalone获得最佳PWA体验。
需要提供多种尺寸的图标:至少192x192和512x512(Android必须),推荐还包括72x72、96x96、144x144、384x384。图标应为PNG格式,512x512的图标用于启动画面。
使用Chrome DevTools的Application面板查看Manifest信息。检查:1)JSON格式正确;2)图标文件可访问;3)start_url有效;4)搭配Service Worker实现离线功能。Lighthouse审计也会检查Manifest配置。
PWA Manifest(Web应用清单)是一个JSON文件,定义了渐进式Web应用的名称、图标、启动URL、显示模式等信息。它让Web应用可以像原生应用一样安装到设备主屏幕。
核心字段包括:name(应用名称)、short_name(短名称)、start_url(启动URL)、display(显示模式)、icons(图标数组)、background_color和theme_color(颜色)。可选字段包括description、orientation、scope等。
四种模式:standalone(独立应用,无浏览器UI)、fullscreen(全屏,无任何UI)、minimal-ui(有基本导航按钮)、browser(普通浏览器标签页)。推荐使用standalone获得最佳PWA体验。
需要提供多种尺寸的图标:至少192x192和512x512(Android必须),推荐还包括72x72、96x96、144x144、384x384。图标应为PNG格式,512x512的图标用于启动画面。
使用Chrome DevTools的Application面板查看Manifest信息。检查:1)JSON格式正确;2)图标文件可访问;3)start_url有效;4)搭配Service Worker实现离线功能。Lighthouse审计也会检查Manifest配置。