Uniapp zero-based development study notes (11) - Install the extension component uni-ui/uView and WeChat applet development environment

Uniapp zero-based development study notes (11) - Install the extension component uni-ui/uView and WeChat applet development environment

1. Install the extension component uni-ui

uni-ui is an official extension component developed by the uni-app team, which is more powerful and easier to use than the basic component.
Introduction document:
https://uniapp.dcloud.net.cn/component/uniui/uni-ui.html
Instructions for use:
Follow the component sample code of the sample file and enter it directly.
Installation method:
1. Tools->Plug-in installation->Install new plug-in->Go to the plug-in market to install...
Insert image description here
2. Select "Front-end Components" to search for uni-ui
Insert image description here
3. Click Download in the results
Insert image description here
4. Follow the instructions to install the plug-in or import the sample project a>
Insert image description here

2. Install the extension component uView

uView author: uViewUI, the plug-ins are richer and very beautiful, and the installation and usage methods are similar to uni-ui. Select "Front-end Components" and search for uView.
Introduction document:
https://www.uviewui.com/components/intro.html
Insert image description here
Below the introduction document, There are instructions for using each component, and the introduction is more detailed and user-friendly than uni-ui.
For example, the use of u-image.
https://www.uviewui.com/components/image.html

<u--image :showLoading="true" :src="src" width="80px" height="80px" @click="click"></u--image>

Warm reminder:
Since uView’s built-in styles are all written in scss files, when you use them, please make sure to add lang=" to the style tag of the page. ;scss" attribute, otherwise an error may be reported.

3. Install the WeChat applet development environment

WeChat mini program development tool download page:
https://developers.weixin.qq.com/miniprogram/dev/devtools/stable.html
Insert image description here
Run the mini program development environment:
Insert image description here
Set the directory where the "WeChat web developer tools" is located as the tool installation directory
Insert image description here
Insert image description here
Open the service port in the settings.
Insert image description here
Then "run to mini program simulator" again to compile the WeChat mini program.
Insert image description here

Guess you like

Origin blog.csdn.net/qq_43662503/article/details/127524176