vite安装Tailwind CSS

安装 - Tailwind CSS 中文网 (nodejs.cn)

这是官网,平常我练习一般会用vite脚手架

我们选择这个vite模块

可选择React和Vue版本的,这里选择react的按照操作,没问题的话就要出问题了

1、在npm run dev的时候我是出现了这么个问题,解决办法在项目里重新

npm install vite或者

npm install后npm run dev

2、在浏览器输入localhost:5174后是出现了

原因是啥,react除了.js,.jsx,.ts,.tsx文件还有根文件.html文件在tailwind.config.js里添加html就好了

然后我们要写代码了,这里我们就要给Vscode装几个插件了

1、代码提示插件,让你写代码快的飞起,安装后,重启下Vscode,如下。

2、Tailwind Fold 用于闭合css代码的,还不如长长的,不太好改代码

然后根据程序员𝐋𝐞𝐫𝐭𝐞的主页 - 抖音 (douyin.com) 写了如下代码​​​​​​ 动态组件 (gitee.com)

相关推荐
颜酱8 分钟前
开发工具链-构建、测试、代码质量校验常用包的比较
前端·javascript·node.js
mCell24 分钟前
[NOTE] JavaScript 中的稀疏数组、空槽和访问
javascript·面试·v8
柒儿吖30 分钟前
Electron for 鸿蒙PC - Native模块Mock与降级策略
javascript·electron·harmonyos
颜酱1 小时前
package.json 配置指南
前端·javascript·node.js
todoitbo1 小时前
基于 DevUI MateChat 搭建前端编程学习智能助手:从痛点到解决方案
前端·学习·ai·状态模式·devui·matechat
oden1 小时前
SEO听不懂?看完这篇你明天就能优化网站了
前端
IT_陈寒1 小时前
React性能优化:这5个Hooks技巧让我减少了40%的重新渲染
前端·人工智能·后端
Sunhen_Qiletian1 小时前
《Python开发之语言基础》第六集:操作文件
前端·数据库·python
珑墨1 小时前
【唯一随机数】如何用JavaScript的Set生成唯一的随机数?
开发语言·前端·javascript·ecmascript
L***d6701 小时前
十七:Spring Boot依赖 (2)-- spring-boot-starter-web 依赖详解
前端·spring boot·后端