Skip to content

Update master branch #22

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 11 commits into from
Jun 16, 2017
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 2 additions & 0 deletions .eslintignore
Original file line number Diff line number Diff line change
@@ -0,0 +1,2 @@
node_modules
lib/recommended-rules.js
22 changes: 22 additions & 0 deletions .eslintrc.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,22 @@
module.exports = {
root: true,
parserOptions: {
ecmaVersion: 6
},
env: {
node: true,
mocha: true
},
extends: [
'plugin:eslint-plugin/recommended',
'plugin:vue-libs/recommended'
],
plugins: [
'eslint-plugin'
],
rules: {
'eslint-plugin/report-message-format': ['error', '^[A-Z].*\\.$'],
'eslint-plugin/prefer-placeholders': 'error',
'eslint-plugin/consistent-output': 'error'
}
}
1 change: 1 addition & 0 deletions .gitattributes
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
* text=auto eol=lf
6 changes: 4 additions & 2 deletions .gitignore
Original file line number Diff line number Diff line change
@@ -1,2 +1,4 @@
node_modules
.DS_Store
/.nyc_output
/coverage
/node_modules
/test.*
12 changes: 6 additions & 6 deletions LICENSE
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
The MIT License (MIT)
MIT License

Copyright (c) 2016 Evan You
Copyright (c) 2017 Toru Nagashima

Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
Expand All @@ -9,13 +9,13 @@ to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:

The above copyright notice and this permission notice shall be included in
all copies or substantial portions of the Software.
The above copyright notice and this permission notice shall be included in all
copies or substantial portions of the Software.

THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
THE SOFTWARE.
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
SOFTWARE.
152 changes: 128 additions & 24 deletions README.md
Original file line number Diff line number Diff line change
@@ -1,34 +1,138 @@
# eslint-plugin-vue

ESLint plugin for Vue.js projects
[![NPM version](https://img.shields.io/npm/v/eslint-plugin-vue.svg?style=flat)](https://npmjs.org/package/eslint-plugin-vue)
[![NPM downloads](https://img.shields.io/npm/dm/eslint-plugin-vue.svg?style=flat)](https://npmjs.org/package/eslint-plugin-vue)
[![CircleCI](https://circleci.com/gh/vuejs/eslint-plugin-vue.svg?style=svg)](https://circleci.com/gh/vuejs/eslint-plugin-vue)

## Usage
> Official ESLint plugin for Vue.js

1. `npm install --save-dev eslint-plugin-vue`
2. create a file named `.eslintrc` in your project:
## :exclamation: Attention - this is documentation for beta `3.0.0` :exclamation:

This branch contains `eslint-plugin-vue@beta` which is pre-released `3.0`, but it's not the default version that you get with `npm install eslint-plugin-vue`. In order to install this you need to specify either `"eslint-plugin-vue": "beta"` in `package.json` or do `npm install eslint-plugin-vue@beta`.

Please try it and report any issues that you might experience.

If you want to check previous releases [go here](https://github.com/vuejs/eslint-plugin-vue/releases).

## :grey_exclamation: Requirements

- [ESLint](http://eslint.org/) `>=3.18.0`.
- Node.js `>=4.0.0`

## :cd: Installation

```js
{
extends: [ /* your usual extends */ ],
 plugins: ["vue"],
rules: {
   'vue/jsx-uses-vars': 2,
},
}
```
3. OPTIONAL: install [eslint-config-vue](https://github.com/vuejs/eslint-config-vue): `npm install --save-dev eslint-config-vue`
4. OPTIONAL: then use the recommended configurations in your `.eslintrc`:

```js
{
 extends: ["vue", /* your other extends */],
 plugins: ["vue"],
 rules: {
   /* your overrides -- vue/jsx-uses-vars is included in eslint-config-vue */
 },
npm install --save-dev eslint eslint-plugin-vue@beta
```

## :rocket: Usage

Create `.eslintrc.*` file to configure rules. See also: [http://eslint.org/docs/user-guide/configuring](http://eslint.org/docs/user-guide/configuring).

Example **.eslintrc.js**:

```javascript
module.exports = {
extends: [
'eslint:recommended',
'plugin:vue/recommended' // or 'plugin:vue/base'
],
rules: {
// override/add rules' settings here
'vue/no-invalid-v-if': 'error'
}
}
```

## License
## ⚙ Configs

This plugin provides two predefined configs:
- `plugin:vue/base` - contains necessary settings for this plugin to work properly
- `plugin:vue/recommended` - extends base config with recommended rules (the ones with check mark :white_check_mark: in the table below)

## :bulb: Rules

Rules are grouped by category to help you understand their purpose.

No rules are enabled by `plugin:vue/base` config. The `plugin:vue/recommended` config enables rules that report common problems, which have a check mark :white_check_mark: below.

The `--fix` option on the command line automatically fixes problems reported by rules which have a wrench :wrench: below.

<!--RULES_TABLE_START-->

### Best Practices

| | Rule ID | Description |
|:---|:--------|:------------|
| :wrench: | [html-end-tags](./docs/rules/html-end-tags.md) | enforce end tag style. |
| :white_check_mark::wrench: | [html-no-self-closing](./docs/rules/html-no-self-closing.md) | disallow self-closing elements. |
| :white_check_mark: | [no-confusing-v-for-v-if](./docs/rules/no-confusing-v-for-v-if.md) | disallow confusing `v-for` and `v-if` on the same element. |
| | [no-duplicate-attributes](./docs/rules/no-duplicate-attributes.md) | disallow duplicate arguments. |
| :white_check_mark: | [no-textarea-mustache](./docs/rules/no-textarea-mustache.md) | disallow mustaches in `<textarea>`. |
| :white_check_mark: | [require-component-is](./docs/rules/require-component-is.md) | require `v-bind:is` of `<component>` elements. |
| :white_check_mark: | [require-v-for-key](./docs/rules/require-v-for-key.md) | require `v-bind:key` with `v-for` directives. |


### Stylistic Issues

| | Rule ID | Description |
|:---|:--------|:------------|
| | [html-quotes](./docs/rules/html-quotes.md) | enforce quotes style of HTML attributes. |
| :wrench: | [v-bind-style](./docs/rules/v-bind-style.md) | enforce v-bind directive style. |
| :wrench: | [v-on-style](./docs/rules/v-on-style.md) | enforce v-on directive style. |


### Variables

| | Rule ID | Description |
|:---|:--------|:------------|
| :white_check_mark: | [jsx-uses-vars](./docs/rules/jsx-uses-vars.md) | Prevent variables used in JSX to be marked as unused |


### Possible Errors

| | Rule ID | Description |
|:---|:--------|:------------|
| :white_check_mark: | [no-invalid-template-root](./docs/rules/no-invalid-template-root.md) | disallow invalid template root. |
| :white_check_mark: | [no-invalid-v-bind](./docs/rules/no-invalid-v-bind.md) | disallow invalid v-bind directives. |
| :white_check_mark: | [no-invalid-v-cloak](./docs/rules/no-invalid-v-cloak.md) | disallow invalid v-cloak directives. |
| :white_check_mark: | [no-invalid-v-else-if](./docs/rules/no-invalid-v-else-if.md) | disallow invalid v-else-if directives. |
| :white_check_mark: | [no-invalid-v-else](./docs/rules/no-invalid-v-else.md) | disallow invalid v-else directives. |
| :white_check_mark: | [no-invalid-v-for](./docs/rules/no-invalid-v-for.md) | disallow invalid v-for directives. |
| :white_check_mark: | [no-invalid-v-html](./docs/rules/no-invalid-v-html.md) | disallow invalid v-html directives. |
| :white_check_mark: | [no-invalid-v-if](./docs/rules/no-invalid-v-if.md) | disallow invalid v-if directives. |
| :white_check_mark: | [no-invalid-v-model](./docs/rules/no-invalid-v-model.md) | disallow invalid v-model directives. |
| :white_check_mark: | [no-invalid-v-on](./docs/rules/no-invalid-v-on.md) | disallow invalid v-on directives. |
| :white_check_mark: | [no-invalid-v-once](./docs/rules/no-invalid-v-once.md) | disallow invalid v-once directives. |
| :white_check_mark: | [no-invalid-v-pre](./docs/rules/no-invalid-v-pre.md) | disallow invalid v-pre directives. |
| :white_check_mark: | [no-invalid-v-show](./docs/rules/no-invalid-v-show.md) | disallow invalid v-show directives. |
| :white_check_mark: | [no-invalid-v-text](./docs/rules/no-invalid-v-text.md) | disallow invalid v-text directives. |
| :white_check_mark: | [no-parsing-error](./docs/rules/no-parsing-error.md) | disallow parsing errors in `<template>`. |

<!--RULES_TABLE_END-->

## :anchor: Semantic Versioning Policy

This plugin follows [semantic versioning](http://semver.org/) and [ESLint's Semantic Versioning Policy](https://github.com/eslint/eslint#semantic-versioning-policy).

## :newspaper: Changelog

We're using [GitHub Releases](https://github.com/vuejs/eslint-plugin-vue/releases).

## :beers: Contribution guide

In order to add a new rule, you should:
- Create issue on GH with description of proposed rule
- Generate a new rule using the [official yeoman generator](https://github.com/eslint/generator-eslint)
- Run `npm start`
- Write test scenarios & implement logic
- Describe the rule in the generated `docs` file
- Make sure all tests are passing
- Run `npm run update` in order to update readme and recommended configuration
- Create PR and link created issue in description

We're more than happy to see potential contributions, so don't hesitate. If you have any suggestions, ideas or problems feel free to add new [issue](https://github.com/vuejs/eslint-plugin-vue/issues), but first please make sure your question does not repeat previous ones.

## :lock: License

[MIT](http://opensource.org/licenses/MIT)
See the [LICENSE](LICENSE) file for license rights and limitations (MIT).
15 changes: 15 additions & 0 deletions circle.yml
Original file line number Diff line number Diff line change
@@ -0,0 +1,15 @@
machine:
node:
version: 4

dependencies:
pre:
- nvm install 7
- nvm install 8

test:
override:
- npm test
- nvm use 6 && npm test
- nvm use 7 && npm test
- nvm use 8 && npm test
53 changes: 53 additions & 0 deletions docs/rules/html-end-tags.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,53 @@
# Enforce end tag style (html-end-tags)

- 🔧 This rule is fixable with `eslint --fix` command.

This rule enforce the way of end tags.

- [Void elements] disallow end tags.
- Other elements require end tags.

## 📖 Rule Details

This rule reports the following elements:

- [Void elements] which have end tags.
- Other elements which do not have end tags and are not self-closing.

👎 Examples of **incorrect** code for this rule:

```html
<template>
<div>
<div>
<p>
<p>
<input></input>
<br></br>
</div>
</template>
```

👍 Examples of **correct** code for this rule:

```html
<template>
<div>
<div></div>
<p></p>
<p></p>
<input>
<br>
</div>
</template>
```

## 🔧 Options

Nothing.

[Void elements]: https://www.w3.org/TR/html51/syntax.html#void-elements

## TODO: `<br></br>`

`parse5` does not recognize the illegal end tags of void elements.
38 changes: 38 additions & 0 deletions docs/rules/html-no-self-closing.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,38 @@
# Disallow self-closing elements (html-no-self-closing)

- 🔧 This rule is fixable with `eslint --fix` command.

Self-closing (e.g. `<br/>`) is syntax of XML/XHTML.
HTML ignores it.

## 📖 Rule Details

This rule reports every self-closing element except XML context.

👎 Examples of **incorrect** code for this rule:

```html
<template>
<div>
<img src="./logo.png"/>
</div>
</template>
```

👍 Examples of **correct** code for this rule:

```html
<template>
<div>
<img src="./logo.png">
<svg>
<!-- this is XML context -->
<rect width="100" height="100" />
</svg>
</div>
</template>
```

## 🔧 Options

Nothing.
60 changes: 60 additions & 0 deletions docs/rules/html-quotes.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,60 @@
# Enforce quotes style of HTML attributes (html-quotes)

You can shoose quotes of HTML attributes from:

- Double quotes: `<div class="foo">`
- Single quotes: `<div class='foo'>`
- No quotes: `<div class=foo>`

This rule enforces the quotes style of HTML attributes.

## 📖 Rule Details

This rule reports the quotes of attributes if it is different to configured quotes.

👎 Examples of **incorrect** code for this rule:

```html
<template>
<div>
<img src='./logo.png'>
<img src=./logo.png>
</div>
</template>
```

👍 Examples of **correct** code for this rule:

```html
<template>
<div>
<img src="./logo.png">
</div>
</template>
```

👎 Examples of **incorrect** code for this rule with `"single"` option:

```html
<template>
<div>
<img src="./logo.png">
<img src=./logo.png>
</div>
</template>
```

👍 Examples of **correct** code for this rule with `"single"` option:

```html
<template>
<div>
<img src='./logo.png'>
</div>
</template>
```

## 🔧 Options

- `"double"` (default) ... requires double quotes.
- `"single"` ... requires single quotes.
Loading