less和sass

less和sass
相比于css解决了什么问题?
答案:less和sass可以嵌套,可以使用变量;而css不可以

BEM/CSS modules/Atomic CSS/CSS in JS,这些方案应用于工程化中,解决了的问题是:
多人协同/大规模场景下,css 命名冲突

BEM - 通过一些命名规范去避免命名冲突 (block__element–modifier) ,并不常用,缺点如下:

  • 不能从根本上解决这个命题
  • 命名 长 + 比较难想

所以现在用CSS Modules来解决CSS命名冲突的问题:

import styles from 'xxx.less'
styles.a => hash

以上代码中,其实styles.a的a后面有一长串的hash值,虽然不同文件中可能a相同,但是hash值不同,所以不会命名冲突。
在webpack中配置,如下图所示:
在这里插入图片描述
css modules,利用hash值保证不同文件中的css命名不冲突
缺点:用起来繁琐
在这里插入图片描述

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

如若内容造成侵权/违法违规/事实不符,请联系编程知识网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

机器人工程创新类课程补充说明-2023-2

仅供参考 之前一篇:机器人工程创新类课程补充说明-2023- 自主学习→自主研究→自主创新,这是一个循序渐进的过程,着急没用的,大部分学生,都卡在第一个阶段,自主学习的效率比较低,并且成果不突出…

vue的学习

title: VUE 一、Vue简介 1.1 简介 ::: tip Vue (读音 /vjuː/,类似于 view) 是一套用于构建用户界面的渐进式的js框架,发布于 2014 年 2 月。与其它大型框架不同的是,Vue 被设计为可以自底向上逐层应用。Vue 的核心库只关注视图层&#xff0…

数据结构--单链表的建立

数据结构–链表的建立 目标: Step 1:初始化一个单链表 Step 2:每次取一个数据元素,插入到表尾/表头 尾插法建立单链表 代码实现 typedef struct LNode {int data;struct LNode *next; }LNode, *LinkList;LinkList List_TailInsert(LinkList &L) {…

CSDN 个性化推荐系统的设计和演进

个性化推荐项目 个性化推荐的设计和演进项目概览项目梳理依赖管理实现代码的重构和改进持续演化 个性化推荐的设计和演进 CSDN 的个性化推荐系统,是从既有的推荐项目中剥离出来的一个子项目,这个项目随后移交到了我们AI组。在近一年的时间内&#xff0c…

一文梳理清楚 Python OpenCV 的知识体系

本篇文章为你详细罗列 Python OpenCV 的学习路线与重要知识点。核心分成 24 个小节点,全部掌握,OpenCV 入门阶段就顺利通过了。 1. OpenCV 初识与安装 本部分要了解 OpenCV (Open Source Computer Vision Library)的相关简介&…

深度卷积神经网络(AlexNet)

目录 1.基础简介 1.1基础介绍 1.2基础架构 2.Alexnet与LeNet的对比 3.参考代码 4.李沐老师给出的例子 1.基础简介 1.1基础介绍 2012年,AlexNet横空出世。它首次证明了学习到的特征可以超越手工设计的特征。它一举打破了计算机视觉研究的现状。 AlexNet使用…

性能测试讲解超详细Jmeter

目录 什么是性能 性能测试的目的 功能测试和性能测试 基准测试 负载测试 稳定性测试 压力测试 并发测试 总结 性能测试指标 响应时间 并发数 吞吐量 点击数 错误率 资源使用率 总结 性能测试流程 性能测试需求分析 性能测试计划和方案 ​编辑性能测试用例​编辑 性…

6应用层-6.2【实验】【计算机网络】

6应用层-6.2【实验】【计算机网络】 前言推荐6应用层知识一、DNS常用记录类型:二、nslookup命令的用法 6.1 Web服务与FTP服务配置6.2 DNS域名系统配置实验目的实验内容及实验环境实验原理实验过程1.搭建如图所示的网络拓扑2.测试网络连通性3.在服务器上启用DNS服务&…

消息模块的数据模型设计

目录 一、创建POJO映射类 1. message集合 2. message_ref集合 二、MongoDB的联合查询 MessageRef:保存消息接收人相关信息,接收人ID、消息已读未读、消息是否最新接收。 在 MongoDB 里面我们不需要预先去创建集合,只要我们往 MongoDB 里…

大模型基础之注意力机制和Transformer

【注意力机制】 核心思想:在decoder的每一步,把encoder端所有的向量提供给decoder,这样decoder根据当前自身状态,来自动选择需要使用的向量和信息. 【注意力带来的可解释性】 decoder在每次生成时可以关注到encoder端所有位置的…

Kicad编译

Windows 1.安装visual studio Pro 2019 以上版本,建议2022,自行破解,安装时一定要勾选上cmake工具;安装Git bash 2.去Gitlab上fork kicad的master分支到自己的gitlab仓库上,在本地创建kicad-source路径,初…

B站 Java相关学习资源汇总

一、计算机网络 计算机网络微课堂 https://www.bilibili.com/video/BV1c4411d7jb?p1 讲师:湖科大教书匠 评价:通俗易懂,重点知识十分细致,配合实验,而且有考研408 的难题的讲解,也是非常适合考研党&#…