Skip to content

Latest commit

 

History

History
82 lines (64 loc) · 1.41 KB

vue-attribute-spacing.md

File metadata and controls

82 lines (64 loc) · 1.41 KB
Raw

Enforce unified spacing around binding attributes (vue-attribute-spacing)

Vue supports JavaScript expressions in HTML attribute values via directives. Sometimes whitespaces may or may not appear on either side of an expression, and we may expect to maintain maintain a uniform style within a project.

This rule does not affect static (string) attributes and mustache interpolation.

This rule is fixable.

Options

This rule has a string option:

  • "always" expects one space between expression and quotes.
  • "never" (default) expects no spaces between expression and quotes.

Fail

<template>
  <p v-foo=" bar "></p>
</template>
<template>
  <p :foo=" bar "></p>
</template>
<template>
  <p @foo=" bar "></p>
</template>
<template>
  <!-- eslint galaxy/vue-attribute-spacing: ["error", "always"] -->
  <p v-foo="bar"></p>
</template>
<template>
  <!-- eslint galaxy/vue-attribute-spacing: ["error", "always"] -->
  <p :foo="bar"></p>
</template>
<template>
  <!-- eslint galaxy/vue-attribute-spacing: ["error", "always"] -->
  <p @foo="bar"></p>
</template>

Pass

<template>
  <p :foo="bar"></p>
</template>
<template>
  <p foo=" bar "></p>
</template>
<template>
  <p>{{ bar }}</p>
</template>
<template>
  <!-- eslint galaxy/vue-attribute-spacing: ["error", "always"] -->
  <p :foo=" bar "></p>
</template>