婚芭莎H5（基于Vue的SSR方案）

北京金海群英网络信息技术有限公司

2018-06-01

项目说明

产品需求：兼容SEO，前后端分离
开发周期：3周
参与人数：5人
线上地址：http://m.jiehun.com.cn/beijing/

产品图片

产品需求

前后端分离（业务不重复）
兼容SEO (服务端渲染)

技术方案

基于Vue的SSR方案

在这次项目之前便在公司里推过Vue框架，部分同事已有过vue的开发经验，并且Vue的第三方ui库还蛮丰富、成熟的、不需要额外在花大量人力开发维护一套UI库；
前半年前后端没有分离的时候，前后端在合作上面存在大量沟通、重复返工的高成本；为了尽可能杜绝这种低效的开发模式，在经过多方协商后，决定使用Node来做一个中间层；
基于以上考虑便选择了Vue+SSR的技术方案，这又是一次大胆的尝试；

技术栈

vue (Vuejs)
vuex (vue组件状态管理)
vue-router (vue路由管理)
webpack (构建工具)
gulp (构建工具)
nuxtjs （VueSSR框架）
express（node框架）
axios （客户端和服务端异步请求）
mint-ui (第三方ui库)
log4js （日志管理）
redis （轻便缓存）

赏

本文作者： 老左
本文链接： https://zuojiquan.com/post/20180601/jiehun-h5/
版权声明： 本作品采用 CC BY-NC-SA 4.0 许可协议进行许可，转载请注明出处！

缺失模块。
1、请确保node版本大于6.2
2、在博客根目录（注意不是yilia根目录）执行以下命令：
npm i hexo-generator-json-content --save

3、在根目录_config.yml里添加配置：

			  jsonContent:
				meta: false
				pages: false
				posts:
				  title: true
				  date: true
				  path: true
				  text: false
				  raw: false
				  content: false
				  slug: false
				  updated: false
				  comments: false
				  link: false
				  permalink: false
				  excerpt: false
				  categories: false
				  tags: true

多年互联网前端开发、团队管理经验，同时还是一名自由开发者。