How to make a uni-app project? Process explanation

How to make a uni-app project? This article will give you a systematic explanation of the process of making a uni-app. I hope it will be helpful to you!

The process of making a uni-app:

Contains a large number of current front-end essential skills, such as vue, WeChat applet , component encapsulation, mobile gesture encapsulation, data paging, axios, moment, flex layout, sass, video playback, video download and other functions. [Related recommendations: "uniapp tutorial"]

1. Introduction to uni-app

1.1 What is uni- app

uni-app is a framework that uses vue.js syntax to develop all front-end applications

can develop various things

It is also called full-end Development framework

2. uni-app basics

2.1 Basic knowledge

• First experience of uni-app
• Project structure introduction
• Style and sass
• Basic syntax
• Events
• Components
• Lifecycle

3. Basics first, then projects

The required technology stack is

• html
• css
• JavaScript
• vue
• WeChat applet
• uni-app
• uni-ui
• uni-api
• moment.js
• gesture encapsulation

4. Use scaffolding to build the project

1. Global Install

npm install -g @vue/cli

2. Create project

vue create -p dcloudio/uni-preset-vue my-project

3. Start project (WeChat applet)

npm run dev:mp-weixin

4. WeChat applet developer tool import project

Remember to enter the root directory

4.1 Project directory

# #4.2 Style and sass

supports rpx of mini programs and vw and vh of h5
has built-in sass configuration, you only need to install the corresponding dependencies Just "npm install sass-loader node-sass "
In the vue component, add the attribute "