vtie项目中使用到了TailwindCSS,如何打包成一个单独的CSS文件(优化、压缩)

在不依赖 Vite 或其他构建工具的情况下,使用 TailwindCSS CLI 快速生成独立的 CSS 文件是一种简单高效的方法,适合需要纯样式文件的场景。

这个项目中,使用到了tailwindCss, 需要把里面的样式打包出来,给其他项目用。

使用命令生成独立文件 运行以下命令生成压缩后的独立 CSS 文件:

复制代码
npx tailwindcss -i ./src/style.css -o ./dist/tailwind.css --minify

./src/style.css 就是你引入TailwindCSS的文件
./dist/tailwind.css 打包后,放入的文件

-i:指定输入文件。

-o:指定输出路径。

--minify:启用压缩。

生成的 tailwind.css 文件位于 dist 文件夹中,包含项目中实际使用的 TailwindCSS 样式,经过优化和压缩。

相关推荐
云中雾丽7 分钟前
Flutter中路由配置的各种方案
前端
不一样的少年_8 分钟前
女朋友炸了:刚打开的网页怎么又没了?我反手甩出一键恢复按钮!
前端·javascript·浏览器
Renounce8 分钟前
【Android】让 Android 界面 “动” 起来:动画知识点大起底
前端
Asort10 分钟前
JavaScript设计模式(十四)——命令模式:解耦请求发送者与接收者
前端·javascript·设计模式
小茴香35318 分钟前
Vue 脚手架(Vue CLI)
前端·javascript·vue.js
午安~婉23 分钟前
ESLint
前端·eslint·检查
“抚琴”的人24 分钟前
C#中获取程序执行时间
服务器·前端·c#
朝阳3933 分钟前
CSS【实战】可编辑元素实现 placeholder -- contenteditable=“true“
css
掘金一周35 分钟前
Flex 布局下文字省略不生效?原因其实很简单| 掘金一周 10.16
前端
Stringzhua40 分钟前
Vue的Axios介绍【9】
前端·javascript·vue.js