首页 > 其他 > 详细

在已有的项目中使用vuiew ui库

时间:2021-07-13 14:40:26      阅读:5      评论:0      收藏:0      [点我收藏+]

官方提供了三种方式,但是我觉得在已有的项目中使用是比较常见的

我在刚开始使用的时候不知道如何使用,我希望这个对大家有点帮助,特此来记录下!

我用的是创建了一个uview插件的项目,然后把里面uview-ui放到了自己项目的根目录下

技术分享图片

 

 

 uview使用的是scss,所以我们需要使用HBuilderX安装scss的插件

基本做完后,接下来开始配置

1.在main.js引入uView主JS库

 

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

 

2.在uni.scss引入这个文件

/* uni.scss */
@import ‘uview-ui/theme.scss‘;

3.在App.vue中引入uview基本样式

 

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

 

4.在pages.json easycom 组件模式配置

 

// pages.json
{
    "easycom": {
        "^u-(.*)": "@/uview-ui/components/u-$1/u-$1.vue"
    },
    
    // 此为本身已有的内容
    "pages": [
        // ......
    ]
}

 

配置全部完成,接下来就可以使用uview插件了

 

在已有的项目中使用vuiew ui库

原文:https://www.cnblogs.com/wcq520/p/15005558.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!