uniapp配置uView-UI坑

前言

        用习惯了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装的不知道为什么不能用,就下载用了
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。
禁止转载,如需转载请通过简信或评论联系作者。