在vite+vue3中使用less

news2024/12/23 18:50:01

目录标题

  • 一、首先,安装插件
  • 二、在 vite.config.js中配置
  • 三、最后在模版里声明css类型

一、首先,安装插件

npm install less
npm install less-loader

在这里插入图片描述

二、在 vite.config.js中配置

css: {
    preprocessorOptions: {
      less: {
        math: "always", // 括号内才使用数学计算
        globalVars: {
          // 全局变量
          mainColor: "red",
        },
      },
    },
  },

三、最后在模版里声明css类型

<style lang="less" scoped>
.demo-pagination-block {
  position: fixed;
  bottom: 180px;
  right: 50px;
  .home{
    background-color: pink;
  }
}
</style>

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/689030.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

VS里拉取时候,变成变基中,变成分离分支状态,git 头指针分离于 baf67ff

分离头指针&#xff08;detached HEAD&#xff09; 通常&#xff0c;我们工作在某一个分支上&#xff0c;比如 master 分支。这个时候 master 指针和 HEAD 指针是一起前进的&#xff0c;每做一次提交&#xff0c;这两个指针就会一起向前挪一步。但是在某种情况下&#xff08;例…

docker搭建达梦数据库

搭建达梦数据库 搭建达梦数据库 拉取镜像 # 拉取镜像 docker pull registry.cn-shanghai.aliyuncs.com/techerwang/dbhub:jem_dm8 或去官网下载 https://eco.dameng.com/document/dm/zh-cn/start/dm-install-docker.html我是选择了去官网下载 然后上传到linux服务器 do…

Selenium教程__按钮的点击、文本框的输入和清除操作(3)

from selenium import webdriverdriver webdriver.Chrome() driver.maximize_window() driver.get("https://www.baidu.com")# 定位元素 input_box driver.find_element_by_id("kw") search_btn driver.find_element_by_id("su")# sen_keys&a…

pycharm修改文件大小限制

场景&#xff1a; 方法&#xff1a; 打开pycharm 安装目录下的idea.properties 增加配置项&#xff1a;idea.max.intellisense.filesize99999

电脑word如何转化为pdf格式,其实非常简单!

作为一名在职场工作多年的资深达人&#xff0c;我们都知道工作中常常需要转换各种文件格式&#xff0c;其中最常见的就是Word文档和PDF文档。有时候根据领导、客户或甲方的要求&#xff0c;我们需要进行格式转换&#xff0c;尤其是将Word转换为PDF格式。PDF格式的文件不仅方便阅…

Spring基础知识(四)

目录 1.Spring包含的模块主要有什么 2.Core Container的作用 3.Data Access/Integration模块的作用 4.AOP模块的作用 5.Spring Web模块的作用 6.Test模块的作用 7.如何将一个类声明为Bean 8.Component和Bean的区别 9.能够注入Bean的注解有什么 10.Resource注解 1.Spr…

【Java】Java 中格式化字符串:String.format() 方法

本文仅供学习参考&#xff01; 相关文章地址&#xff1a; https://www.cnblogs.com/Dhouse/p/7776780.html https://www.javatpoint.com/java-string-format https://www.geeksforgeeks.org/java-string-format-method-with-examples/ 前言 虽然System.out.println()适合调试和…

5 STM32复位和时钟控制

STM32的复位功能 系统复位&#xff1a; 系统复位将复位除时钟控制寄存器CSR中的复位标志和备份区域中的寄存器以外的所有寄存器为它们的复位数值。&#xff08;按键复位和软件复位属于系统复位&#xff09; 电源复位&#xff1a; 电源复位将复位除了备份区域外的所有寄存器。…

【Flink】DataStream API使用之转换算子(Transformation)

转换算子&#xff08;Transformation&#xff09; 数据源读入数据之后&#xff0c;就是各种转换算子的操作&#xff0c;将一个或者多个DataSream转换为新的DataSteam&#xff0c;并且Flink可以针对一条流进行转换处理&#xff0c;也可以进行分流或者河流等多流转换操作&#xf…

sql with子语句的理解

在用sqlite时&#xff0c;用到了with子语句&#xff0c;记录下对其的理解 目的&#xff1a;在1个字段中找到真正包含的数据&#xff0c;一般用于like&#xff0c;但该字段可能是复杂的字符串数组。 例子数据&#xff0c;如&#xff1a; 【E2806894200050010B93C473,123456】…

软件分享:Cpu-Z电脑CPU检测工具介绍(附下载)

目录 一、软件介绍 二、功能介绍 三、使用方法 1、通过 CPU-Z 查看 CPU 信息 2、缓存信息 3、主板信息 4、内存信息 5、内存规格信息&#xff08;SPD&#xff09; CPU是计算机中负责读取指令&#xff0c;对指令译码&#xff0c;并执行指令的核心部件。CPU自产生以来&am…

chatgpt赋能python:用Python计算BIM:优点、应用和结论

用Python计算BIM&#xff1a;优点、应用和结论 Building Information Modeling&#xff08;BIM&#xff09;是一种数字化的建筑设计和施工方法&#xff0c;它包括从建筑物的设计、施工到维护和拆除的整个生命周期。BIM在大规模工程建设中越来越受到欢迎&#xff0c;Python编程…

单片机强排热水器方案

单片机强排热水器方案 MCU型号 MM32SPIN05TW、MM32SPIN080C 产品概述 MM32SPIN05TW本产品使用高性能的ArmCortex-M0为内核的32位MCU&#xff0c;最高工作频率可达72MHz&#xff0c;内置高速存储器&#xff0c;丰富的I/O端口和外设连接到外部总线。本产品包含1个12位ADC、1个比…

【群智能算法改进】基于二次插值策略的改进白鲸优化算法 改进后的EBWO[3]算法【Matlab代码#44】

文章目录 【获取资源请见文章第5节&#xff1a;资源获取】1. 原始BWO算法2. 基于二次插值策略的EBWO算法3. 部分代码展示4. 仿真结果展示5. 资源获取 【获取资源请见文章第5节&#xff1a;资源获取】 1. 原始BWO算法 白鲸优化算法 (BWO&#xff0c;beluga whale optimization)…

宝塔SSL续签以及申请报CURL(7)与CURL(28)错误解决方案

说一下具体背景以及遇到的问题&#xff1a; 主要是网站的SSL过期以后&#xff0c;点击宝塔里的续签功能&#xff0c;弹出一个黑框&#xff0c;等超时后报以下错误 其中也尝试过很多方法&#xff0c;都没什么用&#xff0c;当然&#xff0c;如果报错信息不是这类情况&#xff…

3D开发工具HOOPS可构建PLM程序,数据共享更便捷

产品生命周期管理 (PLM) 解决方案实际上都是将制造生产系统粘合在一起的粘合剂&#xff0c;提供从头到尾的数字主线并为最终用户优化流程。 Tech Soft 3D不是构建 PLM 应用程序的专家&#xff0c;但却对构建领先应用程序所基于的组件技术&#xff0c;以及 SDK 如何提供必要的核…

MiniGPT-4原理解读——大模型论文阅读笔记三

论文&#xff1a;https://arxiv.org/pdf/2304.10592v1.pdf 代码&#xff1a;https://github.com/vision-cair/minigpt-4 一. 作者动机 GPT-4展示了非凡的多模态能力&#xff0c;比如直接从手写文本生成网站&#xff0c;以及识别图像中的幽默元素。这些特性在以前的视觉语言模…

Scrum敏捷看板工具在项目管理中的作用

Scrum是迭代式增量软件开发过程&#xff0c;是敏捷方法论中的重要框架之一&#xff0c;通常用于敏捷软件开发。 当开发团队在用 Scrum 这种开发方法开发项目时&#xff0c;可以利用敏捷看板&#xff0c;可视化透明且灵活的高效的完成工作。 使用敏捷看板可以使&#xff1a; …

ChatGPT批量生成文章软件:创意无限,助力高效创作

随着人工智能技术的不断发展&#xff0c;ChatGPT批量生成文章软件成为了一种强大的创作工具。这款软件以其无限创意和高效助力&#xff0c;极大地提升了文章创作的效率。在本文中&#xff0c;我们将从多个方面详细阐述ChatGPT软件的特点和优势。 一、智能创作能力 ChatGPT软件…

2023年5月青少年机器人技术等级考试理论综合试卷(一级)

青少年机器人技术等级考试理论综合试卷&#xff08;一级&#xff09;2023.6 分数&#xff1a; 100 题数&#xff1a; 45 一、 单选题(共 30 题&#xff0c; 共 60 分) 1.机器人的电源相当于人类的&#xff1f; &#xff08; &#xff09; A.大脑 B.皮肤 C.血管 D.心脏 标准答案…