共计 1173 个字符，预计需要花费 3 分钟才能阅读完成。
最近学习了下 vue ssr 方面知识，学习过程为
先大致过了一遍官方 VUE SSR 文档, 一路看下来还是有些懵逼的，跟着官方步骤下来我是没办法搭一个简单的 vue-ssr 的 demo，所以网上找了下 tutorial
强烈推荐从 0 开始，搭建 Vue2.0 的 SSR 服务端渲染，跟着作者一步步搭建，可以循序渐进的理解 vue ssr 是怎么实现的
然后就是自己回到官网，不用脚手架一步步用 webpack 搭建 vue 基础环境，这里主要参考 vue-loader 和 webapck 文档，ssr 方面内的配置主要参考了 vue ssr 官方例子 hackernews 的配置与实现。
先说明下采用的各个主要 package 的版本如下：
vue 2.5.21
vue-server-renderer 2.5.21
webpack 4.27.1
vue-loader 15.4.2
然后分享下学习中碰到的问题，具体搭建和学习参见 demo 和上面步骤 2 文章链接，作者写的很好。
终端代理设置在我把官方 hackerners 的例子下下来，装好依赖跑起来，控制台显示成功了，但是代开浏览器，却一直不显示页面，后来在 issue 中查到，你运行的 Terminal 需要翻墙，具体可以见 issue。这里是解决问题，但是后面自己的 demo 用 axios 请求出了问题，自己 mock 的一些数据在浏览器中输入 http://localhost:3000/api/user 是可以出来数据的，但是起的服务却老是出错，后来查到因为我设置了终端的 proxy，axios 会自动检测到并使用他，所以他请求的 url 一直是，所以遇到一个连环问题，解决的话参考 axios 这个 issue 去掉终端的 proxy
document is not defined 服务器环境是没有 document 的，webpack 如果用了 MiniCssExtractPlugin 会提取 css 会用到 document，所以在服务器端的 webpack 配置中需要去掉，这一部分参考了这篇文章，也可以参考我的 webpack 配置看一看
css 打包不到一个文件 webpack4 中使用 splitchunks 这个配置来优化和做缓存策略，然而我怎么配置都 css 文件不会被打包成一个，搜索了很久终于看到 MiniCssExtractPlugin 的 issue 中解决，这样就打包到一个 css 文件，后来持续关注到知道这是 webpack 的一个 bug。
开发环境热重载这里我用的是官方的方法，照抄过来的 [逃:)]，基本原来我觉得应该就是利用 webpack-hot-middleware 和 webpack-dev-middleware 来实现的，因为 webpack-dev-middleware 是一个 express 中间件，它实现 fs 基于内存，提高了编译读取速度；然后通过 watch 文件的变化，动态编译
结束
欢迎讨论和大佬的指导，放上 github 地址，还有线上地址
