Vue SSR集成示例Webpack 5+Vue+Koa+Vue-Router+Vuex

Vue 的服务端渲染项目,集成了webpack5VueKoavue-routervuex,适合想试试 SSR 实战方案的你。

目录结构挺清晰,npm install装完依赖,分开打包服务端和客户端:npm run server:buildnpm run client:build。打完后,直接跑node server.js就能看到效果。

整个过程响应也快,代码也不复杂,适合平时想试试 SSR 的同学练练手。踩坑方面,webpack-cli现在要单独装,webpack-dev-server也变动挺多,老项目升级过来的话注意兼容。

哦对了,想深入了解配置细节和优化的话,推荐几个挺实用的文章:

如果你想搭一套 SSR 项目练练手,或者正在做技术选型,这个项目可以作为一个不错的起点。

zip
Vue-SSR-master.zip 预估大小:97个文件
folder
Vue-SSR-master 文件夹
file
.gitignore 94B
folder
基本的服务端渲染 文件夹
file
server.js 1KB
file
template.html 230B
file
package.json 432B
file
package-lock.json 23KB
file
README.md 8KB
folder
SSR-2-ERR 文件夹
file
server.js 3KB
folder
public 文件夹
file
index.ssr.html 259B
file
index.html 255B
file
笔记 2KB
file
package.json 1KB
file
babel.config.json 104B
folder
dist 文件夹
file
vue-ssr-client-manifest.json 465B
file
index.ssr.html 198B
file
server.bundle.js.LICENSE.txt 87B
file
client.bundle.js 69KB
file
vue-ssr-server-bundle.json 69KB
file
server.bundle.js 68KB
file
index.html 233B
file
client.bundle.js.LICENSE.txt 87B
folder
src 文件夹
folder
components 文件夹
file
Foo.vue 288B
file
Bar.vue 361B
file
main.js 260B
file
server.entry.js 290B
file
App.vue 351B
file
client-entry.js 124B
folder
build 文件夹
file
webpack.client.js 1KB
file
webpack.server.js 2KB
file
webpack.base.js 427B
file
utils.js 100B
file
package-lock.json 299KB
folder
.vscode 文件夹
file
settings.json 38B
folder
SSR-1 文件夹
file
server.js 2KB
folder
public 文件夹
file
index.ssr.html 259B
file
index.html 255B
file
笔记 1KB
file
package.json 1KB
file
babel.config.json 104B
folder
dist 文件夹
file
index.ssr.html 274B
file
server.bundle.js.LICENSE.txt 87B
file
client.bundle.js 69KB
file
server.bundle.js 68KB
file
index.html 233B
file
client.bundle.js.LICENSE.txt 87B
folder
src 文件夹
folder
components 文件夹
file
Foo.vue 288B
file
Bar.vue 361B
file
main.js 248B
file
server.entry.js 290B
file
App.vue 351B
file
client-entry.js 124B
folder
build 文件夹
file
webpack.client.js 909B
file
webpack.server.js 2KB
file
webpack.base.js 507B
file
utils.js 99B
file
package-lock.json 299KB
folder
单页面配置 文件夹
file
server.js 1KB
folder
public 文件夹
file
index.html 225B
file
template.html 230B
file
笔记 834B
file
package.json 975B
file
babel.config.json 104B
folder
dist 文件夹
file
bundle.js.map 351KB
file
bundle.js 65KB
file
bundle.js.LICENSE.txt 87B
file
index.html 263B
folder
src 文件夹
folder
components 文件夹
file
Foo.vue 241B
file
Bar.vue 241B
file
main.js 121B
file
App.vue 342B
file
webpack.config.js 1KB
file
package-lock.json 297KB
folder
SSR-3 文件夹
file
server.js 3KB
folder
public 文件夹
file
index.ssr.html 259B
file
index.html 255B
folder
.vscode 文件夹
file
settings.json 38B
file
笔记 8KB
file
package.json 1KB
file
babel.config.json 104B
folder
dist 文件夹
file
index.ssr.html 274B
file
server.bundle.js.LICENSE.txt 219B
file
client.bundle.js 110KB
file
server.bundle.js 109KB
file
index.html 267B
file
client.bundle.js.LICENSE.txt 219B
folder
src 文件夹
folder
components 文件夹
file
Foo.vue 288B
file
Bar.vue 1KB
file
store.js 2KB
file
main.js 449B
file
router.js 530B
file
server.entry.js 2KB
file
App.vue 446B
file
client-entry.js 558B
folder
build 文件夹
file
webpack.client.js 909B
file
webpack.server.js 2KB
file
webpack.base.js 507B
file
utils.js 99B
file
package-lock.json 299KB
...
zip 文件大小:588.1KB