Skip to content

Volcano-Yang/vue-ssr

Repository files navigation

vue-ssr

2021.12开始写的vue-ssr教程

一、建设计划

1. vue2

技术栈:vue2+vue-router+vuex+javascript+webpack

  • 先搭建一个简单的vue2-spa应用
  • 搭建vue2-ssr的同构代码框架
  • 打包出vue-ssr-server-bundle.json
  • 打包出vue-ssr-client-manifest.json
  • 利用打包产品渲染出ssr应用的首屏快照返回给客户端,并在客户端成功激活
  • 在ssr的node端拉取首屏数据,并且共享给客户端
  • 优化开发体验,支持热更新等
  • 编写vue2-ssr相关搭建文档

2. vue3

技术栈:vue3+vue-router+vuex+typescript+vite

  • 先搭建一个简单的vue3-spa应用
  • 使用vite初始搭建vite+vue3 ssr项目框架
  • 利用打包产品渲染出ssr应用的首屏快照返回给客户端,并在客户端成功激活
  • 解决ssr返回的首屏数据没有样式的问题
  • 在ssr的node端拉取首屏数据,并且共享给客户端
  • 编写vue3-ssr相关搭建文档

3. 封装成框架

  • 搭建项目框架
  • 搭建项目npm发布流水线
  • 设计封装思路
  • 封装成好用的ssr框架
  • 编写封装框架的相关文档