关于 vue3
vue3 是面向 Vue 3 学习者和开发者的参考技能,将指南主题与 API 参考对应到本地示例文件,涵盖组件、响应式、TypeScript、路由、测试和性能等内容。
主要功能
- 01按示例文件查找指南主题
- 02映射 API 参考文件
- 03涵盖组件与响应式
- 04提供 TypeScript 和性能指引
适用场景
- 01查找 Vue 3 功能指引
- 02核对特定 API 详情
- 03在 Vue 中应用 TypeScript 模式
- 04查阅路由或测试主题
安装
复制下面的命令,在终端中运行。
$
npx skills add https:/ / github.com/ partme-ai/ full-stack-skills --skill vue3安装后在 Claude Code 中输入/vue3确认已加载。
包含的文件
除 SKILL.md 外,安装时一起下载的参考资料和脚本。
api/application.mdbuilt-in-components.mdbuilt-in-directives.mdbuilt-in-special-attributes.mdbuilt-in-special-elements.mdcompile-time-flags.mdcomponent-instance.mdcomposition-api-dependency-injection.mdcomposition-api-helpers.mdcomposition-api-lifecycle.mdcomposition-api-setup.mdcustom-elements.mdcustom-renderer.mdgeneral.mdoptions-composition.mdoptions-lifecycle.mdoptions-misc.mdoptions-rendering.mdoptions-state.mdreactivity-advanced.mdreactivity-core.mdreactivity-utilities.mdrender-function.mdapi/component/defineProps.mdapi/lifecycle/onMounted.mdapi/reactivity-core/computed.mdreactive.mdref.mdwatch.mdapi/reactivity-utilities/toRef.md详细介绍
适用场景
在用户希望进行以下操作时,使用此技能:
- 学习或应用 Vue 3 指南主题(从入门到高级扩展)
- 实现 Vue 3 组件、响应性、模板和路由
- 遵循 Vue 3 最佳实践、TypeScript 用法或性能指南
- 查询 Vue 3 API 参考中的特定函数或选项
使用方法
- 确定主题,根据用户的请求进行判断。
- 在
examples/中打开对应的指南示例文件。 - 如果需要 API 详情,打开
api/中对应的文件。 - 遵循官方指南,并确保输出与 Vue 3 文档保持一致。
指南映射(与指南页面一一对应)
入门
examples/getting-started/introduction.md→ https://cn.vuejs.org/guide/introduction.htmlexamples/getting-started/quick-start.md→ https://cn.vuejs.org/guide/quick-start.html
核心功能
examples/essentials/application.md→ https://cn.vuejs.org/guide/essentials/application.htmlexamples/essentials/template-syntax.md→ https://cn.vuejs.org/guide/essentials/template-syntax.htmlexamples/essentials/reactivity-fundamentals.md→ https://cn.vuejs.org/guide/essentials/reactivity-fundamentals.htmlexamples/essentials/computed.md→ https://cn.vuejs.org/guide/essentials/computed.htmlexamples/essentials/class-and-style.md→ https://cn.vuejs.org/guide/essentials/class-and-style.htmlexamples/essentials/conditional.md→ https://cn.vuejs.org/guide/essentials/conditional.htmlexamples/essentials/list.md→ https://cn.vuejs.org/guide/essentials/list.htmlexamples/essentials/event-handling.md→ https://cn.vuejs.org/guide/essentials/event-handling.htmlexamples/essentials/forms.md→ https://cn.vuejs.org/guide/essentials/forms.htmlexamples/essentials/watchers.md→ https://cn.vuejs.org/guide/essentials/watchers.htmlexamples/essentials/template-refs.md→ https://cn.vuejs.org/guide/essentials/template-refs.htmlexamples/essentials/component-basics.md→ https://cn.vuejs.org/guide/essentials/component-basics.htmlexamples/essentials/lifecycle.md→ https://cn.vuejs.org/guide/essentials/lifecycle.html
深入了解组件
examples/components/registration.md→ https://cn.vuejs.org/guide/components/registration.htmlexamples/components/props.md→ https://cn.vuejs.org/guide/components/props.htmlexamples/components/events.md→ https://cn.vuejs.org/guide/components/events.htmlexamples/components/v-model.md→ https://cn.vuejs.org/guide/components/v-model.htmlexamples/components/attrs.md→ https://cn.vuejs.org/guide/components/attrs.htmlexamples/components/slots.md→ https://cn.vuejs.org/guide/components/slots.htmlexamples/components/provide-inject.md→ https://cn.vuejs.org/guide/components/provide-inject.htmlexamples/components/async.md→ https://cn.vuejs.org/guide/components/async.html
复用
examples/reusability/composables.md→ https://cn.vuejs.org/guide/reusability/composables.htmlexamples/reusability/custom-directives.md→ https://cn.vuejs.org/guide/reusability/custom-directives.htmlexamples/reusability/plugins.md→ https://cn.vuejs.org/guide/reusability/plugins.html
内置组件
examples/built-ins/transition.md→ https://cn.vuejs.org/guide/built-ins/transition.htmlexamples/built-ins/transition-group.md→ https://cn.vuejs.org/guide/built-ins/transition-group.htmlexamples/built-ins/keep-alive.md→ https://cn.vuejs.org/guide/built-ins/keep-alive.htmlexamples/built-ins/teleport.md→ https://cn.vuejs.org/guide/built-ins/teleport.htmlexamples/built-ins/suspense.md→ https://cn.vuejs.org/guide/built-ins/suspense.html Scaling Upexamples/scaling-up/sfc.md→ https://cn.vuejs.org/guide/scaling-up/sfc.htmlexamples/scaling-up/tooling.md→ https://cn.vuejs.org/guide/scaling-up/tooling.htmlexamples/scaling-up/routing.md→ https://cn.vuejs.org/guide/scaling-up/routing.htmlexamples/scaling-up/state-management.md→ https://cn.vuejs.org/guide/scaling-up/state-management.htmlexamples/scaling-up/testing.md→ https://cn.vuejs.org/guide/scaling-up/testing.htmlexamples/scaling-up/ssr.md→ https://cn.vuejs.org/guide/scaling-up/ssr.html
Best Practices
examples/best-practices/production-deployment.md→ https://cn.vuejs.org/guide/best-practices/production-deployment.htmlexamples/best-practices/performance.md→ https://cn.vuejs.org/guide/best-practices/performance.htmlexamples/best-practices/accessibility.md→ https://cn.vuejs.org/guide/best-practices/accessibility.htmlexamples/best-practices/security.md→ https://cn.vuejs.org/guide/best-practices/security.html
TypeScript
examples/typescript/overview.md→ https://cn.vuejs.org/guide/typescript/overview.htmlexamples/typescript/composition-api.md→ https://cn.vuejs.org/guide/typescript/composition-api.htmlexamples/typescript/options-api.md→ https://cn.vuejs.org/guide/typescript/options-api.html
Extra Topics
examples/extras/ways-of-using-vue.md→ https://cn.vuejs.org/guide/extras/ways-of-using-vue.htmlexamples/extras/composition-api-faq.md→ https://cn.vuejs.org/guide/extras/composition-api-faq.htmlexamples/extras/reactivity-in-depth.md→ https://cn.vuejs.org/guide/extras/reactivity-in-depth.htmlexamples/extras/rendering-mechanism.md→ https://cn.vuejs.org/guide/extras/rendering-mechanism.htmlexamples/extras/render-function.md→ https://cn.vuejs.org/guide/extras/render-function.htmlexamples/extras/web-components.md→ https://cn.vuejs.org/guide/extras/web-components.htmlexamples/extras/animation.md→ https://cn.vuejs.org/guide/extras/animation.html
API 映射(与 API 页面一一对应)
全局 API
api/application.md→ https://cn.vuejs.org/api/application.htmlapi/general.md→ https://cn.vuejs.org/api/general.html
组合式 API
api/composition-api-setup.md→ https://cn.vuejs.org/api/composition-api-setup.htmlapi/reactivity-core.md→ https://cn.vuejs.org/api/reactivity-core.htmlapi/reactivity-utilities.md→ https://cn.vuejs.org/api/reactivity-utilities.htmlapi/reactivity-advanced.md→ https://cn.vuejs.org/api/reactivity-advanced.htmlapi/composition-api-lifecycle.md→ https://cn.vuejs.org/api/composition-api-lifecycle.htmlapi/composition-api-dependency-injection.md→ https://cn.vuejs.org/api/composition-api-dependency-injection.htmlapi/composition-api-helpers.md→ https://cn.vuejs.org/api/composition-api-helpers.html
选项式 API
api/options-state.md→ https://cn.vuejs.org/api/options-state.htmlapi/options-rendering.md→ https://cn.vuejs.org/api/options-rendering.htmlapi/options-lifecycle.md→ https://cn.vuejs.org/api/options-lifecycle.htmlapi/options-composition.md→ https://cn.vuejs.org/api/options-composition.htmlapi/options-misc.md→ https://cn.vuejs.org/api/options-misc.htmlapi/component-instance.md→ https://cn.vuejs.org/api/component-instance.html
内置功能
api/built-in-directives.md→ https://cn.vuejs.org/api/built-in-directives.htmlapi/built-in-components.md→ https://cn.vuejs.org/api/built-in-components.htmlapi/built-in-special-elements.md→ https://cn.vuejs.org/api/built-in-special-elements.htmlapi/built-in-special-attributes.md→ https://cn.vuejs.org/api/built-in-special-attributes.html
单文件组件
api/sfc-spec.md→ https://cn.vuejs.org/api/sfc-spec.htmlapi/sfc-script-setup.md→ https://cn.vuejs.org/api/sfc-script-setup.htmlapi/sfc-css-features.md→ https://cn.vuejs.org/api/sfc-css-features.html
高级 API
api/custom-elements.md→ https://cn.vuejs.org/api/custom-elements.htmlapi/render-function.md→ https://cn.vuejs.org/api/render-function.htmlapi/ssr.md→ https://cn.vuejs.org/api/ssr.htmlapi/utility-types.md→ https://cn.vuejs.org/api/utility-types.htmlapi/custom-renderer.md→ https://cn.vuejs.org/api/custom-renderer.htmlapi/compile-time-flags.md→ https://cn.vuejs.org/api/compile-time-flags.html
资源
关键词
Vue 3、Vue.js、组合式 API、选项式 API、响应性、模板语法、组件、指令、生命周期、路由、状态管理、TypeScript
评论
支持 Markdown