【文件属性】：
文件名称：Prerender-SPA:SPA单页面-预渲染应用实践
文件大小：338KB
文件格式：ZIP
更新时间：2021-05-08 20:48:41
spa preprende JavaScript
使用
npm install 下载依赖
npm run dev 启动客户端服务
npm run build 生成预渲染页面
npm run serve 开启http-server服务,监控生成的dist目录
npm run node 开启Koa服务,监控生成的dist目录
指南
预渲染原理
在webpack打包结束并生成文件后（after-emit hook），会启动一个server模拟网站的运行，用puppeteer（google官方的headless 无头浏览器浏览器）访问指定的页面route，得到相应的html结构，并将结果输出到指定目录，过程类似于爬虫。
预渲染应用场景
seo优化 对于一些动态数据利用enderAfterTime也可以进行预渲染出来。当动态数据渲染出来之后，客户端代码比如bundle.js会立马接管dom操作。对于spa优化可谓是非常方便。
对于meta
【文件预览】：
Prerender-SPA-master
----index.html(175B)
----webpack.config.js(3KB)
----favicon.ico(32KB)
----src()
--------main.js(781B)
--------components()
--------App.vue(889B)
--------assets()
----.babelrc(38B)
----serve.js(771B)
----README.md(6KB)
----dist()
--------index.html(980B)
--------about()
--------favicon.ico(32KB)
--------build.js(126KB)
--------build.js.map(632KB)
--------logo.png(7KB)
--------contact()
----.gitignore(14B)
----package-lock.json(356KB)
----package.json(1013B)