[TOC] 由于Ionic Apps是使用Web技术构建的，因此它们可以像原生应用程序一样运行渐进式Web应用程序。不确定哪些PWA？查看Ionic的[PWA概述](https://ionicframework.com/pwa)了解更多信息。 ## 使应用程序成为PWA PWA的两个主要要求是[服务工作者](https://developers.google.com/web/fundamentals/primers/service-workers/)和[Web清单](https://developers.google.com/web/fundamentals/web-app-manifest/)。虽然可以手动将这两者添加到应用程序中，但Angular团队有一个`@angular/pwa`可用于自动执行此操作的程序包。 该`@angular/pwa`软件包将自动向应用程序添加服务工作者和应用程序清单。要将此包添加到应用程序运行： ~~~ $ ng add @ angular / pwa ~~~ 添加此包后，运行`ionic build --prod`该`www`目录即可作为PWA进行部署。 > 默认情况下，该`@angular/pwa`软件包附带了应用程序图标的Angular徽标。请务必更新清单以使用正确的应用名称，并替换图标。 如果将应用程序部署到其他渠道（如Cordova或Electron），则可以`"serviceWorker": true`从`angular.json`文件中删除该标志。可以通过运行生成服务工作者： ~~~ $ ionic build --prod --service-worker ~~~ > 注意：Service Worker和许多JavaScript API（例如地理定位）等功能要求将应用程序托管在安全的上下文中。通过托管服务部署应用程序时，请注意它们将需要HTTPS来充分利用服务工作者。 ## 部署 ### Firebase Firebase托管为Progressive Web Apps提供了许多好处，包括CDN的快速响应时间，默认启用HTTPS以及支持[HTTP2推送](https://firebase.googleblog.com/2016/09/http2-comes-to-firebase-hosting.html)。 首先，安装Firebase CLI： ~~~ $ npm install -g firebase-tools ~~~ 安装Firebase CLI后`firebase init`，在项目中运行。这将设置生成`firebase.json`配置文件并配置应用程序以进行部署。 > `firebase init`将提出一些问题，包括一个关于重定向URL的问题`/index.html`。确保为此选项选择“**是**”，但**不**覆盖index.html。这将确保应用程序中的路由，硬重新加载和深度链接工作。 最后需要的是确保正确设置缓存标头。为此，请将以下代码段添加`firebase.json`到托管属性的文件中： ~~~ "headers": [ { "source": "/build/app/**", "headers": [ { "key": "Cache-Control", "value": "public, max-age=31536000" } ] }, { "source": "sw.js", "headers": [ { "key": "Cache-Control", "value": "no-cache" } ] } ] ~~~ 有关这些`firebase.json`属性的更多信息，请参阅[Firebase文档](https://firebase.google.com/docs/hosting/full-config#section-firebase-json)。 现在可以通过运行来部署该应用程序 ~~~ $ firebase deploy ~~~ 完成后，该应用程序将生效。