vue2+webpack2实现饿了么移动端商家页面

这是一个基于Vue全家桶实现的饿了么移动端webap

项目github地址:https://github.com/JerryYgh/m-eleme

如果觉得对您有帮助,您可以在github上给我个star支持一下,谢谢!如果有问题,也欢迎一起讨论!

先来张项目动态截图感受下

项目运行

#克隆项目到本地

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

主要功能说明

1、resource文件里有UI原稿psd,切好的图,及标注文件。

2、基于vue2.0

3、使用vue-cli2脚手架搭建项目

4、使用webpack2打包项目文件

5、使用vue-router2实现路由切换

6、使用vue-resource进行数据请求

7、stylus编写样式

8、flex弹性布局

9、eslint进行es6代码检查

10、联动滚动借助了better-scroll插件

11、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 footershttp://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


项目github地址:https://github.com/JerryYgh/m-eleme

如果觉得对您有帮助,您可以在github上给我个star支持一下,谢谢!如果有问题,也欢迎一起讨论!

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 真正和他有交集的时候,是在第二个学期快结束的时候,那时候的他……还有两个多月就出国。 那时候国际部...
    610VIX阅读 171评论 0 1
  • 如果 我爱你 我想 我会小心翼翼地 说出每一句 我爱你 在快餐化的世代 人们太容易把一句话听腻 也太容易把一个字用...
    尚晓阅读 393评论 3 7
  • 关于背叛因不应该得到原谅, 首先我们要对背叛做出一个定义,当然背叛无论出于什么目的这件事情就是一件错的事...
    你颖子哥阅读 954评论 1 2
  • 所谓的三段论,简单的理解为,大前提,小前提,结论式的推理模式。只有通过自身共同努力,多花时间,不断的刻意练习,来锻...
    wh王辉阅读 223评论 0 0