Skip to content

Commit af12450

Browse files
committed
⭐️New: Add vue/comma-dangle rule
1 parent 9c49dcc commit af12450

File tree

6 files changed

+101
-0
lines changed

6 files changed

+101
-0
lines changed

docs/rules/README.md

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -140,6 +140,7 @@ For example:
140140
| Rule ID | Description | |
141141
|:--------|:------------|:---|
142142
| [vue/array-bracket-spacing](./array-bracket-spacing.md) | enforce consistent spacing inside array brackets | :wrench: |
143+
| [vue/comma-dangle](./comma-dangle.md) | require or disallow trailing commas | :wrench: |
143144
| [vue/component-name-in-template-casing](./component-name-in-template-casing.md) | enforce specific casing for the component naming style in template | :wrench: |
144145
| [vue/eqeqeq](./eqeqeq.md) | require the use of `===` and `!==` | :wrench: |
145146
| [vue/key-spacing](./key-spacing.md) | enforce consistent spacing between keys and values in object literal properties | :wrench: |

docs/rules/comma-dangle.md

Lines changed: 23 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,23 @@
1+
---
2+
pageClass: rule-details
3+
sidebarDepth: 0
4+
title: vue/comma-dangle
5+
description: require or disallow trailing commas
6+
---
7+
# vue/comma-dangle
8+
> require or disallow trailing commas
9+
10+
- :wrench: The `--fix` option on the [command line](https://eslint.org/docs/user-guide/command-line-interface#fixing-problems) can automatically fix some of the problems reported by this rule.
11+
12+
This rule is the same rule as core [comma-dangle] rule but it applies to the expressions in `<template>`.
13+
14+
## :books: Further reading
15+
16+
- [comma-dangle]
17+
18+
[comma-dangle]: https://eslint.org/docs/rules/comma-dangle
19+
20+
## :mag: Implementation
21+
22+
- [Rule source](https://github.com/vuejs/eslint-plugin-vue/blob/master/lib/rules/comma-dangle.js)
23+
- [Test source](https://github.com/vuejs/eslint-plugin-vue/blob/master/tests/lib/rules/comma-dangle.js)

lib/configs/no-layout-rules.js

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,7 @@
66
module.exports = {
77
rules: {
88
'vue/array-bracket-spacing': 'off',
9+
'vue/comma-dangle': 'off',
910
'vue/html-closing-bracket-newline': 'off',
1011
'vue/html-closing-bracket-spacing': 'off',
1112
'vue/html-indent': 'off',

lib/index.js

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -10,6 +10,7 @@ module.exports = {
1010
'array-bracket-spacing': require('./rules/array-bracket-spacing'),
1111
'attribute-hyphenation': require('./rules/attribute-hyphenation'),
1212
'attributes-order': require('./rules/attributes-order'),
13+
'comma-dangle': require('./rules/comma-dangle'),
1314
'comment-directive': require('./rules/comment-directive'),
1415
'component-name-in-template-casing': require('./rules/component-name-in-template-casing'),
1516
'eqeqeq': require('./rules/eqeqeq'),

lib/rules/comma-dangle.js

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
/**
2+
* @author Yosuke Ota
3+
*/
4+
'use strict'
5+
6+
const { wrapCoreRule } = require('../utils')
7+
8+
// eslint-disable-next-line
9+
module.exports = wrapCoreRule(require('eslint/lib/rules/comma-dangle'))

tests/lib/rules/comma-dangle.js

Lines changed: 66 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,66 @@
1+
/**
2+
* @author Yosuke Ota
3+
*/
4+
'use strict'
5+
6+
const RuleTester = require('eslint').RuleTester
7+
const rule = require('../../../lib/rules/comma-dangle')
8+
9+
const tester = new RuleTester({
10+
parser: 'vue-eslint-parser',
11+
parserOptions: { ecmaVersion: 2018 }
12+
})
13+
14+
tester.run('comma-dangle', rule, {
15+
valid: [
16+
`<template>
17+
<button @click="() => fn([a, b])" ></button>
18+
</template>`,
19+
{
20+
code: `
21+
<template>
22+
<CustomButton @click="($event, data) => fn()" />
23+
</template>`,
24+
options: [{
25+
'functions': 'never'
26+
}]
27+
}
28+
],
29+
invalid: [
30+
{
31+
code: `
32+
<template>
33+
<button @click="() => fn([a, b,])" ></button>
34+
</template>`,
35+
output: `
36+
<template>
37+
<button @click="() => fn([a, b])" ></button>
38+
</template>`,
39+
errors: [
40+
{
41+
message: 'Unexpected trailing comma.',
42+
line: 3
43+
}
44+
]
45+
},
46+
{
47+
code: `
48+
<template>
49+
<CustomButton @click="($event, data,) => fn()" />
50+
</template>`,
51+
options: [{
52+
'functions': 'never'
53+
}],
54+
output: `
55+
<template>
56+
<CustomButton @click="($event, data) => fn()" />
57+
</template>`,
58+
errors: [
59+
{
60+
message: 'Unexpected trailing comma.',
61+
line: 3
62+
}
63+
]
64+
}
65+
]
66+
})

0 commit comments

Comments
 (0)