Java教程

uni-app 引入uView步骤

本文主要是介绍uni-app 引入uView步骤,对大家解决编程问题具有一定的参考价值,需要的程序猿们随着小编来一起学习吧!

第一步:在uni-app新建的项目中  使用CMD下载uView   

npm install uview-ui

第二步:在main.js里引入和注册uView  这两句代码需要在import Vue之后

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

第三步:在uni.scss文件中引入uView的全局Scss主题文件

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

第四步:在App.vue文件中引入全局共用的scss文件

<style lang="scss">
    /* 写在第一行,style标签需要加入lang="scss" */
    @import "uview-ui/index.scss";
</style>

第五步:在pages.json中设置下面代码

{          // 在这里添加uview组件配置模式
    "easycom": {
        "^u-(.*)": "uview-ui/components/u-$1/u-$1.vue"
    },
    
    // 下面是项目本来有的pages 
    "pages": [
        // ......
    ]
}

第六步:uniapp引入uView必需依赖scss 必须要安装此插件,在uniapp的插件市场里安装scss  如果有 则忽略此步

第七步:就可以在uni-app中正常使用uView的组件了

这篇关于uni-app 引入uView步骤的文章就介绍到这儿,希望我们推荐的文章对大家有所帮助,也希望大家多多支持为之网!