Wechat applet introduces Uview

1. Create a small program

1. Use Hbuilder to create a small program project, and the template is blank.

 2. Install Uview

Install directly in the form of uni_modules in the uni-app plug-in market, select the import plug-in using HBuilderX under the uni_modules version in the upper right corner of the uni-app plug-in market, and import it into the corresponding project

Address: Uview2.0 download address

 3. Configure Uview

1. Introduce Uview

In the main.js in the root directory of the project, import and use the uView JS library. Note that these two lines should be placed after import Vue.

// main.js
import uView from '@/uni_modules/uview-ui'
Vue.use(uView)

2. Import the global SCSS theme file of uView

Introduce this file in uni.scss in the project root directory.

/* uni.scss */
@import '@/uni_modules/uview-ui/theme.scss';

3. Introduce uView basic style

Introduce it at the first line in App.vue, pay attention to add the lang="scss" attribute to the style tag

<style lang="scss">
	/* 注意要写在第一行,同时给style标签加入lang="scss"属性 */
	@import "@/uni_modules/uview-ui/index.scss";
</style>

4. Run on WeChat developer tools

Find the manifest.json file, select the WeChat applet configuration, fill in the AppID of your own WeChat applet, and check ES6 to ES5 below

All set up and ready to use

Guess you like

Origin blog.csdn.net/weixin_61964186/article/details/129496613