离子3发布应用程序作为PWA(Progressive Web App)

Question

我想发布我的应用程序作为PWA,所以我做的是

将此脚本插入index.html

<!--script>
    if ('serviceWorker' in navigator) {
      navigator.serviceWorker.register('service-worker.js')
        .then(() => console.log('service worker installed'))
        .catch(err => console.log('Error', err));
    }
</script-->

然后安装

npm run ionic:build --prod 

看起来它部署它但我的问题是:

1. 我需要将哪些文件上传到主机以将应用程序发布为PWA？

2. 为什么当我在应用程序中更改某些内容并运行离子服务时没有任何更改,它只在WWW文件夹的index.html中更改？为什么？(因为现在是PWA？)

3. 当我打开www文件夹并运行打开index.html时,我按下打开警告对话框的按钮它不会打开它.为什么？

4. 当我运行命令？只是在发展的最后？

Answer 1

跑

ionic cordova platform add browser

ionic build browser --prod --release

然后转到[project_folder]/platforms/browser/www并复制http服务器上的内容.

Answer 2

请勿使用Cordova打扰PWA.只需使用npm run build --prod并上传/www文件夹即可.

PWA更多的是概念集合,因此它不仅仅是"开启"或"关闭".至少你可能想要添加一个清单文件,这样你就可以通过隐藏浏览器框架,设置你的图标,应用程序名称等来使它更像"app like".取消注释添加服务工作者的行并不会让它变得神奇PWA,如果您没有向服务工作者提供任何"有用"(您可能需要或可能不需要这样做,具体取决于您的应用程序的工作方式).另请注意,您需要使用HTTPS才能使用服务工作者.

您还需要手动删除index.html中包含cordova.js的行(如果您只是上传/ www,则会出现404错误).