创建uni-app+uView+扩展组件项目

1. 创建uni-app项目

2.安装uni-app扩展组件

（1）按需引入：找到需要安装的组件（如数字角标）

如果遇到导入不了的问题就重装uni_modules插件即可

导入成功的效果

（2）整个组件导入

（3）如果遇到导入不了的问题就重装uni_modules插件即可

（4）使用组件

直接在需要用到组件的地方使用无需再引入

3.安装uView

（1）安装

npm install uview-ui@2.0.31
//版本最好不要太新，不然没效果
// 更新
// npm update uview-ui

（2）插件引入

1. 在uni.scss文件中引入

@import '@/node_modules/uview-ui/theme.scss';
// 注意确保文件路径正确,安装的时候可能是安装在uni_modules

1. 在pages.json文件中

{
    "easycom": {//匹配规则
        "^u-(.*)": "@/node_modules/uview-ui/components/u-$1/u-$1.vue"
    },
    "pages": [ //pages数组中第一项表示应用启动页，参考：https://uniapp.dcloud.io/collocation/pages
        {
            "path": "pages/index/index",
            "style": {
                "navigationBarTitleText": "uni-app"
            }
        }
    ],
    "globalStyle": {
        "navigationBarTextStyle": "black",
        "navigationBarTitleText": "uni-app",
        "navigationBarBackgroundColor": "#F8F8F8",
        "backgroundColor": "#F8F8F8"
    },
    "uniIdRouter": {}
}

3.在main.js中

import uView from '@/node_modules/uview-ui'//在import Vue from 'vue'下引入uView
Vue.use(uView)

4.在App.vue文件中进行样式的全局挂载

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

5.使用组件

直接在需要用到组件的地方使用无需再引入