前言

        用习惯了webstrom再使用HbuilderX总感觉有点奇怪.今天学完了uniapp总想搞点事情.对于前端不太强的我来说前端的框架必须配合UI库才是有灵魂的(可能我太菜了),就像Vue+Element-ui,同样uniapp也可以配合一些好的组件库啊,刚认识uniapp的我就找啊找啊,找到了uView-ui,那就开始配吧.

---

开搞

1.在HbuilderX上新建一个uniapp项目

2.uView-ui官网地址

uView-ui官网

3.下载

4.将下载好的zip压缩包解压后放进项目中

5.在main.js中添加uView

import uView from "uview-ui";
Vue.use(uView);

6.在uni.scss中添加

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

如果不支持就要下载scss插件

7.在pages.json中配置

    "easycom": {//uni-app为了调试性能的原因，修改easycom规则不会实时生效，配置完后，您需要重启HX或者重新编译项目才能正常使用uView的功能。
            "^u-(.*)": "@/uview-ui/components/u-$1/u-$1.vue"
        },

8.App.vue中全局配置

<style lang="scss">
    /*每个页面公共css */
    @import 'uview-ui/index.scss';
</style>

9.重启HbuilderX或者重新编译项目

10.测试

成功!!!!!!

---

注:

        1.后端接口只适用于h5,对小程序不使用

        2.我用npm install uview-ui装的不知道为什么不能用,就下载用了