

最近公司要求开发web版的app,由于app是偏向内容方面,而且带了一个聊天模块,所以一般的多页开发不是很适合,而且主要是手机浏览,对加载速度或者用户体验来说都比较苛刻。调研了很多框架和模式,最后自己东拼西凑搞出来了这么一个玩意。
服务端
毫无疑问使用node,使用typescript可以有效的在编码同时查错,强类型语言写服务端毫无压力。
服务端渲染页面
#layout.ejs 访问这个SPA的所有url返回的都是这个页面 标签都可以动态设置,只要传参数进来就可以Vue Router Example //定义一些前端需要用到的全局属性,文章ID或用户信息什么的 //index.ts中传过来的是 window.cm_data = {name:"张三"} //前端就能访问到了 <%-server_data%> script> //这里的id是前端需要用到的一个标识Hello App!
Go to Foo Go to Bar
//router-view是客户端vue-router需要解析的dom //server_html是根据访问url地址生成的html,是做SEO的重点,不加载下面的app.js也可以看到内容<%-server_html%> //webpack打包好的js,主要是路由配置
客户端
需要完善的地方
前后端统一模板,已经找到方法了把html分离出来,node端用fs.readFileSync方法获取,客户端用webpack的raw-loader获取html内容
不放源码都是瞎扯。
源码地址
https://github.com/yjj5855/node-vue-server-webpack
