vue3+vite使用 tailwindcss.css搭建

news/2025/11/11 17:17:05/文章来源:https://www.cnblogs.com/tlfe/p/19211038
tailwindcss开发文档: https://www.tailwindcss.cn/
1.按照依赖
npm install -D tailwindcss postcss autoprefixer @tailwindcss/vite

2.在vite.config.ts中配置

import tailwindcss from '@tailwindcss/vite'
export default defineConfig({plugins: [tailwindcss(),......]
})

3.在asstes文件下新建css文件tailwindcss.css

@import 'tailwindcss';

4.在main.js中引入

improt "./asstes/css/tailwindcss.css"

5.重新启动项目

npm run dev

测试代码: 

<div class="text-3xl font-bold underline">Hello World!</div>

 

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

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

相关文章

2025年电玩摩托定制厂家权威推荐榜单:电玩摩托游戏机/投币式电玩摩托游戏机/电玩城成人摩托源头厂家精选

在娱乐产业蓬勃发展的当下,电玩城已成为现代都市休闲的重要场所。其中,电玩摩托凭借其沉浸式体感模拟与竞技娱乐特性,持续吸引着大量玩家,是电玩城提升客流与营收的关键设备之一。为帮助您精准筛选优质供应商,本文…

案例大公开!某企业软件许可优化省200万,降本方案同行疯传!

我是IT部门经理小李,从业多年,见过无数企业被软件许可费用吃垮。我们公司的一个真实案例火了,省了200万元成本,这事儿本该保密,但既然能帮到同行,我今天就开口了。不少读者问我:“到底怎么软件许可优化省钱?”…

习题解析之:角古猜想

习题解析之:角古猜想【问题描述】一个正整数,若为偶数,则把它除以2,若为大于 1 的奇数,则把它乘以3加1。经过如此有限次运算后,可以得到整数1。 求经过多少次运算可得到整数1。 输入格式输入一个数字 输出格式第…

关键字 字面量 变量

关键字 字面量 变量关键字 字面量 变量 关键字 定义 被Java赋予了特定涵义点英文单词 特点 1.关键字的字母全部小写。 2.常用的代码编译器,对关键字有特殊颜色标记。 class关键字是什么意思? class关键字表示定义一个…

“CMTI测试电源”共模瞬态抗扰度测试方案及标准 - FORCREAT

苏州永创智能科技详解“CMTI测试电源”共模瞬态抗扰度测试方案及标准(光耦-隔离芯片-传感芯片)CMTI测试电源/全固态纳秒高压脉冲源、超宽带高压皮秒脉冲源、数百kV级的皮秒纳秒EMP/HPEM特斯拉Q 发生器、系统集成和定…

Goland 2025.2.4 11月最新版 安装、授权、使用说明

Goland 2025.2.4 11月最新版 安装、授权、使用说明2025-11-11亲测 支持最新版本2025.2.4 支持Windows、MAC、Linux一 安装 官网下载 : https://www.jetbrains.com.cn/go/ 根据提示安装 二 授权说明回复 《go》获取 新…

牛客刷题-Day21

模拟、枚举与贪心 https://ac.nowcoder.com/acm/contest/20960?from=acdiscuss牛客刷题-Day21 今日刷题:\(1031-1035\) 1031 贪心 例10-Bits解题思路 贪心。假设开始每一位都是 \(1\),从高位 \(i\) 开始枚举,如果…

C# 操作 Excel

C# 中操作 Excel 有许多强大的库可供选择,它们各有特点,适合不同的场景。下面我用一个表格汇总这些常见库及其特点,并辅以说明和代码示例库名称 类型 优点 缺点 适用场景 NuGet 安装命令ClosedXML 开源 API 直观易用…

恒利泰射频器件:国产穿心电容、高Q电容、馈通滤波器

恒利泰射频器件:国产穿心电容、高Q电容、馈通滤波器成都一家专注射频无源器件公司,其口号为:匠心制造,按需定制——成都恒利泰科技有限公司,2015年在成都崛起,旗下品牌恒利泰HenryTech,产品种类诸多,涉及行业范…

智能字幕校准系统实战(二):6级匹配算法从精确到模糊的全链路解析

系列文章:《智能字幕校准系统实战:从架构到算法的全栈技术解析》 本文为第2篇:6级智能校准算法深度解析 阅读时间:20分钟 难度:(中高级) 标签:算法设计 NLP Python Spacy 时间序列对齐前情回顾 在第1篇中,我详细…

P11802 【MX-X9-T6】『GROI-R3』Graph

首先发现就是让你组合成一些环使得其满足条件。 看目前如果有长度为 \(len\) 的环,能够最少花费 \(p\) 个这样的环组合成一个大环,那么 \(p\) 的倍数同样合法,且这是充要条件。 然后考虑一些链拼接成环的计数,设 \…

基于MATLAB实现支持向量机(SVM)分类

一、基础SVM分类代码示例 1. 使用fitcsvm函数(推荐新版MATLAB) % 加载数据集(以鸢尾花为例) load fisheriris; X = meas(:,1:2); % 选取前两个特征 Y = species;% 划分训练集和测试集(70%训练,30%测试) cv = cv…

2025年一代天骄青少年训练营最新推荐:一代天骄寒假班/一代天骄课程/一代天骄成长课程/一代天骄暑假班,专注青少年成长训练,树立个性化教育新标准

随着社会对青少年综合素质培养的重视程度不断提升,以及家庭教育理念的持续升级,青少年素质教育已从辅助性课程逐步发展为成长刚需。2025年,素质教育市场预计将进一步扩大,但伴随市场增长而来的是机构教学水平、课程…

LLM大模型原理与实践 学习笔记 - yi

LLM大模型原理与实践 学习笔记LLM大模型原理与实践项目是一个系统性的 LLM 学习教程,将从 NLP 的基本研究方法出发,根据 LLM 的思路及原理逐层深入,依次为读者剖析 LLM 的架构基础和训练过程。同时,我们会结合目前…

实用指南:React组件生命周期节点触发时机(组件加载Mount、组件更新Update、组件卸载Unmount)组件挂载

实用指南:React组件生命周期节点触发时机(组件加载Mount、组件更新Update、组件卸载Unmount)组件挂载2025-11-11 16:52 tlnshuju 阅读(0) 评论(0) 收藏 举报pre { white-space: pre !important; word-wrap: nor…

为什么要使用immer库?

View Post为什么要使用immer库?首先从不使用 Immer 的情况下,useState 是如何更新状态的,来开始解释 useState 的更新方式有两种: 方式1:直接设置新值 const [count, setCount] = useState(0); setCount(5); // 直…

2025年11月酒店加盟品牌推荐:主流选择对比与高性价比解决方案

一、引言 酒店加盟赛道在2025年步入存量改造与精细化运营并行的新周期,投资人身份已从“机会捕捉者”转为“成本精算师”。对多数手握物业、预算在千万级以内的中小机构或个人业主而言,核心需求集中在三点:一是单房…

游戏AI行为决策——MLP(多层感知机/人工神经网络)

【USparkle专栏】如果你深怀绝技,爱“搞点研究”,乐于分享也博采众长,我们期待你的加入,让智慧的火花碰撞交织,让知识的传递生生不息!你一定听说过神经网络的大名,你有想过将它用于游戏AI的行为决策上吗?其实在…

疯了还是天才?(下):揭秘ObjectSense的0“AI护城河”——微语言

系列文章导读: 在上篇,我们了解了ObjectSense基于Vim的“根基”;在中篇,我们探讨了它“三位一体”的SIDE生态。现在,我们将触及它最核心、也是最大胆的主张:它凭什么“让AI无法取代”? (上篇)一个“复古”的破…