## 为HBuilder安装scss插件
## 一、安装方式
在文件根目录下打开cmd,执行安装命令
```
npm init -y
npm install uview-ui
npm update uview-ui
```
## 二、引入组件库
```
import uView from 'uview-ui';
Vue.use(uView);
```
## 三、main.js中引入
~~~
import uView from "uview-ui";
Vue.use(uView);
~~~
## 四、在引入uView的全局SCSS主题文件
在项目`src`目录的`uni.scss`中引入此文件。
~~~
/* uni.scss */
@import 'uview-ui/theme.scss';
~~~
## 五、引入uView基础样式
注意!
在`App.vue`中**首行**的位置引入,注意给style标签加入lang="scss"属性
~~~
<style lang="scss">
/* 注意要写在第一行,同时给style标签加入lang="scss"属性 */
@import "uview-ui/index.scss";
</style>
~~~
## 六、配置easycom组件模式
此配置需要在项目`src`目录的`pages.json`中进行。
温馨提示
1、uni-app为了调试性能的原因,修改`easycom`规则不会实时生效,配置完后,您需要重启HX或者重新编译项目才能正常使用uView的功能。
2、请确保您的`pages.json`中只有一个`easycom`字段,否则请自行合并多个引入规则。
~~~
// pages.json
{
"easycom": {
"^u-(.*)": "uview-ui/components/u-$1/u-$1.vue"
},
// 此为本身已有的内容
"pages": [
// ......
]
}
~~~