更新记录

1.0.0（2025-06-11） 下载此版本

• 基于Tailwind CSS v3.4核心语法
• 优先适配uni-app

平台兼容性

HBuilderX插件通用注意事项

HBuilderX-2.7.12以下版本安装插件市场内的插件后，卸载时需手动卸载，详细教程参考：如何手动卸载插件

Tailwind CSS For App 语言服务 - HBuilderX 插件

插件概述

本插件为HBuilderX开发者提供Tailwind CSS语言服务支持，通过样式悬浮提示、智能代码补全和代码块功能，显著提升小程序和跨平台应用的CSS开发效率。

项目基于Tailwind CSS v3.4核心语法，深度适配uni-app开发框架。

目前仅支持 vue 和 html 文件提示，对uni-app-x适配，单位统一使用px。

开始使用

如果没有命名如 style/styles/common/assets 的目录需要创建好，通过右键触发菜单，找到 Tailwind CSS For App 创建原始css文件并在App.(vue|uvue)文件中引入使用。

/* 引入Tailwind CSS For App样式文件 */
@import url('./styles/tailwindcss-app.css');
@import url('./styles/self.css');

核心功能

✅ 样式悬浮提示

仅 class 区域鼠标悬停显示编译后的CSS规则

✅ 智能代码补全

仅 class 区域输入提示预设的Tailwind CSS类名

✅ 代码块

代码块前缀使用tw开头，编辑区输入后提示定义的代码片段

TODO: 完善代码块功能，支持更多预设片段。

推荐预制组件

支持Tailwind CSS框架进行复制代码片段

• UIBak
• HyperUI
• Cssnippets
• Meraki UI
• Mamba UI
• Wind UI