Vue 2.0 实战之仿Eleme WebApp SPA(学习)

Eleme (饿了么移动端SPA)

• 概述：
  非常感谢黄毅老师录制的实战视频，给刚入门Vue的人提供了很好的Vue进阶教程。
  该实战项目使用Vue2.0开发。

  Github地址: Eleme SPA

• 技术架构：
  
  • Vue 2.0
  • Vue-router 2
  • Vue-cli
  • Axios
  • Better-scroll
  • ES6
  • Webpack 2
  • Eslint
  • Sass

• 项目截图
  

  

  

  

  

• 功能：

  • 模拟原生App滑动
  • 商品联动
  • 商品加入购物车
  • 图片左右滑动
  • 小球飞入动画
  • 评论筛选
  • 等等
• 安装：

// github
git clone https://github.com/Eval0day7/StudyEleme.git

// npm

// 安装依赖
npm install 

// 运行项目
npm run dev

• 总结：
  
  • 了解了项目开发整个流程。
  • 设计稿高度还原移动端页面。
  • 模块化、组件化开发。
  • css sticky footer 经典布局。
  • 明白了设备像素比、移动端1px问题。
  • Eslint 代码规范检测工具，明白了ES6代码规范。
  • 熟悉了Webpack打包工具。
    Ps: 总之这次实战收获匪浅，加深了对Vue开发知识理解，是个很好体验过程，成就感十足。由于实战视频使用的是Vue 1.0，在开发过程也碰到了许多问题。不过还好都已经解决了。