prop-name-casing.md

Pattern: Invalid casing for prop name

Issue: -

Description

This rule enforces proper casing of props in vue components (camelCase).

<script>
export default {
  props: {
    /* ✓ GOOD */
    greetingText: String,

    /* ✗ BAD */
    'greeting-text': String,
    greeting_text: String
  }
}
</script>

Options

{
  "vue/prop-name-casing": ["error", "camelCase" | "snake_case"]
}

• "camelCase" (default) ... Enforce property names in props to camel case.
• "snake_case" ... Enforce property names in props to snake case.

"snake_case"

<script>
export default {
  props: {
    /* ✓ GOOD */
    greeting_text: String,

    /* ✗ BAD */
    'greeting-text': String,
    greetingText: String
  }
}
</script>

Further Reading

• eslint-plugin-vue - prop-name-casing