Vue (Stack) rules

Component templates should only include simple expressions, with more complex expressions refactored into computed properties or methods.

Filenames of Single-File Components should either be always PascalCase or always kebab-case.

The top-level tags (`<script>`, `<template>`, `<style>`) in Single-File Components (.vue files) should be ordered consistently across the project. A common convention is `<script>`, then `<template>`, then `<style>`.

Child components that are tightly coupled with their parent should include the parent component name as a prefix.

Use object and array destructuring to access properties from objects (like `props`, `this`, context in `setup`) or elements from arrays, especially when accessing multiple items.

Always use ES Modules (`import` and `export`) for managing dependencies and organizing code in Vue applications. Avoid non-standard module systems or global namespace pollution.

When emitting custom events with data using `$emit`, pass an object literal as the payload instead of a raw primitive value, especially if there's a chance more data might be needed later.

Utilize object method shorthands, property value shorthands, and computed property names when defining objects (e.g., in `data`, `computed`, `methods`). Prefer object spread syntax (`...`) over `Object.assign` for shallow copies or merging objects.

Enforces consistent usage of hyphenated (kebab-case) or non-hyphenated (camelCase) attribute names on custom components in templates.