{"id":13536364,"url":"https://github.com/liangxiaojuan/vue-Meizi","last_synced_at":"2025-04-02T03:30:34.268Z","repository":{"id":52498932,"uuid":"78085794","full_name":"liangxiaojuan/vue-Meizi","owner":"liangxiaojuan","description":"vue最新实战项目，vue2 + vuex + webpack + es6  干货多多，新手福利","archived":false,"fork":false,"pushed_at":"2021-04-27T15:34:16.000Z","size":296,"stargazers_count":1530,"open_issues_count":13,"forks_count":436,"subscribers_count":66,"default_branch":"master","last_synced_at":"2025-03-25T10:08:39.697Z","etag":null,"topics":["css3","demo","element-ui","html5","javascript","react","vue","vue-cli","vue-meizi","vue-router","vuex","webpack"],"latest_commit_sha":null,"homepage":"http://yangyi1024.com/meizi","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/liangxiaojuan.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2017-01-05T06:22:42.000Z","updated_at":"2025-03-18T14:15:59.000Z","dependencies_parsed_at":"2022-08-13T02:00:57.203Z","dependency_job_id":null,"html_url":"https://github.com/liangxiaojuan/vue-Meizi","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/liangxiaojuan%2Fvue-Meizi","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/liangxiaojuan%2Fvue-Meizi/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/liangxiaojuan%2Fvue-Meizi/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/liangxiaojuan%2Fvue-Meizi/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/liangxiaojuan","download_url":"https://codeload.github.com/liangxiaojuan/vue-Meizi/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":246540519,"owners_count":20793930,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["css3","demo","element-ui","html5","javascript","react","vue","vue-cli","vue-meizi","vue-router","vuex","webpack"],"created_at":"2024-08-01T09:00:37.803Z","updated_at":"2025-04-02T03:30:34.238Z","avatar_url":"https://github.com/liangxiaojuan.png","language":"JavaScript","funding_links":[],"categories":["JavaScript","Demo示例"],"sub_categories":[],"readme":"# vue-Meizi\n\n\u003e  本项目是基于vue2最新实战项目，是适合新手进阶的绝佳教程。代码简单易懂，注释多多。实现了移动端使用最多的 无限滚动，图片加载，左右滑动，等待。先发布预览版本，后面更多更全的功能和教程将会陆续发出。\n\n###首先\n\n***\n\u003e*  感谢[gank.io](http://gank.io/)提供的api接口\n\n\u003e* 喜欢的请点心，关注，star ,fork,这些是我坚持下去的动力\n\n\u003e* demo地址 [demo](http://liangxiaojuan.github.io/meizi/index) （请用chrome的手机模式预览）\n\n\u003e* 本项目地址[github地址](https://github.com/liangxiaojuan/vue-Meizi)\n\n\u003e* 手机扫一扫\n\n![项目二维码.png](http://upload-images.jianshu.io/upload_images/4249223-553d02ead2cb78fe.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)\n\n\n### 项目技术架构\n***\n*  vue-cli\n*  vue\n*  vue-resource\n*  vue-router\n*  vuex\n*  vue-awesome-swiper\n*  vue-infinite-scroll\n*  stylus\n*  webpack\n\n###上图\n***\n* 侧滑导航\n\n![1.gif](http://upload-images.jianshu.io/upload_images/4249223-5f3b13d8a460f340.gif?imageMogr2/auto-orient/strip)\n\n* 瀑布流布局，无限滚动，图片懒加载\n\n![2.gif](http://upload-images.jianshu.io/upload_images/4249223-219e645475534a08.gif?imageMogr2/auto-orient/strip)\n\n* 左右滑动，左右切换\n\n![3.gif](http://upload-images.jianshu.io/upload_images/4249223-81d898b9ac461048.gif?imageMogr2/auto-orient/strip)\n\n\n###安装\n***\n项目地址：（`git clone`）\n```shell\ngit clone https://github.com/liangxiaojuan/vue-Meizi.git\n```\n通过`npm`安装本地服务第三方依赖模块(需要已安装[Node.js](https://nodejs.org/))\n\n```\nnpm install\n```\n启动服务(http://localhost:9090)\n\n```\nnpm run dev\n```\n发布代码\n\n```\nnpm run build\n```\n### 安装注意\n安装 vue-cli\n```\nnpm install -g vue-cli\n```\n安装 vue-cli eslint\n```\nnpm install -g eslint\n```\n 安装依赖 friendly-errors-webpack-plugin\n\n```\nnpm install friendly-errors-webpack-plugin --save-dev\n```\n###目录结构\n***\n\u003cpre\u003e\n├── build              // 构建服务和webpack配置\n├── config             // 项目不同环境的配置\n├── dist               // 项目build目录\n├── index.html         // 项目入口文件\n├── package.json       // 项目配置文件\n├── src                // 生产目录\n│   ├── assets         // 图片资源\n│   ├── common          // 公共的css js 资源\n│   ├── components     // 各种组件\n│   ├── App.vue         // 主页面 \n│   ├── vuex           // vuex状态管理器\n│   ├── router.js     // 路由配置器\n│   └── main.js        // Webpack 预编译入口\n\u003c/pre\u003e\n\n###实现的功能\n***\n* 瀑布流布局\n* 无限滚动\n* 侧边导航\n* 图片懒加载\n* 左右滑动切换\n* 等等\n\n### 正在实现的功能\n***\n* 上拉加载\n*  搜索\n*  我的收藏\n*  登录\n*  等等\n\n### 最后\n***\n* 我的另外一个开源项目[饿了么app](https://github.com/liangxiaojuan/eleme)（已经star400+）\n* 如果喜欢一定要 star哈!!!（谢谢!!）\n* 如果有意见和问题 请在 lssues提出，我会在线解答。\n* 我年后要离职了 对我感兴趣的可以联系我 [简历](https://github.com/liangxiaojuan/resume)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fliangxiaojuan%2Fvue-Meizi","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fliangxiaojuan%2Fvue-Meizi","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fliangxiaojuan%2Fvue-Meizi/lists"}