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

来源:互联网 发布:网易企业邮箱端口 编辑:程序博客网 时间:2024/04/28 12:07

这是一个基于Vue全家桶实现的饿了么移动端webap   http://www.tuicool.com/articles/JZNjEnB

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

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

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

图片描述

项目运行

克隆项目到本地

git clone https://github.com/JerryYgh/m...

安装依赖

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...

  • better-scroll插件使用: https://github.com/ustbhuangy...

  • stylus: http://www.zhangxinxu.com/jq/...

  • ES6入门: http://es6.ruanyifeng.com/

  • Stickyfooters指南: http://www.w3cplus.com/css3/c...

  • Flex弹性布局: http://www.ruanyifeng.com/blo...

  • localStorage本地存储: http://www.cnblogs.com/st-les...

  • 最后:本项目有付费视频课程,戳这里: http://coding.imooc.com/class...

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

0 0
原创粉丝点击