importdatafrom'../data'exportdefault{ data () {return{'pictures': data.pictures } }}
.picture>img{color:#fff;width:100%; }.info{text-align: right;padding:5px;color:#555;font-size:10px; }.comment{padding:10px;color:#555; }.actions{text-align: center; }
Git commit:39360f251da153c780cd148dc3cf234348bb1e87
关于'href'链接的使用:我推荐使用vuejs的组件但是在这我想使代码尽可能的简单。
最后的结果
我们完成了,CropChat完成啦!
源代码能够在GitHub repository访问:https://github.com/charlesBochet/vueJSPwa
Conclusions
我希望我已经令你确信你能够利用VueJS和Webpack就可以简单地创建web应用。总结来说:
Vue-cli可以在命令行种创建一个虚拟的VueJS + Webpack应用
通过添加Manifest.json文件让你的web应用能够安装
使用Vue-Router以及Material Design来创建一个类似于app用户体验的应用
然而,CropChat还依然不是一个渐进式web应用:让我们看一下PWA的需求清单:
一半的需求还没有满足。在下一个部分将会有其它的目标。未完待续!