Svelte 组件开发指南：Bits UI、Ark UI、Melt UI 组件库与 Web 组件实战

svelte-components by spences10/svelte-skills-kit

149 周安装量

68 GitHub Stars

GitHub

安装命令

npx skills add https://github.com/spences10/svelte-skills-kit --skill svelte-components

UI组件库 Svelte 前端架构

🇨🇳中文介绍

Svelte 组件

快速开始

组件库： Bits UI（无样式） | Ark UI | Melt UI（基础组件）

表单技巧： 当表单无法包裹输入元素时，使用 form 属性：

<form id="my-form" action="/submit"><!-- 在表格外部 --></form>
<table>
	<tr>
		<td><input form="my-form" name="email" /></td>
		<td><button form="my-form">提交</button></td>
	</tr>
</table>

Web 组件

// svelte.config.js
export default {
	compilerOptions: {
		customElement: true,
	},
};



<!-- MyButton.svelte -->
<svelte:options customElement="my-button" />

<button><slot /></button>

参考文件

component-libraries.md - Bits UI, Ark UI 设置
web-components.md - 构建自定义元素
form-patterns.md - 高级表单处理

广告位招租

在这里展示您的产品或服务

触达数万 AI 开发者，精准高效

联系我们

🇺🇸English

Svelte Components

Quick Start

Component libraries: Bits UI (headless) | Ark UI | Melt UI (primitives)

Form trick: Use form attribute when form can't wrap inputs:

<form id="my-form" action="/submit"><!-- outside table --></form>
<table>
	<tr>
		<td><input form="my-form" name="email" /></td>
		<td><button form="my-form">Submit</button></td>
	</tr>
</table>

Web Components

// svelte.config.js
export default {
	compilerOptions: {
		customElement: true,
	},
};



<!-- MyButton.svelte -->
<svelte:options customElement="my-button" />

<button><slot /></button>

Reference Files

component-libraries.md - Bits UI, Ark UI setup
web-components.md - Building custom elements
form-patterns.md - Advanced form handling

Notes

Bits UI 1.0: flexible, unstyled, accessible components for Svelte
Form defaultValue attribute enables easy form resets
Use snippets to wrap rich HTML in custom select options
Last verified: 2025-01-14

Weekly Installs

131

Repository

spences10/svelt…ills-kit

GitHub Stars

First Seen

Jan 20, 2026

Security Audits

Gen Agent Trust HubPass SocketPass SnykPass

Installed on

opencode105

gemini-cli96

codex91

claude-code89

cursor85

github-copilot81