Vue Best Practices

Capability Rules

| Rule | Keywords | Description | |------|----------|-------------| | extract-component-props | get props type, wrapper component, extend props, inherit props, ComponentProps | Extract types from .vue components | | vue-tsc-strict-templates | undefined component, template error, strictTemplates | Catch undefined components in templates | | fallthrough-attributes | fallthrough, $attrs, wrapper component | Type-check fallthrough attributes | | strict-css-modules | css modules, $style, typo | Catch CSS module class typos | | data-attributes-config | data-, strictTemplates, attribute | Allow data- attributes | | volar-3-breaking-changes | volar, vue-language-server, editor | Fix Volar 3.0 upgrade issues | | module-resolution-bundler | cannot find module, @vue/tsconfig, moduleResolution | Fix module resolution errors | | define-model-update-event | defineModel, update event, undefined | Fix model update errors | | with-defaults-union-types | withDefaults, union type, default | Fix union type defaults | | deep-watch-numeric | watch, deep, array, Vue 3.5 | Efficient array watching | | vue-directive-comments | @vue-ignore, @vue-skip, template | Control template type checking | | vue-router-typed-params | route params, typed router, unplugin | Fix route params typing |

Efficiency Rules

| Rule | Keywords | Description | |------|----------|-------------| | hmr-vue-ssr | hmr, ssr, hot reload | Fix HMR in SSR apps | | pinia-store-mocking | pinia, mock, vitest, store | Mock Pinia stores |

Reference

• Vue Language Tools
• vue-component-type-helpers
• Vue 3 Documentation