Skip to content

Commit

Permalink
Add vue/one-component-per-file rule.
Browse files Browse the repository at this point in the history
  • Loading branch information
armano2 committed Nov 24, 2018
1 parent c6bbd95 commit f181cf7
Show file tree
Hide file tree
Showing 4 changed files with 173 additions and 1 deletion.
33 changes: 33 additions & 0 deletions docs/rules/one-component-per-file.md
@@ -0,0 +1,33 @@
# enforce that each component should be in its own file

## :book: Rule Details

This rule checks if there is oly one component per file.

:-1: Examples of **incorrect** code for this rule:

```js
Vue.component('TodoList', {
// ...
})

Vue.component('TodoItem', {
// ...
})
```

:+1: Examples of **correct** code for this rule:

```js
export default {
name: 'my-component'
}
```

## :wrench: Options

Nothing.

## :books: Further reading

- [Style guide - Component files](https://vuejs.org/v2/style-guide/#Component-files-strongly-recommended)
2 changes: 1 addition & 1 deletion lib/rules/no-v-html.js
Expand Up @@ -6,7 +6,7 @@
const utils = require('../utils')

// ------------------------------------------------------------------------------
// Rule Definitionutilu
// Rule Definition
// ------------------------------------------------------------------------------

module.exports = {
Expand Down
45 changes: 45 additions & 0 deletions lib/rules/one-component-per-file.js
@@ -0,0 +1,45 @@
/**
* @fileoverview enforce that each component should be in its own file
* @author Armano
*/
'use strict'
const utils = require('../utils')

// ------------------------------------------------------------------------------
// Rule Definition
// ------------------------------------------------------------------------------

module.exports = {
meta: {
type: 'suggestion',
docs: {
description: 'enforce that each component should be in its own file',
category: undefined, // strongly-recommended
url: 'https://github.com/vuejs/eslint-plugin-vue/blob/v5.0.0-beta.5/docs/rules/one-component-per-file.md'
},
fixable: null,
schema: [],
messages: {
toManyComponents: 'There is more than one component in this file.'
}
},
create (context) {
let componentCount = 0

return Object.assign({},
utils.executeOnVueComponent(context, () => {
++componentCount
}),
{
'Program:exit' (node) {
if (componentCount > 1) {
context.report({
node: node,
messageId: 'toManyComponents'
})
}
}
}
)
}
}
94 changes: 94 additions & 0 deletions tests/lib/rules/one-component-per-file.js
@@ -0,0 +1,94 @@
/**
* @fileoverview enforce that each component should be in its own file
* @author Armano
*/
'use strict'

// ------------------------------------------------------------------------------
// Requirements
// ------------------------------------------------------------------------------

const rule = require('../../../lib/rules/one-component-per-file')
const RuleTester = require('eslint').RuleTester

const ruleTester = new RuleTester({
parserOptions: {
ecmaVersion: 2018,
sourceType: 'module'
}
})

ruleTester.run('one-component-per-file', rule, {
valid: [
{
filename: 'test.js',
code: `Vue.component('name', {})`
},
{
filename: 'test.js',
code: `
Vue.component('name', {})
new Vue({})
`
},
{
filename: 'test.js',
code: `
const foo = {}
new Vue({})
`
},
{
filename: 'test.vue',
code: `export default {}`
},
{
filename: 'test.vue',
code: `export default {
components: {
test: {
name: 'foo'
}
}
}`
}
],
invalid: [
{
filename: 'test.js',
code: `
Vue.component('name', {})
Vue.component('name', {})
`,
errors: [{
message: 'There is more than one component in this file.'
}]
},
{
filename: 'test.js',
code: `
Vue.component('TodoList', {
// ...
})
Vue.component('TodoItem', {
// ...
})
export default {}
`,
errors: [{
message: 'There is more than one component in this file.'
}]
},
{
filename: 'test.vue',
code: `
Vue.component('name', {})
export default {}
`,
errors: [{
message: 'There is more than one component in this file.'
}]
}
]
})

0 comments on commit f181cf7

Please sign in to comment.