All Projects → liangxiaojuan → Vue Meizi

liangxiaojuan / Vue Meizi

vue最新实战项目,vue2 + vuex + webpack + es6 干货多多,新手福利

Programming Languages

javascript
184084 projects - #8 most used programming language
Vue
7211 projects
CSS
56736 projects
HTML
75241 projects

Projects that are alternatives of or similar to Vue Meizi

Eleme
restructure..
Stars: ✭ 1,635 (+10.77%)
Mutual labels:  webpack, vue-cli, demo, vuex, html5, vue-router, css3, element-ui
Vue Admin Design
基于vue + elementUI的管理系统模板
Stars: ✭ 279 (-81.1%)
Mutual labels:  webpack, vue-cli, vuex, vue-router, element-ui
Vue Todos
vue最新实战项目教程,从零开始,一步一个脚印,循序渐进。跟着我一起学习vue吧!
Stars: ✭ 1,659 (+12.4%)
Mutual labels:  webpack, vue-cli, vuex, vue-router, element-ui
Vue3 Jd H5
🔥 Based on vue3.0.0, vant3.0.0, vue-router v4.0.0-0, vuex^4.0.0-0, vue-cli3, mockjs, imitating Jingdong Taobao, mobile H5 e-commerce platform! 基于vue3.0.0 ,vant3.0.0,vue-router v4.0.0-0, vuex^4.0.0-0,vue-cli3,mockjs,仿京东淘宝的,移动端H5电商平台!
Stars: ✭ 328 (-77.78%)
Mutual labels:  vue-cli, vuex, html5, vue-router, css3
Vue Cnode
🔥Vue.js打造一个开源的CNode社区。CNode by Vue.js
Stars: ✭ 249 (-83.13%)
Mutual labels:  webpack, vuex, html5, vue-router, css3
Vue2 Manage
基于 vue + element-ui 的后台管理系统
Stars: ✭ 11,345 (+668.63%)
Mutual labels:  webpack, vue-cli, vuex, vue-router, element-ui
Vue Shiyanlou
😘基于vue2和vuex的复杂单页面应用,20+页面53个API(仿实验楼)✨✨
Stars: ✭ 342 (-76.83%)
Mutual labels:  webpack, vuex, html5, vue-router, css3
Vue2 Demo
Vue 基于 Genesis + TS + Vuex 实现的 SSR demo
Stars: ✭ 2,072 (+40.38%)
Mutual labels:  webpack, vue-cli, demo, vuex, vue-router
Vue Blog
🎉 基于vue全家桶 + element-ui 构建的一个后台管理集成解决方案
Stars: ✭ 208 (-85.91%)
Mutual labels:  webpack, vue-cli, vuex, vue-router, element-ui
Vue Music Player
🎵Vue.js写一个音乐播放器+📖One(一个).A music player + One by Vue.js
Stars: ✭ 729 (-50.61%)
Mutual labels:  webpack, vuex, html5, vue-router, css3
Vue Project
基于vue-cli构建的财务后台管理系统(vue2+vuex+axios+vue-router+element-ui+echarts+websocket+vue-i18n)
Stars: ✭ 301 (-79.61%)
Mutual labels:  webpack, vuex, vue-router, element-ui
Space Snake
A Desktop game built with Electron and Vue.js.
Stars: ✭ 289 (-80.42%)
Mutual labels:  webpack, vue-cli, vuex, vue-router
Vue Home
🏠 A simple project(Vue Community SPA) which bases on vue+vue-cli+vue-router+axios+ scss.
Stars: ✭ 256 (-82.66%)
Mutual labels:  webpack, vue-cli, vuex, vue-router
Vue2 Echo
基于vue2 + vue-router + vuex 构建的一个音乐类单页面应用 —— echo回声
Stars: ✭ 408 (-72.36%)
Mutual labels:  webpack, vue-cli, vuex, vue-router
Dashboard
A dashboard scaffolding based on Vue.js 3.0 created by Vite.
Stars: ✭ 497 (-66.33%)
Mutual labels:  webpack, vue-cli, vuex, vue-router
Vue2 News
基于vue2 + vue-router + vuex 构建的一个新闻类单页面应用 —— 今日头条(移动端)
Stars: ✭ 462 (-68.7%)
Mutual labels:  webpack, vue-cli, vuex, vue-router
Vue Element Admin
🎉 A magical vue admin https://panjiachen.github.io/vue-element-admin
Stars: ✭ 73,044 (+4848.78%)
Mutual labels:  webpack, vue-cli, vuex, element-ui
Vue Cms
基于 Vue 和 ElementUI 构建的一个企业级后台管理系统
Stars: ✭ 415 (-71.88%)
Mutual labels:  webpack, vue-cli, vuex, element-ui
Vue Admin Webapp
this is a admin project
Stars: ✭ 673 (-54.4%)
Mutual labels:  webpack, vue-cli, vuex, vue-router
Manhuaren
vue2.0全家桶,仿漫画人官网(移动端)
Stars: ✭ 18 (-98.78%)
Mutual labels:  webpack, vue-cli, vuex, vue-router

vue-Meizi

本项目是基于vue2最新实战项目,是适合新手进阶的绝佳教程。代码简单易懂,注释多多。实现了移动端使用最多的 无限滚动,图片加载,左右滑动,等待。先发布预览版本,后面更多更全的功能和教程将会陆续发出。

###首先


  • 喜欢的请点心,关注,star ,fork,这些是我坚持下去的动力
  • demo地址 demo (请用chrome的手机模式预览)
  • 手机扫一扫

项目二维码.png

项目技术架构


  • vue-cli
  • vue
  • vue-resource
  • vue-router
  • vuex
  • vue-awesome-swiper
  • vue-infinite-scroll
  • stylus
  • webpack

###上图


  • 侧滑导航

1.gif

  • 瀑布流布局,无限滚动,图片懒加载

2.gif

  • 左右滑动,左右切换

3.gif

###安装


项目地址:(git clone

git clone https://github.com/liangxiaojuan/vue-Meizi.git

通过npm安装本地服务第三方依赖模块(需要已安装Node.js)

npm install

启动服务(http://localhost:9090)

npm run dev

发布代码

npm run build

安装注意

安装 vue-cli

npm install -g vue-cli

安装 vue-cli eslint

npm install -g eslint

安装依赖 friendly-errors-webpack-plugin

npm install friendly-errors-webpack-plugin --save-dev

###目录结构


├── build              // 构建服务和webpack配置
├── config             // 项目不同环境的配置
├── dist               // 项目build目录
├── index.html         // 项目入口文件
├── package.json       // 项目配置文件
├── src                // 生产目录
│   ├── assets         // 图片资源
│   ├── common          // 公共的css js 资源
│   ├── components     // 各种组件
│   ├── App.vue         // 主页面 
│   ├── vuex           // vuex状态管理器
│   ├── router.js     // 路由配置器
│   └── main.js        // Webpack 预编译入口

###实现的功能


  • 瀑布流布局
  • 无限滚动
  • 侧边导航
  • 图片懒加载
  • 左右滑动切换
  • 等等

正在实现的功能


  • 上拉加载
  • 搜索
  • 我的收藏
  • 登录
  • 等等

最后


  • 我的另外一个开源项目饿了么app(已经star400+)
  • 如果喜欢一定要 star哈!!!(谢谢!!)
  • 如果有意见和问题 请在 lssues提出,我会在线解答。
  • 我年后要离职了 对我感兴趣的可以联系我 简历
Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].