白驹过隙，时光荏苒
明年的这个时候我又是在做什么…
读在最前面：
1、本文讲述Vue，Webpack 模块化、SEO优化（Vue SSR 服务端同构直出）、全浏览器兼容（ie8以上）、图片轮播等案例方案
2、技术点：vue、webpack、es6、vue-server-renderer、sass、autoprefixer、vue-meta、axios
3、阅读本文，读者应了解Vue、WebPack，有一定的前端基础
4、此文建立在已有node环境，sass环境，webpack环境下，特此说明
5、以下对关键代码进行描述解析，下载完整项目，请拉到最底部！
构建Vue，Fire！
1、目录结构
（1）、页面结构采用单一结构，分离js、css、vue、路由
（2）、数据仓库结构分离actions、mutations、getters
2、创建Vue入口文件，app.js
（1）、第三方样式依赖：阿里iconfont
（2）、第三方js依赖：vue，vue-router，vuex，vuex-router-sync
（3）、路由、数据仓库依赖：/router/index.js，/store/index.js
3、创建路由配置文件，/router/index.js
（1）、结合vue-meta实现动态meta
3、创建数据仓库配置文件，/store/index.js
要点梳理
es6 + wait/async + 扩展属性
此模块需要注意浏览器兼容配置，参见.babelrc
seo优化思路
组件支持：vue-server-renderer
实现原理：请求发起->server.js->服务器生成数据返回->浏览器端接收数据后比对本地生成数据是否一致（虚拟dom），如果是则进行挂载
网络请求
统一使用axio实现前后端请求，使用cookie注入state方式进行前后端 ssr cookie同步 及相关数据传递
动态meta
步骤：
1、在路由配置中注入meta
2、在每个页面js中配置metaInfo（使用mixin进行公共管理）
3、在entry-server.js中获取app..$meta()，注入context
4、index.html页面显示meta
图片轮播
思路：结合jquery + css + 原生定时实现
ie9路由跳转异常
解决此问题在/router/index.js 配置路由时，配置 fallback: false
ie9跨域请求异常
解决此问题需要使用代理配置客户端请求api接口
by：海豚湾-丰
原文链接：https://www.cnblogs.com/teamblog/p/8093262.html
原创文章，作者：优速盾-小U，如若转载，请注明出处：https://www.cdnb.net/bbs/archives/20766
