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)

相关推荐
Freedom风间1 小时前
前端优秀编码技巧
前端·javascript·代码规范
萌萌哒草头将军1 小时前
🚀🚀🚀 Openapi:全栈开发神器,0代码写后端!
前端·javascript·next.js
萌萌哒草头将军1 小时前
🚀🚀🚀 Prisma 爱之初体验:一款非常棒的 ORM 工具库
前端·javascript·orm
拉不动的猪2 小时前
SDK与API简单对比
前端·javascript·面试
runnerdancer2 小时前
微信小程序蓝牙通信开发之分包传输通信协议开发
前端
BillKu2 小时前
Vue3后代组件多祖先通讯设计方案
开发语言·javascript·ecmascript
山海上的风2 小时前
Vue里面elementUi-aside 和el-main不垂直排列
前端·vue.js·elementui
电商api接口开发2 小时前
ASP.NET MVC 入门指南二
前端·c#·html·mvc
亭台烟雨中2 小时前
【前端记事】关于electron的入门使用
前端·javascript·electron