hbuidler uni-app 编译scss失败

分类：uni-app

sass安装报错 sass uni_app

scss插件已经安装

项目中使用了uView，但在运行编译时报错，尝试过用npm安装sass插件也不行

hbuilder 版本是3.2.12.20211029

18:39:02.983 项目 'huitian-forestry-patrol-app' 开始编译...  
18:39:04.023 请注意运行模式下，因日志输出、sourcemap以及未压缩源码等原因，性能和包体积，均不及发行模式。  
18:39:04.024 正在编译中...  
18:39:05.158  INFO  Starting development server...  
18:39:17.434 Module build failed (from ./node_modules/sass-loader/dist/cjs.js):  
18:39:17.434 SassError: Undefined variable: "$u-content-color".  
18:39:17.437         on line 244 of D:\work\sts\huitian\patrol\huitian-forestry-patrol-app\uni_modules\uview-ui\components\u-loading-icon\u-loading-icon.vue  
18:39:17.437 >> $u-loading-icon-text-color:$u-content-color !default;  
18:39:17.439    ---------------------------^  
18:39:17.440 Module build failed (from ./node_modules/sass-loader/dist/cjs.js):  
18:39:17.441 SassError: Undefined variable: "$u-main-color".  
18:39:17.441         on line 245 of D:\work\sts\huitian\patrol\huitian-forestry-patrol-app\uni_modules\uview-ui\components\u-action-sheet\u-action-sheet.vue  
18:39:17.443 >> $u-action-sheet-title-color: $u-main-color !default;  
18:39:17.443    -----------------------------^  
18:39:17.445 Module build failed (from ./node_modules/sass-loader/dist/cjs.js):  
18:39:17.446 SassError: Undefined variable: "$u-primary".  
18:39:17.447         on line 203 of D:\work\sts\huitian\patrol\huitian-forestry-patrol-app\uni_modules\uview-ui\components\u-icon\u-icon.vue  
18:39:17.447 >> $u-icon-primary: $u-primary !default;  
18:39:17.449    -----------------^

2021-11-18 18:51 负责人:无分享

3 个回复

j***@foxmail.com

不认真看文档哦~

快速上手

main.js引入uView库

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

App.vue引入基础样式(注意style标签需声明scss属性支持)

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

uni.scss引入全局scss变量文件

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

pages.json配置easycom规则(按需引入)

// pages.json  
{  
"easycom": {  
    // npm安装的方式不需要前面的"@/"，下载安装的方式需要"@/"  
    // npm安装方式  
    "^u-(.*)": "uview-ui/components/u-$1/u-$1.vue"  
    // 下载安装方式  
    // "^u-(.*)": "@/uview-ui/components/u-$1/u-$1.vue"  
},  
// 此为本身已有的内容  
"pages": [  
    // ......  
]  
}