vue-options-api-best-practices
Vue 3 Options API style (data(), methods, this context). Each reference shows Options API solution only.
- License 许可
- MIT
- 所属仓库
- caezium/skills
- 最近更新
- 2026-08-24
- Stars
- ★ 3
- Forks
- 0
01 前言 Front Matter
- name
- vue-options-api-best-practices
- author
- github.com/vuejs-ai
- license
- MIT
- version
- 2.0.0
- description
- Vue 3 Options API style (data(), methods, this context). Each reference shows Options API solution only.
02 资源文件 10
- 参考文档reference/no-arrow-functions-in-lifecycle-hooks.md2.8 KB
- 参考文档reference/no-arrow-functions-in-methods.md2.0 KB
- 参考文档reference/stateful-methods-lifecycle.md1.9 KB
- 参考文档reference/ts-options-api-arrow-functions-validators.md4.6 KB
- 参考文档reference/ts-options-api-computed-return-types.md4.8 KB
- 参考文档reference/ts-options-api-proptype-complex-types.md4.8 KB
- 参考文档reference/ts-options-api-provide-inject-limitations.md3.3 KB
- 参考文档reference/ts-options-api-type-event-handlers.md5.5 KB
- 参考文档reference/ts-options-api-use-definecomponent.md4.6 KB
- 参考文档reference/ts-strict-mode-options-api.md4.7 KB
03 SKILL.md 正文
Vue.js Options API best practices, TypeScript integration, and common gotchas.
TypeScript
- Need to enable TypeScript type inference for component properties → See ts-options-api-use-definecomponent
- Enabling type safety for Options API this context → See ts-strict-mode-options-api
- Using old TypeScript versions with prop validators → See ts-options-api-arrow-functions-validators
- Event handler parameters need proper type safety → See ts-options-api-type-event-handlers
- Need to type object or array props with interfaces → See ts-options-api-proptype-complex-types
- Injected properties missing TypeScript types completely → See ts-options-api-provide-inject-limitations
- Complex computed properties lack clear type documentation → See ts-options-api-computed-return-types
Methods & Lifecycle
- Methods aren't binding to component instance context → See no-arrow-functions-in-methods
- Lifecycle hooks losing access to component data → See no-arrow-functions-in-lifecycle-hooks
- Debounced functions sharing state across component instances → See stateful-methods-lifecycle
04 同仓库更多 Skills
writing-for-agents
Writing documents for agents. Use when creating or editing skills, or modifying AGENTS.md or CLAUDE.md.
wrangler
Cloudflare Workers CLI for deploying, developing, and managing Workers, KV, R2, D1, Vectorize, Hyperdrive, Workers AI, Containers, Queues, Workflows, Pipelines, and Secrets Store. Load before running wrangler commands to ensure correct syntax and best practices. Biases towards retrieval from Cloudflare docs over pre-trained knowledge.
workers-best-practices
Reviews and authors Cloudflare Workers code against production best practices. Load when writing new Workers, reviewing Worker code, configuring wrangler.jsonc, or checking for common Workers anti-patterns (streaming, floating promises, global state, secrets, bindings, observability). Biases towards retrieval from Cloudflare docs over pre-trained knowledge.
wizard
Generate an interactive bash wizard that walks a human through steps only they can perform. Use when provisioning infrastructure, setting up credentials or CI secrets, walking an unfamiliar third-party dashboard, or running a one-off migration or cutover. Don't invoke this for steps the agent can perform itself.
why
Use for 'why does X work this way', 'why we picked Y', design rationale, regressions, postmortems, or data-backed thresholds. Discovers available evidence sources, searches each relevant category, and returns a cited read on decisions and tradeoffs. Use how for runtime behavior.
week-prep
Generate a briefing with calendar, tasks, and attention flags. Use for "week prep", "briefing", or "what's on this week".