vue Meizi

vue-Meizi

This project is based on the latest practical project of vue2 and is an excellent tutorial for novices to advance. The code is simple and easy to understand, with lots of comments. It implements infinite scrolling, which is most commonly used on mobile devices, loading pictures, sliding left and right, and waiting. The preview version will be released first, and more and more complete functions and tutorials will be released later.

###first

---

• Thanks to the API interface provided by gank.io

• If you like it, please give it a thumbs up, follow it, star it, and fork it. These are the motivations for me to keep going.

• demo address demo (please use chrome’s mobile mode to preview)

• This project address github address

• Scan with your mobile phone

Project technical architecture

---

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

### Above picture

---

• Sliding navigation

• Waterfall flow layout, infinite scrolling, lazy loading of images

• Swipe left and right, switch left and right

###Install

---

Project address: git clone )

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

Install local service third-party dependency modules through npm (requires Node.js to be installed)

 npm install

Start the service (http://localhost:9090)

 npm run dev

Release code

 npm run build

Installation notes

Install vue-cli

 npm install -g vue-cli

Install vue-cli eslint

 npm install -g eslint

Install dependencies friendly-errors-webpack-plugin

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

###Directory structure

---

 ├── build // Build service and webpack configuration ├── config // Configuration of different project environments ├── dist // Project build directory ├── index.html // Project entry file ├── package.json // Project configuration file ├── src // Production directory │ ├── assets // Image resources │ ├── common // Public css js resources │ ├── components // Various components │ ├── App.vue // Main page 
│ ├── vuex // vuex state manager │ ├── router.js // Router configurator │ └── main.js // Webpack precompiled entry

###Function implemented

---

• waterfall flow layout
• infinite scroll
• Side navigation
• Lazy loading of images
• Slide left or right to switch
• etc.

Features being implemented

---

• pull-up loading
• search
• my collection
• Log in
• etc.

at last

---

• Another open source project of mine, Ele.me app (already has 400+ stars)
• If you like it, be sure to star it!!! (Thank you!!)
• If you have any comments or questions, please submit them in lssues and I will answer them online.
• I will be leaving my job after this year. If you are interested in me, please contact me with my resume.