uni-app 和 Vue2 项目中安装 uViewUI

165 阅读1分钟

1、安装命令

npm install uview-ui@2.0.38

2、在 main.js 中引入并配置

import uView from 'uview-ui'
Vue.use(uView)
// 如此配置即可
uni.$u.config.unit = 'rpx'

3、配置 vue.config.js

module.exports = {
    transpileDependencies: ['uview-ui'],
    
    // 要是安装4,5,6步骤配置后,不需要配置一下内容,其效果和配置了4,5,6是一样的
    
    css: {
        loaderOptions: {
            scss: {
                // 全局注入scss变量
                prependData: `@import "uview-ui/theme.scss";`
            }
        }
    }
}

4、在 App.vue 中引入基础样式

<style lang="scss">
  @import "uview-ui/index.scss";
</style>

5、在 uni.scss 中引入主题文件

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

6、确保安装 sass 依赖

npm install sass sass-loader@10 -D