uni-app初步搭建引入uview库跨移动多端ui库

uView是uni-app生态专用的UI框架，uni-app 是一个使用 Vue.js 开发所有前端应用的框架，开发者编写一套代码， 可发布到iOS、Android、H5、以及各种小程序(微信/支付宝/百度/头条/QQ/钉钉)等多个平台(引言自uni-app网)

1. 查看项目根目录有没有package.json，如果没有执行一下命令：

npm init -y

2. 安装

npm install uview-ui@2.0.31 

3.在uniapp项目的main.js文件里引入

import uView from "uview-ui";

Vue.use(uView); 

4.uniapp项目的uni.scss文件下引入

@import 'uview-ui/theme.scss';

5.在App.vue中首行的位置引入，注意：给style标签加入lang="scss"属性

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

6.pages.json文件里进行配置，添加easycom属性

1.  
   {
2.  
   "easycom": {
3.  
   "^u-(.*)": "uview-ui/components/u-$1/u-$1.vue"
4.  
   },
5.  
    
6.  
   // 此为本身已有的内容
7.  
   "pages": [
8.  
   // ......
9.  
   ]
10.  
    }

7.最后在vue单文件的html层就可以直接使用uview组件了

这篇好文章是转载于：学新通技术网