Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/jerryygh/m-eleme
饿了么移动端单页应用
https://github.com/jerryygh/m-eleme
javascript vue vue-cli vue-resource vue-router2 vue2 webpack2
Last synced: about 1 month ago
JSON representation
饿了么移动端单页应用
- Host: GitHub
- URL: https://github.com/jerryygh/m-eleme
- Owner: JerryYgh
- Created: 2017-04-10T14:52:26.000Z (over 7 years ago)
- Default Branch: master
- Last Pushed: 2017-04-17T10:02:09.000Z (over 7 years ago)
- Last Synced: 2024-10-11T13:41:47.226Z (about 1 month ago)
- Topics: javascript, vue, vue-cli, vue-resource, vue-router2, vue2, webpack2
- Language: Vue
- Size: 26.7 MB
- Stars: 118
- Watchers: 6
- Forks: 55
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# m-eleme(饿了么移动端单页应用)
> 这是一个基于Vue全家桶实现的饿了么移动端webapp
> 项目github地址:[m-eleme](https://github.com/JerryYgh/m-eleme)
> 如果觉得对您有帮助,您可以在右上角给我个star支持一下,谢谢!
## 项目截图
> 注:动图很卡,是因为截图文件很大,动图里的图片模糊,是截图软件的锅,谅解下,项目实际运行都不存在这些问题的。
![eleme.gif](./resource/eleme.gif)
## 项目运行
```bash
# 克隆项目到本地
git clone https://github.com/JerryYgh/m-eleme.git# 安装依赖
npm install# 本地开发,开启服务器,浏览器访问http://localhost:8080
npm run dev# 构建生产
npm run build
```## 项目说明
> 用到的技术栈
vue2 + vue-router2 + webpack2 + vue-cli2 + vue-resource + stylus + flex + eslint
> 主要功能说明
- resource文件里有UI原稿psd,切好的图,及标注文件。
- 基于vue2.0
- 使用vue-cli2脚手架搭建项目
- 使用webpack2打包项目文件
- 使用vue-router2实现路由切换
- 使用vue-resource进行数据请求
- stylus编写样式
- flex弹性布局
- eslint进行es6代码检查
- 联动滚动借助了better-scroll插件
- localStorage实现本地存储> 学习参考
- vue2.0官网: https://vuefe.cn/v2/guide/
- webpack1免费视频课程,戳这里:http://www.imooc.com/learn/802
- webpack1向webpack2升级:https://webpack.js.org/guides/migrating/
- better-scroll插件使用:https://github.com/ustbhuangyi/better-scroll
- stylus: http://www.zhangxinxu.com/jq/stylus/
- ES6: http://es6.ruanyifeng.com/
- Sticky footers http://www.w3cplus.com/css3/css-secrets/sticky-footers.html
- Flex弹性布局: http://www.ruanyifeng.com/blog/2015/07/flex-grammar.html?utm_source=tuicool
- localStorage本地存储: http://www.cnblogs.com/st-leslie/p/5617130.html
- 最后:本项目有付费视频课程,戳这里:http://coding.imooc.com/class/74.html