spartan

为 Angular 全栈开发提供现代化、可访问的 UI 组件库和开发栈。

安装使用

复制下面这段提示词发给你的 AI(Claude / Cursor / TRAE / Codex / WorkBuddy 等),它会自动帮你完成安装:

帮我安装这个 AI Skill:spartan。
它的用途是:为 Angular 全栈开发提供现代化、可访问的 UI 组件库和开发栈。
完整的 Skill 内容见:https://321skill.com/skills/spartan/raw/index.md
请读取该页面内容,如果是 SKILL.md 格式直接安装,如果是 README 提炼核心 prompt 后安装。

提示词包含完整的 Skill 内容链接,AI 读取后即可完成安装。你也可以 查看完整内容 确认无误。

使用示例

“帮我用 spartan/ui 的按钮和对话框组件搭建一个用户反馈表单的界面。”,它会提供使用 spartan 相应组件的代码示例,并解释如何通过其CLI安装这些组件,以及如何根据你的设计系统定制它们的样式。

介绍

Spartan 旨在解决 Angular 开发者构建现代化、可访问且风格统一的 Web 应用时面临的挑战。它提供了一套无样式的、开箱即用的可访问性 UI 基础组件(spartan/ui),以及一个基于 AnalogJs 构建的、开箱即用的全栈开发环境(spartan/stack),让开发者能快速启动项目,并专注于业务逻辑。

使用方式非常灵活。对于 UI 组件,你可以通过其 CLI 工具,以类似 shadcn/ui 的方式,将组件代码直接复制到你的项目中,从而完全掌控样式和定制。对于全栈开发,你可以使用其预设的栈来初始化一个集成了最佳实践和工具链的项目。

它非常适合希望提升开发效率、注重应用可访问性,并希望在 Angular 生态中获得类似 React 生态中 Next.js 或 shadcn/ui 那样流畅体验的全栈开发者或团队。

与同类 Angular UI 库(如 Angular Material、PrimeNG)相比,Spartan 的核心区别在于其“无头”(headless)哲学和代码复制模式。它分离了组件的行为逻辑和视觉样式,赋予开发者完全的样式控制权,避免了传统 UI 库的样式覆盖难题和捆绑依赖。

核心特点

核心区别在于采用了“无头UI组件+代码复制”模式,将可访问的行为逻辑与视觉样式彻底解耦,开发者完全拥有并可以自由定制组件样式,避免了传统UI库的样式污染和依赖捆绑问题。

注意事项

不适合那些希望直接使用现成、风格固定的组件而无需关心底层样式和定制化的快速原型项目。

常见问题

Spartan 和 Angular Material 有什么区别?

Spartan 提供无样式、可访问的基础组件,样式需自行定制;Angular Material 是带有 Material Design 预设样式的完整组件库。

如何开始使用 spartan/ui 组件?

通过 NPM 安装 @spartan-ng/cli,然后使用其命令将所需组件的代码复制到你的项目中即可。

给 AI 助手的安装指引

如果你的 AI 编程助手(Claude Code、Cursor、TRAE 等)能看到这个页面,把下面这段发给它即可自动完成安装:

请访问 https://321skill.com/skills/spartan/raw/index.md 读取 spartan 的原始 Skill 定义(Markdown 格式),按其中说明在我的环境里完成安装和配置。