uniapp引入uview-ui组件库详细步骤

uview官方文档：https://www.uviewui.com/

第一步：安装node-scss

npm i node-sass -D

第二步：安装 sass-loader，注意需要版本10，否则可能会导致vue与sass的兼容问题而报错

npm i sass-loader@10 -D

第三步：安装uview-ui 组件库

npm install uview-ui

第四步：在main.js 引入uview组件库(在src目录中的main.js)-----一定要放在import Vue之后

import uView from "uview-ui";

Vue.use(uView);

第五步：在引入uView的全局 SCSS 主题文件(在src目录中uni.scss中引入)

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

第六步：引入uview基础样式(在APP.vue首行的位置引入，给style标签加入lang=‘scss’属性)

@import "uview-ui/index.scss";

第七步：配置easycom 组件模式(在src目录中的pages.json中)----确保您的pages.json中只有一个easycom字段，否则请自行合并多个引入规则。

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

（第八步：如果是vue-cli模式的项目，还需要在根目录的vue.config.js文件进行配置）

// vue.config.js，如没有此文件则手动创建
module.exports = {
    transpileDependencies: ['uview-ui']}

问题总结：

npm下载报错:可以尝试cnpm下载，要确定是在项目的目录中打开的 cmd 或者 poweshell ！！