PWAPWA相关文章,个人也是在18年在微信公众号上看到PWA的相关信息,个人觉得是Amazing Idea----一种跨域BS和CS模式的应用。 添加PWA支持目前仅仅是学习阶段,尝试将一个现有的开发项目改造成PWA support。 项目使用的是尤雨溪的Vue.js配合@vue/cli3.0快速开发。 在@vue/cli的GitHub上,package目录下有很多具体的可添加模块 使用方法:命令行 vue add @vue/pwa
需要先安装yarn,网上教程比较多,自行查阅 注意,安装后会修改或添加部分文件 然后在dev目录下添加sw.js ,大概就是定义PWA的生命周期的监听
在vue ui命令下的仪表盘选择打包dist,然后在dist目录下 python -m http.server [port] (可以用apach httpserver 或者nginx) 此处有个问题,在@vue/cli的GitHub 例子给的是sw.js ,然后通过@vue/pwa自动生成的registerServiceWorker.js却是 service-worker.js,本质上sw.js = service-worker.js,这里只要做对应的修改就是了 生成PWA打开方式如下:
然后在chrome浏览器安装即可 写在后面目前只是简单实现通过vue-cli3.0实现pwa,只是为了能够简单安装(入门级别,不要嘲笑),后续功能还有待继续学习,希望能够和大家共同学习,如有不对,请指正! Tips:貌似目前Lavas是一个比较成熟的PWA解决方案,可以考虑看一下! |
|