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 样式,经过优化和压缩。

相关推荐
每天吃饭的羊1 分钟前
水平,垂直居中
前端·javascript·html
鼎道开发者联盟24 分钟前
鼎享会 | OpenClaw Control UI 前端架构全解析:自研 UI 对接 Server 实操指南
前端·ui·架构·openclaw·control ui
尘世中一位迷途小书童26 分钟前
一套完整的给予ceium封装的组件库,可满足企业级开发
前端
Z_Wonderful27 分钟前
微前端:Webpack 配置 vs Vite 配置 超清晰对比
前端·webpack·node.js
码云数智-园园32 分钟前
HTTPS是如何工作的?从HTTP到HTTPS的加密演进
前端
隔窗听雨眠40 分钟前
HTML头部元信息避坑指南
前端·html
Gauss松鼠会1 小时前
【openGauss】openGauss 磁盘引擎之 ustore
java·服务器·开发语言·前端·数据库·经验分享·gaussdb
LIO1 小时前
前端响应式页面开发全攻略:核心技术 + 实现效果 + 实战指南
前端·响应式设计
得物技术1 小时前
AI驱动:从运营行为到自动化用例的智能化实践|得物技术
前端·ai编程·全栈
前端那点事1 小时前
Vue并发控制|几十个请求高效管控(实战方案+可运行代码)
前端·vue.js