uni-app引入uview-plus_uniapp引入uview-plus

我用了uni-app插件市场中的uview-plus，发现文档不适合我这种小白,导致引入后使用组件各种报错，记录下解决过程

引入流程

        导入插件到项目

使用插件

0.在pages.json配置easycom规则，如果是按需导入则不需要，

{
	"pages": [ //pages数组中第一项表示应用启动页
		{
			"path": "pages/index/index",
			"style": {
				"navigationStyle": "custom"
			}
		}
	],
	"easycom": {
		"custom": {
			"^u--(.*)": "@/uni_modules/uview-plus/components/u-$1/u-$1.vue",
			"^up-(.*)": "@/uni_modules/uview-plus/components/u-$1/u-$1.vue",
			"^u-([^-].*)": "@/uni_modules/uview-plus/components/u-$1/u-$1.vue"
		}
	},
	"uniIdRouter": {}
}

1.在main.js引入插件

import uviewPlus from '@/uni_modules/uview-plus'
import {
	createApps
} from 'vue'
export function createApp() {
	const app = createApps(App)
	app.use(uviewPlus)
	return {
		app
	}
}

 2.uni.scss引入theme.scss文件

@import '@/uni_modules/uview-plus/theme.scss';

3.在App.vue引入index.scss,注意style要加 lang="scss"

<script>
	export default {
		onLaunch: function() {
			console.log('App Launch')
		},
		onShow: function() {
			console.log('App Show')
		},
		onHide: function() {
			console.log('App Hide')
		}
	}
</script>
 
<style lang="scss">
	/*每个页面公共css */
	@import "@/uni_modules/uview-plus/index.scss";
</style>