解决:在单项目组件里面引入 base.scss/ base.less 等的外部文件不成功的问题

news/2025/1/13 11:46:14/

1、问题展示:

其一、问题描述:
在单文件组件里面使用封装在 base.scssbase.less 里面的样式用法一直不成功;

其二、代码:
// 虽然已经标明了用的是 scss 的语法,但是页面调用 .scss 里的 style 样式还是不成功


<style rel="stylesheet/scss" lang="scss" scoped>
</style>

其三、页面展示:

// 页面没有样式效果
在这里插入图片描述

2、问题分析:

其一、写 .scss 样式的文件没有在 main.js 中引用;

其二、或没有在 main.js 引用的 .scss 文件中写相关样式(即:其实是一码事);

3、解决过程:

其一、(以 sass(scss) 为例)首先看下项目中是否引入了 sasssass-loader,若未引入,那么是肯定不能使用 .scss 文件的,那么样式肯定不生效;

在这里插入图片描述

其二、不存在 其一 的情况下main.js 中引入的 .scss 文件里面写相关的样式;

其三、不存在 其一 的情况下 或将写样式的 .scss 文件在 main.js 里面再引入一下;

在这里插入图片描述
在这里插入图片描述
其四、页面显示为:
// 表示写的样式已生效(注意:scss/less 语言都是这样操作);
在这里插入图片描述

4、小结:

其一、哪里有不对或不合适的地方,还请大佬们多多指点和交流!
其二、有兴趣的话,可以多多关注这个专栏(Vue(Vue2+Vue3)面试必备专栏):https://blog.csdn.net/weixin_43405300/category_11525646.html?spm=1001.2014.3001.5482


http://www.ppmy.cn/news/80468.html

相关文章

十几年老员工提出的五条有效沟通的建议

作为一个职场老手&#xff0c;我深知有效沟通对于职业生涯的重要性。以下是我为职场新人提出的一些关于有效沟通的建议&#xff1a; 倾听对方的意见和建议 在职场上&#xff0c;我们需要与同事、领导或客户进行沟通。在沟通中&#xff0c;我们不仅要表达自己的意见和看法&…

MyBatis-Plus02 条件构造器QueryWrapper、UpdateWrapper、Condition、LambdaQuery用法详解

目录 ①. 条件构造器与常用的接口 ②. QueryWrapper ③. UpdateWrapper ④. Condition——简化代码开发 ⑤. LambdaQueryWrapper ⑥. LambdaUpdateWrapper ①. 条件构造器与常用的接口 ①. Wrapper介绍&#xff1a; 条件构造器&#xff08;Wrapper&#xff09;的作用&…

雷达中的无源和有源的区别

常规雷达探测目标时&#xff0c;需要源源不断地发射无线电波&#xff0c;所以叫有源雷达( active radar)。有源雷达的优点是能自主搜索目标&#xff0c;因为它接收的是自己发射的电磁波&#xff0c;所以灵敏度高&#xff0c;分辨率好。但这种雷达易受目标的电磁干扰&#xff0c…

干货 | 利用SPSS进行高级统计分析第三期

Hello&#xff0c;大家好&#xff01; 这里是壹脑云科研圈&#xff0c;我是喵君姐姐~ 在本期中&#xff0c;我们继续为大家介绍如何利用SPSS进行&#xff1a;单因素方差分析、多因素方差分析、重复测量方差分析等。 1. 单因素方差分析【组间实验单一因变量&#xff1b;进行差…

MyBatis-Plus_04 代码生成器、多数据源(主从)、MyBatisX插件

目录 ①. 代码生成器 ②. 多数据源&#xff08;主从&#xff09; ③. MyBatisX ①. 代码生成器 添加代码生成器依赖 <dependency><groupId>com.baomidou</groupId><artifactId>mybatis-plus-generator</artifactId><version>3.5.1&…

APP 跳转微信小程序和回调

在同一开放平台账号下的移动应用及小程序无需关联即可完成跳转&#xff0c;非同一开放平台账号下的小程序需与移动应用&#xff08;APP&#xff09;成功关联后才支持跳转。 可在“管理中心-移动应用-应用详情-关联小程序信息”&#xff0c;为通过审核的移动应用发起关联小程序…

第四章 matlab的循环结构

循环(loop)是一种 matlab 结构,它允许我们多次执行一系列的语句。循环结构有两种 基本形式:while 循环和 for 循环。两者之间的最大不同在于代码的重复是如何控制的。在 while 循环中,代码的重复的次数是不能确定的,只要满足用户定义的条件,重复就进行下 去。相对地,在 fo…

分布式事务与分布式锁区别及概念学习

一、 分布式事务 1.1 背景 传统事务ACID是基于单数据库的本地事务,仅支持单机事务,并不支持跨库事务。但随着微服务架构的普及,业务的分库分表导致一个大型业务系统往往由若干个子系统构成,这些子系统又拥有各自独立的数据库。往往一个业务流程需要由多个子系统共同完成,…