vue构建webapp，首屏加载优化

用vue-cli打包创建的webapp工程，index.html中不包含dom内容结构，都是在js中，如下图

image.png

仅仅包含<div id='app'></div>
这样的话，就需要等待依赖的3个js加载完成才可以显示页面，之前页面是空白的，对于移动端来讲非常不友好，下载js需要时间，针对这个问题查询了许多资料，最终找到了一个解决的方法：

image.png

vue文档中有这样一段预渲染的介绍，点击去看看prerender-spa-plugin
根据介绍设置

image.png

1，npm install prerender-spa-plugin
2，设置webpack.conf.js
3，设置exports plugin
4，npm run build
查看index.html

image.png

不再是之前的一个空div了，首页内容展现在index.html中了，这样就可以解决空白的问题了！！
和大家分享一下