vue-development-guides

Enforce Vue.js best practices for state management, component design, and SFC structure.

Updated Aug 27, 2026
One-click install
npx skills add https://github.com/hello-lizhihua/skills_zh-CN --skill vue-development-guides-hello-lizhihua
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: vue-development-guides
Source: https://github.com/hello-lizhihua/skills_zh-CN/tree/main/vue-skills/cn/skills/vue-development-guides
Command: npx skills add https://github.com/hello-lizhihua/skills_zh-CN --skill vue-development-guides-hello-lizhihua

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

这项技能汇集了 Vue.js 开发的最佳实践与指南,帮助团队在构建、重构或审查 Vue/Nuxt 项目时保持一致性与高质量代码。

Core Features & Use Cases

  • 核心原则:确保状态可预测、数据流清晰、组件职责单一、代码易读。
  • 使用场景:在 Vue 3 / Nuxt 3 项目中进行代码审查、重构和新特性开发时应用这些指南。
  • 用例:当团队需要提升现有代码库的一致性和可维护性时,按指南检查组件结构、响应式使用和 SFC 约定。

Quick Start

先阅读核心原则、数据流指南和 SFC 指南,然后在实际 Vue 3 / Nuxt 3 项目中应用这些最佳实践。

Frequently Asked Questions about vue-development-guides

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
What are the best practices for Vue 3 component design and SFC structure?

Vue 3 best practices enforce single-responsibility components, predictable state, clear data flow, and consistent SFC structure to ensure code readability and maintainability across your project.

How do I manage reactivity and state in Nuxt 3 applications?

Managing reactivity and state in Nuxt 3 requires adhering to core rules that ensure state predictability and clear data flow, preventing common reactivity pitfalls during development and refactoring.

Can I use these Vue development guidelines for code reviews?

Yes, you can use these Vue development guidelines during code reviews to check component structure, reactivity usage, and SFC conventions, ensuring high code quality and team consistency.

How do I refactor existing Vue codebases for better maintainability?

Refactoring Vue codebases involves applying consolidated guidelines to improve consistency, checking component responsibilities, state management, and SFC conventions to achieve a highly maintainable codebase.

Does this Vue best practices guide apply to both Vue 3 and Nuxt 3?

Yes, this Vue best practices guide applies directly to both Vue 3 and Nuxt 3 projects, enforcing core rules for state management, component design, reactivity, and SFC structure.

When do I need to check Vue SFC conventions during development?

You need to check Vue SFC conventions during new feature development and refactoring to ensure component structure aligns with established best practices for predictable state and clear data flow.