bootstrap-to-modern

仓库创建 2026年5月22日最近提交 22 小时前SkillHot 收录 9 小时前

▸ 精选理由

适合替换 jQuery/Bootstrap 的遗留前端项目，提升维护性与性能。

这个 Skill 做什么

将旧 Bootstrap 应用迁移到 Tailwind CSS 与 Alpine.js 的现代化重构指南。

把老旧的 Bootstrap 页面逐步重构为现代的 Tailwind CSS v4 + Alpine.js 架构：去掉 jQuery 依赖、重写样式为 utility-first、拆分可复用组件并给出迁移步骤。适合遗留项目想要降低样式维护成本、引入现代前端实践或做增量迁移时用。特点是提供可执行的分阶段计划，兼顾兼容性和可维护性。

▸ 展开 SKILL.md 英文原文

Expert skill to refactor and migrate legacy Bootstrap CSS applications to modern stacks using Tailwind CSS v4 and Alpine.js / Skill ahli untuk melakukan refaktor dan migrasi aplikasi Bootstrap CSS lama ke stack modern menggunakan Tailwind CSS v4 dan Alpine.js.

开发编程Bootstrap 迁移Tailwind前端重构通用

Stars

Forks

仓库内 Skill

7 日增星

安装 / 使用

给你的 Agent 一句话（通用）

帮我安装这个 skill：https://raw.githubusercontent.com/roedyrustam/vibes-plug/main/skills/bootstrap-to-modern/SKILL.md

或 curl 直取 SKILL.md

curl -fsSL "https://raw.githubusercontent.com/roedyrustam/vibes-plug/main/skills/bootstrap-to-modern/SKILL.md"

SKILL.MD 节选查看完整文件 ↗

# Bootstrap to Modern (Tailwind + Alpine.js) / Refaktor Bootstrap ke Modern

[English](#english) | [Bahasa Indonesia](#bahasa-indonesia)

---

<a name="english"></a>
## English

### Description
This skill transforms legacy web applications styled with Bootstrap (jQuery-dependent or pure CSS) into a modern, utility-first architecture using **Tailwind CSS v4** for styling and **Alpine.js** for lightweight reactive behavior.

### Instructions
1. **Analyze the Legacy Structure**:
   - Identify the version of Bootstrap being used.
   - Locate custom CSS files that override Bootstrap defaults.
   - Identify interactive components (modals, dropdowns, tooltips, tabs, carousels) that rely on Bootstra

via SKILL·HOT · 数据来自 GitHub 公开信息 · 原文版权归作者所有