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)

相关推荐
FansUnion3 分钟前
用 AI 自动生成壁纸标题、描述和 SEO Slug
javascript
青青家的小灰灰7 分钟前
金三银四面试官最想听的 React 答案:虚拟 DOM、Hooks 陷阱与大型列表优化
前端·react.js·面试
HelloReader7 分钟前
深入理解 Tauri 架构与应用体积优化实战指南
前端
lemon_yyds8 分钟前
vue 2 升级vue3 : ref 和 v-model 命名为同名
前端·vue.js
codingWhat8 分钟前
小程序里「嵌」H5:一套完整可落地的 WebView 集成方案
前端·uni-app·webview
重庆穿山甲12 分钟前
Java开发者的大模型入门:Spring AI Alibaba组件全攻略(二)
前端·后端
光影少年15 分钟前
在 React 中,什么情况下需要用 useCallback 和 useMemo?它们的区别是什么?
前端·react.js·掘金·金石计划
大雨还洅下15 分钟前
前端 JS: async, await; Generator
javascript
合天网安实验室15 分钟前
H2O-3反序列化漏洞分析(CVE-2025-6507&CVE-2025-6544)
前端·黑客
juejin_cn16 分钟前
[转][译] 从零开始构建 OpenClaw — 第三部分(元技能)
javascript