vscode 插件 Tailwind CSS IntelliSense 解决 class 提示问题

问题描述:

如下写js字符串是没有class智能提示的:

const clsName = 'bg-[#123456] text-[#654321]'
return <div className={clsName}></div>

解决方案:

  1. 安装 clsx 依赖
pnpm i clsx
  1. 设置 vscode 的 settings.json
{"tailwindCSS.experimental.classRegex": [["clsx\\(([^)]*)\\)","(?:'|\"|`)([^']*)(?:'|\"|`)"]]
}

之后就有提示了
在这里插入图片描述

原理:

就是通过 Tailwind CSS IntelliSense 插件配置 "clsx\\(([^)]*)\\)" 正则匹配到了就显示提示

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

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

相关文章

判断当前设备是不是安卓或者IOS?

代码(重要点): 当前文件要是 xxx.js文件,就需要写好代码后调用才会执行: // 判断是不是安卓 const isAndroid () > {return /android/.test(navigator.userAgent.toLowerCase()); }// 判断是不是ios const isIOS () > {return /iphone|ipad|ipod/.test(navigator.use…

【Unity3D小功能】Unity3D中Text使用超链接并绑定点击事件

推荐阅读 CSDN主页GitHub开源地址Unity3D插件分享简书地址我的个人博客 大家好&#xff0c;我是佛系工程师☆恬静的小魔龙☆&#xff0c;不定时更新Unity开发技巧&#xff0c;觉得有用记得一键三连哦。 一、前言 在开发中遇到了要给Text加超链接的需求&#xff0c;研究了实现…

transformer_位置编码代码笔记

transformer_位置编码代码笔记 transformer输入的序列中&#xff0c;不同位置的相同词汇可能会表达不同的含义&#xff0c;通过考虑位置信息的不同来区分序列中不同位置的相同词汇。 位置编码有多种方式&#xff0c;此处仅记录正余弦位置编码 正余弦位置编码公式如下&#x…

关于source批量处理sql命令建立数据库后发现中文乱码问题解决方案(Mysql)

今天在使用souce建表的时候发现自己表结构中的中文出现了乱码问题&#xff0c;那么具体的解决方案如下&#xff1a; 首先我们先使用命令行连接自己的数据库 mysql -u root -p 12345 然后使用show variables like "char%"; 如果说你的这个里面不是utf-8那么就是出现了…

深度学习经典模型之BERT(下)

在"深度学习经典模型之BERT(上)"我们描述了BERT基本信息、意义、与GPT和Transformer的区别、预训练、自监督等相关信息后&#xff0c;本章节将介绍BERT的输入、Encoder、微调及两个主流变种。 BERT inputs 切词方法 BERT的切词方法用的是WordPiece embeddings&…

线程的创建和使用threading.Thread()

【小白从小学Python、C、Java】 【计算机等考500强证书考研】 【Python-数据分析】 线程的创建和使用 threading.Thread() [太阳]选择题 关于以下代码的输出是&#xff1f; import threading import time def f(name): print(name) for i in range(3): print…

【RT-DETR有效改进】 | Neck篇 | 利用ASF-YOLO改进特征融合层(适用于分割和目标检测)

👑欢迎大家订阅本专栏,一起学习RT-DETR👑 一、本文介绍 本文给大家带来的改进机制是ASF-YOLO(发布于2023.12月份的最新机制)。这个模型通过结合空间和尺度特征,提高了在处理细胞图像时的准确性和速度。在实验中,ASF-YOLO在2018年数据科学竞赛数据集上取得了卓越的…

数据结构-顺序表详解专题

目录 顺序表 1.简单了解顺序表 2.顺序表的分类 2.1静态顺序表 2.2动态顺序表 2.3typedef命名作用 3.动态顺序表的实现 SeqList.h SeqList.c test.c 顺序表 1.简单了解顺序表 顺序表是线性表的一种&#xff0c;线性表是在逻辑上是线性结构&#xff0c;在物理逻辑上并…

sklearn 计算 tfidf 得到每个词分数

from sklearn.feature_extraction.text import TfidfVectorizer# 语料库 可以换为其它同样形式的单词 corpus [list(range(-5, 5)),list(range(-6,4)),list(range(12)),list(range(13))]# corpus [ # [Two, wrongs, don\t, make, a, right, .], # [The, pen, is, might…

第17次修改了可删除可持久保存的前端html备忘录:增加年月日星期,增加倒计时,更改保存区名称可以多个备忘录保存不一样的信息,匹配背景主题:现代深色

第17次修改了可删除可持久保存的前端html备忘录&#xff1a;增加年月日星期&#xff0c;增加倒计时&#xff0c;更改保存区名称可以多个备忘录保存不一样的信息&#xff0c;匹配背景主题&#xff1a;现代深色 备忘录代码&#xff1a; <!DOCTYPE html> <html lang&quo…

检测CUDA 是否能访问GPU时回应速度慢【笔记】

SUPWEMICRO 418G-Q20X12 维护记录&#xff1a; 两台设备均已安装CUDA与Pytorch&#xff0c;在检测CUDA 是否能访问GPU&#xff0c;执行torch.cuda.is_available()命令时&#xff0c;一台设备速度秒回应True&#xff0c;但另外一台设备回应速度慢&#xff08;1分钟左右&#xff…

响应式Web开发项目教程(HTML5+CSS3+Bootstrap)第2版 例5-6 绘制几何图形

代码 <!doctype html> <html> <head> <meta charset"utf-8"> <title>绘制几何图形</title> </head><body><canvas id"canvas" width"250" height"150" style"border: 1px b…