vk-uview-ui组件配置报错：SassError: Undefined variable: “$u-type-primary-light“.

最新推荐文章于 2024-06-13 09:43:50 发布
最新推荐文章于 2024-06-13 09:43:50 发布
阅读量1.3k 收藏
点赞数 1
文章标签： vue.js 前端 javascript
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/pollotui/article/details/131789733
版权

我在尝试使用uview时也出过类似的报错，但是没解决，可能是uview2不支持vue3的原因，于是我切换了vk-uview-ui组件，但是按照官网文档配置报以上错误。

解决方法：

我这里原因是路径错误引入失败，导致组件在使用全局变量时找不到，在uni.scss中正常引入即可。我是这样理解的，若有错误欢迎大佬指正

 

pollotui
关注
  • 1
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
change-uview:修改uview-ui组件的组价
03-23
本文将详细讨论如何修改uview-ui组件，特别是将其选项卡组件改为竖向导航，以及如何利用GitHub上的GitPengrui/chage-uview资源。 首先，`uview-ui`是一个广受欢迎的Vue.js UI组件库，提供了丰富的前端界面元素，...
uview3.0前端框架图片组件上传到VFP后端接收
加菲猫的VFP
07-21 504
最近猫猫用的uview3.0框架，基于Uni-app平台的，虽然叫3.0却是基于uview1.8.3开发的。vk-uview-ui 是 VK 基于 uview-ui 1.8.3 版本改造而来，其本质依然还是 uview-ui，是 VK 的珍藏版，由 VK 维护。uview-ui 是 vk-unicloud 快速开发框架 之 client端框架 中推荐的UI，很多 VK框架 用户都在用 uview-...
3.安装uview组件
不蒸馒头曾口气的博客
03-12 982
【校园二手交易平台】（微信小程序）安装uview组件，安装sass及sass-loader
【uniapp微信小程序】初次加载时遇到的问题
最新发布
m0_45361676的博客
06-13 365
uni-app引入uview-plus报错SassError: Undefined variable: “$u-primary“
【react+ts】找不到less类型,Cannot find module ‘./xxx.module.less‘ or its corresponding type declarations
我的开源项目:https://gitee.com/derekgo/vue-cms_xg
01-26 5332
问题描述 Cannot find module ‘./index.module.less’ or its corresponding type declarations 找不到less后缀名的类型 解决办法 在src目录下创建类型声明文件react-app-env.d.ts，并且声明less类型 内容如下 declare module '*.module.less' { const classes: { readonly [key: string]: string }; export de
SassError: Undefined variable: “$u-type-primary“.
dandanmei0513的博客
05-24 2588
在引入uview-ui时报错：SassError: Undefined variable: “$u-type-primary“.根据官网三步走下载uview，
uniapp vue3.0 + vk-uview-ui avatar-cropper 头像裁剪功能
qq_21579949的博客
09-19 600
uniapp vue3.0 + vk-uview-ui 使用头像裁剪插件avatar-cropper
什么是 云开发以及如何安装vk-uview-ui详细方法
05-08 1205
适合开发：H5、App(vue版本)、微信小程序、支付宝小程序（其他小程序未验证）适合开发：App(nvue版本)，如果你只开发App的vue2版本，推荐用这个UI。适合开发：App(非nvue版本)、H5、微信小程序、支付宝小程序、头条小程序等。目录复制到你的VK框架项目（client端）根目录（与App.vue同级目录）目录复制到你的VK框架项目（client端）根目录（与App.vue同级目录）适合开发：H5、App(vue版本)、微信小程序（其他小程序未验证）H5、微信小程序、支付宝小程序等。
uni-app+Vue3+pinia+uview-plus搭建的项目包
12-28
uni-app+Vue3+pinia+uview-plus搭建的项目包！uni-app+Vue3+pinia+uview-plus搭建的项目包！uni-app+Vue3+pinia+uview-plus搭建的项目包！uni-app+Vue3+pinia+uview-plus搭建的项目包！uni-app+Vue3+pinia+uview-...
uniapp uView u-picker组件三级联动Demo
02-12
- 1、分2个入口：一个添加，一个编辑（编辑涉及到数据回显） - 2、添加的时候，展示的数据是默认的，是上一列第一行数据的详情（所有的年级（第一列），一年级对应的班（第二列），一班对应的学生（第三列）） ...
uni-app+color-ui+uview-ui 搭建的H5端初始demo
04-09
【标题】"uni-app+color-ui+uview-ui 搭建的H5端初始demo"涉及的关键技术点包括： 1. **uni-app**：uni-app 是由ECharts团队开发的一个跨端框架，允许开发者编写一次代码，可以同时在iOS、Android、Web（H5）、微信...
uview中u-picker实多级选择.zip 下载即用
10-24
只需要复制组件框架，data中定义的数据，以及methods中的方法即可实现； 兄弟们，不敢骗你们，我找了好久，好多假的，没效果的，不如直接下载我的， 有问题可随时联系，不容易，找了几天u-picker三级联动的使用方法...
在引入uview-ui时报错：SassError: Undefined variable: “$u-type-primary“.
weixin_50500741的博客
01-18 2310
在引入uview-ui时报错：SassError: Undefined variable: "$u-type-primary".
vue3使用vscode写uniapp引入uview-ui组件
poguanba的博客
10-14 2082
同时支持 Vue3.0 和 Vue2.0，你没看错，现在 uView 支持 Vue3.0 了！（不支持nvue，此版本为uView1.0的分支）【开箱即用】uView Vue3 横空出世，继承uView1意志，再战江湖，风云再起！- DCloud 插件市场。好啦，按照以上配置，就可以直接在页面上使用了。这个级支持vue2，也支持vue3。
uni-app项目搭建（vue-cli）
qq_45631770的博客
01-18 2725
本文介绍使用脚手架的方式来搭建uni-app项目，包括安装环境、安装项目、运行打包项目、配置@别名、安装sass预编译器、安装vk-uview-ui、安装tailwindcss、引入自动导入插件
使用uview-ui遇见SassError: Undefined variable: “$u-type-primary-light“.已解决
qq_42877655的博客
03-23 2万+
在项目根目录的uni.scss中引入此文件时。 先引用一下颜色文件 @import "uview-ui/theme.scss"; @import "uview-ui/index.scss";
uniapp 中出现 Undefined variable $u-type-primary-light 问题
颜良文丑的博客
06-23 1万+
引入 uview-ui 后出现 `Undefined variable: "$u-type-primary-light"` 该怎么去处理呢？
解决Vue在main.js全局引入scss文件，组件里使用scss变量报错问题
热门推荐
qq_40532145的博客
09-09 2万+
报错：Syntax Error: SassError: Undefined variable. 我一开始的引入方式是这样的： 以为在main.js全局引入了就一劳永逸，写着常规css样式时还好好的，用到scss变量时就报错了。· 解决方法一 在需要用到的 .vue 文件里单独引用 variable.scss 变量文件，but达不到我们想要的“一劳永逸“效果 可能还会有奇奇怪怪的潜在问题，建议使用方法二。 · 解决方法二 配置vue.config.js文件，使得全局都能使用sc...
【全开源】分类记账小程序系统源码（ThinkPHP+FastAdmin+UniApp）
2401_84413757的博客
05-25 1106
分类记账小程序系统源码作为财务管理的新工具，为个人和企业提供了高效、便捷、智能的财务管理服务。未来，随着技术的不断发展和创新，分类记账小程序系统源码将继续为财务管理领域注入新的活力。分类记账小程序系统源码应运而生，为个人和企业提供了一个高效、便捷、智能的财务管理工具。基于ThinkPHP+FastAdmin+UniApp+vk-uView-ui+Vue3.0开发的一款支持多人协作的记账本小程序，可用于家庭，团队，组织以及个人的日常收支情况记录，支持周月年度统计。
0:12:54.816 Module build failed (from ./node_modules/@dcloudio/vue-cli-plugin-uni/packages/sass-loader/dist/cjs.js): 10:12:54.821 SassError: Undefined variable: "$u-type-primary". 10:12:54.821 on line 206 of D:\ideaWorkSpace\ehl-wx\node_modules\uview-ui\components\u-badge\u-badge.vue 10:12:54.826 >> background-color: $u-type-primary; 10:12:54.833 --------------------^ 10:12:54.839 Module build failed (from ./node_modules/@dcloudio/vue-cli-plugin-uni/packages/sass-loader/dist/cjs.js): 10:12:54.844 SassError: Undefined variable: "$u-type-primary". 10:12:54.849 on line 309 of D:\ideaWorkSpace\ehl-wx\node_modules\uview-ui\components\u-checkbox\u-checkbox.vue 10:12:54.856 >> background-color: $u-type-primary; 10:12:54.860 ---------------------^ 10:12:54.865 Module build failed (from ./node_modules/@dcloudio/vue-cli-plugin-uni/packages/sass-loader/dist/cjs.js): 10:12:54.871 SassError: Undefined variable: "$u-type-primary". 10:12:54.876 on line 350 of D:\ideaWorkSpace\ehl-wx\node_modules\uview-ui\components\u-icon\u-icon.vue 10:12:54.880 >> color: $u-type-primary; 10:12:54.885 ----------^ 10:12:54.889 Module build failed (from ./node_modules/@dcloudio/vue-cli-plugin-uni/packages/sass-loader/dist/cjs.js): 10:12:54.894 SassError: Undefined variable: "$u-type-primary". 10:12:54.894 on line 432 of D:\ideaWorkSpace\ehl-wx\node_modules\uview-ui\components\u-button\u-button.vue 10:12:54.900 >> border-color: $u-type-primary; 10:12:54.905 ----------------^ 10:12:54.909 Module build failed (from ./node_modules/@dcloudio/vue-cli-plugin-uni/packages/sass-loader/dist/cjs.js): 10:12:54.914 SassError: Undefined variable: "$u-type-primary". 10:12:54.919 on line 721 of D:\ideaWorkSpace\ehl-wx\node_modules\uview-ui\components\u-picker\u-picker.vue 10:12:54.925 >> color: $u-type-primary;解决
07-14
这个错误是因为在编译uview-ui组件时，找不到对应的Sass变量"$u-type-primary"。要解决这个问题，你可以尝试以下步骤： 1. 确保你已经正确引入了uview-ui组件，并且按照官方文档的要求进行了配置。 2. 检查你的项目中是否已经安装了Sass相关的依赖。可以通过运行`npm install sass-loader node-sass`来安装这些依赖。 3. 确保在你的项目中正确配置了Sass的loader。可以在项目的webpack配置文件或vue.config.js文件中添加相应的配置，确保Sass能够正确加载和解析。 4. 检查一下uview-ui版本和你当前项目的版本是否兼容。有时候不同版本之间的变量命名可能会有所不同，需要进行相应的调整。 5. 如果以上步骤都没有解决问题，可以尝试手动定义变量"$u-type-primary"并给它赋值。你可以在项目中的Sass文件或者全局样式文件中添加以下代码： ```scss $u-type-primary: #xxxxxx; // 替换为你想要的颜色值，如"#333333" ``` 替换"#xxxxxx"为你想要的颜色值。然后重新编译项目，看看是否解决了问题。 如果问题仍然存在，建议查看uview-ui的官方文档或在相关社区寻求帮助，以获取更详细的解决方案。
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值