1、下载安装HBuilder X
2、创建项目
3、工具---插件安装--插件市场--前往插件市场安装--前端组件--通用组件--搜索(uview)--点击uview2.0(记得登录哦)
4、选择项目,进行引入uView
5、在main.js中
// 入口文件 import App from './App' // #ifndef VUE3 import Vue from 'vue' // uview-ui插件 import uView from '@/uni_modules/uview-ui' Vue.use(uView) Vue.config.productionTip = false App.mpType = 'app'
6、在app.vue中
<style lang="scss"> /*每个页面公共css */ /* 注意要写在第一行,同时给style标签加入lang="scss"属性 */ @import "@/uni_modules/uview-ui/index.scss"; </style>
7、在uni.scss中
/*导入uview的样式变量参数*/ @import '@/uni_modules/uview-ui/theme.scss';
8、在pages.json中全局引入
// 全局样式(默认样式) "globalStyle": { "navigationBarTextStyle": "black", "navigationBarTitleText": "uni-app", "navigationBarBackgroundColor": "#F8F8F8", "backgroundColor": "#F8F8F8" }, "uniIdRouter": {},
// 全局引入uview组件 "easycom": { "autoscan": true, "custom": { "^u-(.*)":"@/uni-modules/uview-ui/components/u-$1.vue" } }
9、OK完成
标签:uniapp,插件,--,uview,ui,uni,组件,import From: https://www.cnblogs.com/Life-QX/p/18022159