From 470b43c8c70d283c10b788dc3560cf29a375aa0f Mon Sep 17 00:00:00 2001
From: Chris Fritz <chrisvfritz@gmail.com>
Date: Sun, 8 Oct 2017 10:14:28 -0400
Subject: [PATCH 01/10] update recommended rules to match style guide

---
 .gitignore                                    |  1 +
 README.md                                     | 46 +++++++++---------
 docs/rules/attribute-hyphenation.md           |  1 +
 docs/rules/html-end-tags.md                   |  1 +
 docs/rules/html-self-closing.md               |  1 +
 docs/rules/max-attributes-per-line.md         |  2 +
 docs/rules/mustache-interpolation-spacing.md  |  1 +
 docs/rules/name-property-casing.md            |  1 +
 docs/rules/no-async-in-computed-properties.md |  2 +
 docs/rules/no-dupe-keys.md                    |  2 +
 docs/rules/no-duplicate-attributes.md         |  4 +-
 docs/rules/no-multi-spaces.md                 |  1 +
 docs/rules/no-reserved-keys.md                |  2 +
 docs/rules/no-shared-component-data.md        |  2 +
 .../no-side-effects-in-computed-properties.md |  2 +
 docs/rules/no-template-key.md                 |  2 +
 docs/rules/order-in-components.md             |  2 +
 docs/rules/require-default-prop.md            |  2 +
 docs/rules/require-prop-types.md              |  2 +
 docs/rules/require-render-return.md           |  2 +
 docs/rules/require-valid-default-prop.md      |  2 +
 docs/rules/return-in-computed-property.md     |  2 +
 docs/rules/this-in-template.md                |  2 +
 docs/rules/v-bind-style.md                    |  1 +
 docs/rules/v-on-style.md                      |  1 +
 lib/recommended-rules.js                      | 48 +++++++++----------
 lib/rules/attribute-hyphenation.js            |  2 +-
 lib/rules/html-end-tags.js                    |  2 +-
 lib/rules/html-no-self-closing.js             |  2 +-
 lib/rules/html-quotes.js                      |  2 +-
 lib/rules/html-self-closing.js                |  4 +-
 lib/rules/max-attributes-per-line.js          |  4 +-
 lib/rules/mustache-interpolation-spacing.js   |  2 +-
 lib/rules/name-property-casing.js             |  2 +-
 lib/rules/no-async-in-computed-properties.js  |  2 +-
 lib/rules/no-dupe-keys.js                     |  2 +-
 lib/rules/no-duplicate-attributes.js          |  4 +-
 lib/rules/no-multi-spaces.js                  |  2 +-
 lib/rules/no-reserved-keys.js                 |  2 +-
 lib/rules/no-shared-component-data.js         |  2 +-
 .../no-side-effects-in-computed-properties.js |  2 +-
 lib/rules/no-template-key.js                  |  2 +-
 lib/rules/order-in-components.js              | 20 ++++----
 lib/rules/require-default-prop.js             |  2 +-
 lib/rules/require-prop-types.js               |  2 +-
 lib/rules/require-render-return.js            |  2 +-
 lib/rules/require-valid-default-prop.js       |  2 +-
 lib/rules/return-in-computed-property.js      |  2 +-
 lib/rules/this-in-template.js                 |  2 +-
 lib/rules/v-bind-style.js                     |  4 +-
 lib/rules/v-on-style.js                       |  4 +-
 tools/update-rules.js                         |  6 ++-
 52 files changed, 133 insertions(+), 86 deletions(-)

diff --git a/.gitignore b/.gitignore
index f5ee9df9b..a56cde83a 100644
--- a/.gitignore
+++ b/.gitignore
@@ -3,3 +3,4 @@
 /tests/integrations/*/node_modules
 /node_modules
 /test.*
+yarn.lock
diff --git a/README.md b/README.md
index 62121c2e1..7d874277a 100644
--- a/README.md
+++ b/README.md
@@ -92,15 +92,15 @@ The `--fix` option on the command line automatically fixes problems reported by
 
 |    | Rule ID | Description |
 |:---|:--------|:------------|
-|  | [no-dupe-keys](./docs/rules/no-dupe-keys.md) | disallow duplication of field names |
+| :white_check_mark: | [no-dupe-keys](./docs/rules/no-dupe-keys.md) | disallow duplication of field names |
 | :white_check_mark: | [no-parsing-error](./docs/rules/no-parsing-error.md) | disallow parsing errors in `<template>` |
-|  | [no-reserved-keys](./docs/rules/no-reserved-keys.md) | disallow overwriting reserved keys |
-|  | [no-shared-component-data](./docs/rules/no-shared-component-data.md) | enforce component's data property to be a function |
-|  | [no-template-key](./docs/rules/no-template-key.md) | disallow `key` attribute on `<template>` |
+| :white_check_mark: | [no-reserved-keys](./docs/rules/no-reserved-keys.md) | disallow overwriting reserved keys |
+| :white_check_mark: | [no-shared-component-data](./docs/rules/no-shared-component-data.md) | enforce component's data property to be a function |
+| :white_check_mark: | [no-template-key](./docs/rules/no-template-key.md) | disallow `key` attribute on `<template>` |
 |  | [no-unused-vars](./docs/rules/no-unused-vars.md) | disallow unused variable definitions of v-for directives or scope attributes |
-|  | [require-render-return](./docs/rules/require-render-return.md) | enforce render function to always return value |
-|  | [require-valid-default-prop](./docs/rules/require-valid-default-prop.md) | enforce props default values to be valid |
-|  | [return-in-computed-property](./docs/rules/return-in-computed-property.md) | enforce that a return statement is present in computed property |
+| :white_check_mark: | [require-render-return](./docs/rules/require-render-return.md) | enforce render function to always return value |
+| :white_check_mark: | [require-valid-default-prop](./docs/rules/require-valid-default-prop.md) | enforce props default values to be valid |
+| :white_check_mark: | [return-in-computed-property](./docs/rules/return-in-computed-property.md) | enforce that a return statement is present in computed property |
 | :white_check_mark: | [valid-template-root](./docs/rules/valid-template-root.md) | enforce valid template root |
 | :white_check_mark: | [valid-v-bind](./docs/rules/valid-v-bind.md) | enforce valid `v-bind` directives |
 | :white_check_mark: | [valid-v-cloak](./docs/rules/valid-v-cloak.md) | enforce valid `v-cloak` directives |
@@ -121,34 +121,34 @@ The `--fix` option on the command line automatically fixes problems reported by
 
 |    | Rule ID | Description |
 |:---|:--------|:------------|
-| :wrench: | [html-end-tags](./docs/rules/html-end-tags.md) | enforce end tag style |
-|  | [no-async-in-computed-properties](./docs/rules/no-async-in-computed-properties.md) | disallow asynchronous actions in computed properties |
+| :white_check_mark::wrench: | [html-end-tags](./docs/rules/html-end-tags.md) | enforce end tag style |
+| :white_check_mark: | [no-async-in-computed-properties](./docs/rules/no-async-in-computed-properties.md) | disallow asynchronous actions in computed properties |
 | :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 duplication of attributes |
-|  | [no-side-effects-in-computed-properties](./docs/rules/no-side-effects-in-computed-properties.md) | disallow side effects in computed properties |
+| :white_check_mark: | [no-duplicate-attributes](./docs/rules/no-duplicate-attributes.md) | disallow duplication of attributes |
+| :white_check_mark: | [no-side-effects-in-computed-properties](./docs/rules/no-side-effects-in-computed-properties.md) | disallow side effects in computed properties |
 | :white_check_mark: | [no-textarea-mustache](./docs/rules/no-textarea-mustache.md) | disallow mustaches in `<textarea>` |
-|  | [order-in-components](./docs/rules/order-in-components.md) | enforce order of properties in components |
+| :white_check_mark: | [order-in-components](./docs/rules/order-in-components.md) | enforce order of properties in components |
 | :white_check_mark: | [require-component-is](./docs/rules/require-component-is.md) | require `v-bind:is` of `<component>` elements |
-|  | [require-default-prop](./docs/rules/require-default-prop.md) | require default value for props |
-|  | [require-prop-types](./docs/rules/require-prop-types.md) | require type definitions in props |
+| :white_check_mark: | [require-default-prop](./docs/rules/require-default-prop.md) | require default value for props |
+| :white_check_mark: | [require-prop-types](./docs/rules/require-prop-types.md) | require type definitions in props |
 | :white_check_mark: | [require-v-for-key](./docs/rules/require-v-for-key.md) | require `v-bind:key` with `v-for` directives |
-|  | [this-in-template](./docs/rules/this-in-template.md) | enforce usage of `this` in template |
+| :white_check_mark: | [this-in-template](./docs/rules/this-in-template.md) | enforce usage of `this` in template |
 
 
 ### Stylistic Issues
 
 |    | Rule ID | Description |
 |:---|:--------|:------------|
-| :wrench: | [attribute-hyphenation](./docs/rules/attribute-hyphenation.md) | enforce attribute naming style in template |
+| :white_check_mark::wrench: | [attribute-hyphenation](./docs/rules/attribute-hyphenation.md) | enforce attribute naming style in template |
 | :wrench: | [html-indent](./docs/rules/html-indent.md) | enforce consistent indentation in `<template>` |
 |  | [html-quotes](./docs/rules/html-quotes.md) | enforce quotes style of HTML attributes |
-| :wrench: | [html-self-closing](./docs/rules/html-self-closing.md) | enforce self-closing style |
-|  | [max-attributes-per-line](./docs/rules/max-attributes-per-line.md) | enforce the maximum number of attributes per line |
-| :wrench: | [mustache-interpolation-spacing](./docs/rules/mustache-interpolation-spacing.md) | enforce unified spacing in mustache interpolations |
-| :wrench: | [name-property-casing](./docs/rules/name-property-casing.md) | enforce specific casing for the name property in Vue components |
-| :wrench: | [no-multi-spaces](./docs/rules/no-multi-spaces.md) | disallow multiple spaces |
-| :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 |
+| :white_check_mark::wrench: | [html-self-closing](./docs/rules/html-self-closing.md) | enforce self-closing style |
+| :white_check_mark: | [max-attributes-per-line](./docs/rules/max-attributes-per-line.md) | enforce the maximum number of attributes per line |
+| :white_check_mark::wrench: | [mustache-interpolation-spacing](./docs/rules/mustache-interpolation-spacing.md) | enforce unified spacing in mustache interpolations |
+| :white_check_mark::wrench: | [name-property-casing](./docs/rules/name-property-casing.md) | enforce specific casing for the name property in Vue components |
+| :white_check_mark::wrench: | [no-multi-spaces](./docs/rules/no-multi-spaces.md) | disallow multiple spaces |
+| :white_check_mark::wrench: | [v-bind-style](./docs/rules/v-bind-style.md) | enforce `v-bind` directive style |
+| :white_check_mark::wrench: | [v-on-style](./docs/rules/v-on-style.md) | enforce `v-on` directive style |
 
 
 ### Variables
diff --git a/docs/rules/attribute-hyphenation.md b/docs/rules/attribute-hyphenation.md
index 0028c2a58..b6a7049a4 100644
--- a/docs/rules/attribute-hyphenation.md
+++ b/docs/rules/attribute-hyphenation.md
@@ -1,5 +1,6 @@
 # enforce attribute naming style in template (attribute-hyphenation)
 
+- :white_check_mark: The `"extends": "plugin:vue/recommended"` property in a configuration file enables this rule.
 - :wrench: The `--fix` option on the [command line](http://eslint.org/docs/user-guide/command-line-interface#fix) can automatically fix some of the problems reported by this rule.
 
 ## :wrench: Options
diff --git a/docs/rules/html-end-tags.md b/docs/rules/html-end-tags.md
index 51acebeda..891ef6952 100644
--- a/docs/rules/html-end-tags.md
+++ b/docs/rules/html-end-tags.md
@@ -1,5 +1,6 @@
 # enforce end tag style (html-end-tags)
 
+- :white_check_mark: The `"extends": "plugin:vue/recommended"` property in a configuration file enables this rule.
 - :wrench: The `--fix` option on the [command line](http://eslint.org/docs/user-guide/command-line-interface#fix) can automatically fix some of the problems reported by this rule.
 
 This rule enforce the way of end tags.
diff --git a/docs/rules/html-self-closing.md b/docs/rules/html-self-closing.md
index 760ebb0b1..9ff3cb698 100644
--- a/docs/rules/html-self-closing.md
+++ b/docs/rules/html-self-closing.md
@@ -1,5 +1,6 @@
 # enforce self-closing style (html-self-closing)
 
+- :white_check_mark: The `"extends": "plugin:vue/recommended"` property in a configuration file enables this rule.
 - :wrench: The `--fix` option on the [command line](http://eslint.org/docs/user-guide/command-line-interface#fix) can automatically fix some of the problems reported by this rule.
 
 In Vue.js template, we can use either two styles for elements which don't have their content.
diff --git a/docs/rules/max-attributes-per-line.md b/docs/rules/max-attributes-per-line.md
index 8920a766b..bc745bdd3 100644
--- a/docs/rules/max-attributes-per-line.md
+++ b/docs/rules/max-attributes-per-line.md
@@ -1,5 +1,7 @@
 # enforce the maximum number of attributes per line (max-attributes-per-line)
 
+- :white_check_mark: The `"extends": "plugin:vue/recommended"` property in a configuration file enables this rule.
+
 Limits the maximum number of attributes/properties per line to improve readability.
 
 
diff --git a/docs/rules/mustache-interpolation-spacing.md b/docs/rules/mustache-interpolation-spacing.md
index fcb385891..4e1506930 100644
--- a/docs/rules/mustache-interpolation-spacing.md
+++ b/docs/rules/mustache-interpolation-spacing.md
@@ -1,5 +1,6 @@
 # enforce unified spacing in mustache interpolations (mustache-interpolation-spacing)
 
+- :white_check_mark: The `"extends": "plugin:vue/recommended"` property in a configuration file enables this rule.
 - :wrench: The `--fix` option on the [command line](http://eslint.org/docs/user-guide/command-line-interface#fix) can automatically fix some of the problems reported by this rule.
 
 ## :book: Rule Details
diff --git a/docs/rules/name-property-casing.md b/docs/rules/name-property-casing.md
index 648935b58..84dcdd3e2 100644
--- a/docs/rules/name-property-casing.md
+++ b/docs/rules/name-property-casing.md
@@ -1,5 +1,6 @@
 # enforce specific casing for the name property in Vue components (name-property-casing)
 
+- :white_check_mark: The `"extends": "plugin:vue/recommended"` property in a configuration file enables this rule.
 - :wrench: The `--fix` option on the [command line](http://eslint.org/docs/user-guide/command-line-interface#fix) can automatically fix some of the problems reported by this rule.
 
 Define a style for the `name` property casing for consistency purposes.
diff --git a/docs/rules/no-async-in-computed-properties.md b/docs/rules/no-async-in-computed-properties.md
index 4fd8790a3..6563bf5dd 100644
--- a/docs/rules/no-async-in-computed-properties.md
+++ b/docs/rules/no-async-in-computed-properties.md
@@ -1,5 +1,7 @@
 # disallow asynchronous actions in computed properties (no-async-in-computed-properties)
 
+- :white_check_mark: The `"extends": "plugin:vue/recommended"` property in a configuration file enables this rule.
+
 Computed properties should be synchronous. Asynchronous actions inside them may not work as expected and can lead to an unexpected behaviour, that's why you should avoid them.
 If you need async computed properties you might want to consider using additional plugin [vue-async-computed]
 
diff --git a/docs/rules/no-dupe-keys.md b/docs/rules/no-dupe-keys.md
index 6f3bb547a..7f0d0061b 100644
--- a/docs/rules/no-dupe-keys.md
+++ b/docs/rules/no-dupe-keys.md
@@ -1,5 +1,7 @@
 # disallow duplication of field names (no-dupe-keys)
 
+- :white_check_mark: The `"extends": "plugin:vue/recommended"` property in a configuration file enables this rule.
+
 This rule prevents to use duplicated names.
 
 ## :book: Rule Details
diff --git a/docs/rules/no-duplicate-attributes.md b/docs/rules/no-duplicate-attributes.md
index c5c929d15..c62dc316d 100644
--- a/docs/rules/no-duplicate-attributes.md
+++ b/docs/rules/no-duplicate-attributes.md
@@ -1,5 +1,7 @@
 # disallow duplication of attributes (no-duplicate-attributes)
 
+- :white_check_mark: The `"extends": "plugin:vue/recommended"` property in a configuration file enables this rule.
+
 When duplicate arguments exist, only the last one is valid.
 It's possibly mistakes.
 
@@ -33,7 +35,7 @@ This rule reports duplicate attributes.
 ```
 'vue/no-duplicate-attributes': [2, {
   allowCoexistClass: Boolean // default: true
-  allowCoexistStyle: Boolean, // default: true
+  allowCoexistStyle: Boolean, // default: false
 }]
 ```
 
diff --git a/docs/rules/no-multi-spaces.md b/docs/rules/no-multi-spaces.md
index c098248d5..b94c54cb5 100644
--- a/docs/rules/no-multi-spaces.md
+++ b/docs/rules/no-multi-spaces.md
@@ -1,5 +1,6 @@
 # disallow multiple spaces (no-multi-spaces)
 
+- :white_check_mark: The `"extends": "plugin:vue/recommended"` property in a configuration file enables this rule.
 - :wrench: The `--fix` option on the [command line](http://eslint.org/docs/user-guide/command-line-interface#fix) can automatically fix some of the problems reported by this rule.
 
 The `--fix` option on the command line can automatically fix some of the problems reported by this rule.
diff --git a/docs/rules/no-reserved-keys.md b/docs/rules/no-reserved-keys.md
index 6bf480c15..29b445b1a 100644
--- a/docs/rules/no-reserved-keys.md
+++ b/docs/rules/no-reserved-keys.md
@@ -1,5 +1,7 @@
 # disallow overwriting reserved keys (no-reserved-keys)
 
+- :white_check_mark: The `"extends": "plugin:vue/recommended"` property in a configuration file enables this rule.
+
 This rule prevents to use reserved names from to avoid conflicts and unexpected behavior.
 
 ## Rule Details
diff --git a/docs/rules/no-shared-component-data.md b/docs/rules/no-shared-component-data.md
index 836eea109..941737f4d 100644
--- a/docs/rules/no-shared-component-data.md
+++ b/docs/rules/no-shared-component-data.md
@@ -1,5 +1,7 @@
 # enforce component's data property to be a function (no-shared-component-data)
 
+- :white_check_mark: The `"extends": "plugin:vue/recommended"` property in a configuration file enables this rule.
+
 When using the data property on a component (i.e. anywhere except on `new Vue`), the value must be a function that returns an object.
 
 ## :book: Rule Details
diff --git a/docs/rules/no-side-effects-in-computed-properties.md b/docs/rules/no-side-effects-in-computed-properties.md
index 5a7ff8aec..480854e5b 100644
--- a/docs/rules/no-side-effects-in-computed-properties.md
+++ b/docs/rules/no-side-effects-in-computed-properties.md
@@ -1,5 +1,7 @@
 # disallow side effects in computed properties (no-side-effects-in-computed-properties)
 
+- :white_check_mark: The `"extends": "plugin:vue/recommended"` property in a configuration file enables this rule.
+
 It is considered a very bad practice to introduce side effects inside computed properties. It makes the code not predictable and hard to understand.
 
 
diff --git a/docs/rules/no-template-key.md b/docs/rules/no-template-key.md
index d0d1eca8d..dc36cc7dd 100644
--- a/docs/rules/no-template-key.md
+++ b/docs/rules/no-template-key.md
@@ -1,5 +1,7 @@
 # disallow `key` attribute on `<template>` (no-template-key)
 
+- :white_check_mark: The `"extends": "plugin:vue/recommended"` property in a configuration file enables this rule.
+
 Vue.js disallows `key` attribute on `<template>` elements.
 
 ## :book: Rule Details
diff --git a/docs/rules/order-in-components.md b/docs/rules/order-in-components.md
index 97032823c..bddda2eab 100644
--- a/docs/rules/order-in-components.md
+++ b/docs/rules/order-in-components.md
@@ -1,5 +1,7 @@
 # enforce order of properties in components (order-in-components)
 
+- :white_check_mark: The `"extends": "plugin:vue/recommended"` property in a configuration file enables this rule.
+
 This rule makes sure you keep declared order of properties in components.
 
 ## :book: Rule Details
diff --git a/docs/rules/require-default-prop.md b/docs/rules/require-default-prop.md
index 08fb9db09..8e21fbd53 100644
--- a/docs/rules/require-default-prop.md
+++ b/docs/rules/require-default-prop.md
@@ -1,5 +1,7 @@
 # require default value for props (require-default-prop)
 
+- :white_check_mark: The `"extends": "plugin:vue/recommended"` property in a configuration file enables this rule.
+
 This rule requires default value to be set for each props that are not marked as `required`.
 
 ## Rule Details
diff --git a/docs/rules/require-prop-types.md b/docs/rules/require-prop-types.md
index 3236d74a2..638d77d6b 100644
--- a/docs/rules/require-prop-types.md
+++ b/docs/rules/require-prop-types.md
@@ -1,5 +1,7 @@
 # require type definitions in props (require-prop-types)
 
+- :white_check_mark: The `"extends": "plugin:vue/recommended"` property in a configuration file enables this rule.
+
 In committed code, prop definitions should always be as detailed as possible, specifying at least type(s).
 
 ## :book: Rule Details
diff --git a/docs/rules/require-render-return.md b/docs/rules/require-render-return.md
index ffbb374d0..9d0c81fb9 100644
--- a/docs/rules/require-render-return.md
+++ b/docs/rules/require-render-return.md
@@ -1,5 +1,7 @@
 # enforce render function to always return value (require-render-return)
 
+- :white_check_mark: The `"extends": "plugin:vue/recommended"` property in a configuration file enables this rule.
+
 This rule aims to enforce render function to always return value
 
 ## :book: Rule Details
diff --git a/docs/rules/require-valid-default-prop.md b/docs/rules/require-valid-default-prop.md
index 81b3aac8a..bf061e4aa 100644
--- a/docs/rules/require-valid-default-prop.md
+++ b/docs/rules/require-valid-default-prop.md
@@ -1,5 +1,7 @@
 # enforce props default values to be valid (require-valid-default-prop)
 
+- :white_check_mark: The `"extends": "plugin:vue/recommended"` property in a configuration file enables this rule.
+
 This rule checks whether the default value of each prop is valid for the given type. It should report an error when default value for type `Array` or `Object` is not returned using function.
 
 ## :book: Rule Details
diff --git a/docs/rules/return-in-computed-property.md b/docs/rules/return-in-computed-property.md
index 83c1adae1..a9a093ffa 100644
--- a/docs/rules/return-in-computed-property.md
+++ b/docs/rules/return-in-computed-property.md
@@ -1,5 +1,7 @@
 # enforce that a return statement is present in computed property (return-in-computed-property)
 
+- :white_check_mark: The `"extends": "plugin:vue/recommended"` property in a configuration file enables this rule.
+
 ## :book: Rule Details
 
 This rule enforces that a `return` statement is present in `computed` properties.
diff --git a/docs/rules/this-in-template.md b/docs/rules/this-in-template.md
index 037bbe0ed..14104f5a3 100644
--- a/docs/rules/this-in-template.md
+++ b/docs/rules/this-in-template.md
@@ -1,5 +1,7 @@
 # enforce usage of `this` in template (this-in-template)
 
+- :white_check_mark: The `"extends": "plugin:vue/recommended"` property in a configuration file enables this rule.
+
 ## :book: Rule Details
 
 :-1: Examples of **incorrect** code for this rule:
diff --git a/docs/rules/v-bind-style.md b/docs/rules/v-bind-style.md
index 1375306bc..28e380472 100644
--- a/docs/rules/v-bind-style.md
+++ b/docs/rules/v-bind-style.md
@@ -1,5 +1,6 @@
 # enforce `v-bind` directive style (v-bind-style)
 
+- :white_check_mark: The `"extends": "plugin:vue/recommended"` property in a configuration file enables this rule.
 - :wrench: The `--fix` option on the [command line](http://eslint.org/docs/user-guide/command-line-interface#fix) can automatically fix some of the problems reported by this rule.
 
 This rule enforces `v-bind` directive style which you should use shorthand or long form.
diff --git a/docs/rules/v-on-style.md b/docs/rules/v-on-style.md
index 144ee12b7..c52dcee3e 100644
--- a/docs/rules/v-on-style.md
+++ b/docs/rules/v-on-style.md
@@ -1,5 +1,6 @@
 # enforce `v-on` directive style (v-on-style)
 
+- :white_check_mark: The `"extends": "plugin:vue/recommended"` property in a configuration file enables this rule.
 - :wrench: The `--fix` option on the [command line](http://eslint.org/docs/user-guide/command-line-interface#fix) can automatically fix some of the problems reported by this rule.
 
 This rule enforces `v-on` directive style which you should use shorthand or long form.
diff --git a/lib/recommended-rules.js b/lib/recommended-rules.js
index 64b59f930..67863d3fa 100644
--- a/lib/recommended-rules.js
+++ b/lib/recommended-rules.js
@@ -4,20 +4,20 @@
  * in order to update its content execute "npm run update"
  */
 module.exports = {
-  "vue/attribute-hyphenation": "off",
-  "vue/html-end-tags": "off",
+  "vue/attribute-hyphenation": "error",
+  "vue/html-end-tags": "error",
   "vue/html-indent": "off",
-  "vue/html-no-self-closing": "off",
+  "vue/html-no-self-closing": "error",
   "vue/html-quotes": "off",
-  "vue/html-self-closing": "off",
+  "vue/html-self-closing": "error",
   "vue/jsx-uses-vars": "error",
-  "vue/max-attributes-per-line": "off",
-  "vue/mustache-interpolation-spacing": "off",
-  "vue/name-property-casing": "off",
-  "vue/no-async-in-computed-properties": "off",
+  "vue/max-attributes-per-line": "error",
+  "vue/mustache-interpolation-spacing": "error",
+  "vue/name-property-casing": "error",
+  "vue/no-async-in-computed-properties": "error",
   "vue/no-confusing-v-for-v-if": "error",
-  "vue/no-dupe-keys": "off",
-  "vue/no-duplicate-attributes": "off",
+  "vue/no-dupe-keys": "error",
+  "vue/no-duplicate-attributes": "error",
   "vue/no-invalid-template-root": "off",
   "vue/no-invalid-v-bind": "off",
   "vue/no-invalid-v-cloak": "off",
@@ -32,26 +32,26 @@ module.exports = {
   "vue/no-invalid-v-pre": "off",
   "vue/no-invalid-v-show": "off",
   "vue/no-invalid-v-text": "off",
-  "vue/no-multi-spaces": "off",
+  "vue/no-multi-spaces": "error",
   "vue/no-parsing-error": "error",
-  "vue/no-reserved-keys": "off",
+  "vue/no-reserved-keys": "error",
   "vue/no-reservered-keys": "off",
-  "vue/no-shared-component-data": "off",
-  "vue/no-side-effects-in-computed-properties": "off",
-  "vue/no-template-key": "off",
+  "vue/no-shared-component-data": "error",
+  "vue/no-side-effects-in-computed-properties": "error",
+  "vue/no-template-key": "error",
   "vue/no-textarea-mustache": "error",
   "vue/no-unused-vars": "off",
-  "vue/order-in-components": "off",
+  "vue/order-in-components": "error",
   "vue/require-component-is": "error",
-  "vue/require-default-prop": "off",
-  "vue/require-prop-types": "off",
-  "vue/require-render-return": "off",
+  "vue/require-default-prop": "error",
+  "vue/require-prop-types": "error",
+  "vue/require-render-return": "error",
   "vue/require-v-for-key": "error",
-  "vue/require-valid-default-prop": "off",
-  "vue/return-in-computed-property": "off",
-  "vue/this-in-template": "off",
-  "vue/v-bind-style": "off",
-  "vue/v-on-style": "off",
+  "vue/require-valid-default-prop": "error",
+  "vue/return-in-computed-property": "error",
+  "vue/this-in-template": "error",
+  "vue/v-bind-style": "error",
+  "vue/v-on-style": "error",
   "vue/valid-template-root": "error",
   "vue/valid-v-bind": "error",
   "vue/valid-v-cloak": "error",
diff --git a/lib/rules/attribute-hyphenation.js b/lib/rules/attribute-hyphenation.js
index 5637f8f87..4c09b6320 100644
--- a/lib/rules/attribute-hyphenation.js
+++ b/lib/rules/attribute-hyphenation.js
@@ -60,7 +60,7 @@ module.exports = {
     docs: {
       description: 'enforce attribute naming style in template',
       category: 'Stylistic Issues',
-      recommended: false
+      recommended: true
     },
     fixable: 'code',
     schema: [
diff --git a/lib/rules/html-end-tags.js b/lib/rules/html-end-tags.js
index 05ba6464e..c6ce7991c 100644
--- a/lib/rules/html-end-tags.js
+++ b/lib/rules/html-end-tags.js
@@ -61,7 +61,7 @@ module.exports = {
     docs: {
       description: 'enforce end tag style',
       category: 'Best Practices',
-      recommended: false
+      recommended: true
     },
     fixable: 'code',
     schema: []
diff --git a/lib/rules/html-no-self-closing.js b/lib/rules/html-no-self-closing.js
index 30673c82b..d36c9cdc6 100644
--- a/lib/rules/html-no-self-closing.js
+++ b/lib/rules/html-no-self-closing.js
@@ -54,7 +54,7 @@ module.exports = {
     docs: {
       description: 'disallow self-closing elements',
       category: 'Best Practices',
-      recommended: false,
+      recommended: true,
       replacedBy: ['html-self-closing']
     },
     deprecated: true,
diff --git a/lib/rules/html-quotes.js b/lib/rules/html-quotes.js
index b6739f905..8575effd3 100644
--- a/lib/rules/html-quotes.js
+++ b/lib/rules/html-quotes.js
@@ -57,7 +57,7 @@ module.exports = {
     },
     fixable: false,
     schema: [
-            { enum: ['double', 'single'] }
+      { enum: ['double', 'single'] }
     ]
   }
 }
diff --git a/lib/rules/html-self-closing.js b/lib/rules/html-self-closing.js
index 5618df69d..4508c4364 100644
--- a/lib/rules/html-self-closing.js
+++ b/lib/rules/html-self-closing.js
@@ -33,7 +33,7 @@ const ELEMENT_TYPE = Object.freeze({
  */
 function parseOptions (options) {
   return {
-    [ELEMENT_TYPE.NORMAL]: (options && options.html && options.html.normal) || 'never',
+    [ELEMENT_TYPE.NORMAL]: (options && options.html && options.html.normal) || 'always',
     [ELEMENT_TYPE.VOID]: (options && options.html && options.html.void) || 'never',
     [ELEMENT_TYPE.COMPONENT]: (options && options.html && options.html.component) || 'always',
     [ELEMENT_TYPE.SVG]: (options && options.svg) || 'always',
@@ -144,7 +144,7 @@ module.exports = {
     docs: {
       description: 'enforce self-closing style',
       category: 'Stylistic Issues',
-      recommended: false
+      recommended: true
     },
     fixable: 'code',
     schema: {
diff --git a/lib/rules/max-attributes-per-line.js b/lib/rules/max-attributes-per-line.js
index 76f093415..1c6703385 100644
--- a/lib/rules/max-attributes-per-line.js
+++ b/lib/rules/max-attributes-per-line.js
@@ -14,7 +14,7 @@ module.exports = {
     docs: {
       description: 'enforce the maximum number of attributes per line',
       category: 'Stylistic Issues',
-      recommended: false
+      recommended: true
     },
     fixable: null,
     schema: [
@@ -98,7 +98,7 @@ module.exports = {
     // ----------------------------------------------------------------------
     function parseOptions (options) {
       const defaults = {
-        singleline: 3,
+        singleline: 1,
         multiline: 1,
         allowFirstLine: false
       }
diff --git a/lib/rules/mustache-interpolation-spacing.js b/lib/rules/mustache-interpolation-spacing.js
index 0be368d80..be871fcf8 100644
--- a/lib/rules/mustache-interpolation-spacing.js
+++ b/lib/rules/mustache-interpolation-spacing.js
@@ -19,7 +19,7 @@ module.exports = {
     docs: {
       description: 'enforce unified spacing in mustache interpolations',
       category: 'Stylistic Issues',
-      recommended: false
+      recommended: true
     },
     fixable: 'whitespace',
     schema: [
diff --git a/lib/rules/name-property-casing.js b/lib/rules/name-property-casing.js
index 2bf2ca6a6..fe15e3189 100644
--- a/lib/rules/name-property-casing.js
+++ b/lib/rules/name-property-casing.js
@@ -49,7 +49,7 @@ module.exports = {
     docs: {
       description: 'enforce specific casing for the name property in Vue components',
       category: 'Stylistic Issues',
-      recommended: false
+      recommended: true
     },
     fixable: 'code',  // or "code" or "whitespace"
     schema: [
diff --git a/lib/rules/no-async-in-computed-properties.js b/lib/rules/no-async-in-computed-properties.js
index e1aef33ef..6d1f8b413 100644
--- a/lib/rules/no-async-in-computed-properties.js
+++ b/lib/rules/no-async-in-computed-properties.js
@@ -149,7 +149,7 @@ module.exports = {
     docs: {
       description: 'disallow asynchronous actions in computed properties',
       category: 'Best Practices',
-      recommended: false
+      recommended: true
     },
     fixable: null,
     schema: []
diff --git a/lib/rules/no-dupe-keys.js b/lib/rules/no-dupe-keys.js
index 4ae9766d1..d5a4efb86 100644
--- a/lib/rules/no-dupe-keys.js
+++ b/lib/rules/no-dupe-keys.js
@@ -48,7 +48,7 @@ module.exports = {
     docs: {
       description: 'disallow duplication of field names',
       category: 'Possible Errors',
-      recommended: false
+      recommended: true
     },
     fixable: null,  // or "code" or "whitespace"
     schema: [
diff --git a/lib/rules/no-duplicate-attributes.js b/lib/rules/no-duplicate-attributes.js
index 92fce05d6..1a11b35c8 100644
--- a/lib/rules/no-duplicate-attributes.js
+++ b/lib/rules/no-duplicate-attributes.js
@@ -38,7 +38,7 @@ function getName (attribute) {
  */
 function create (context) {
   const options = context.options[0] || {}
-  const allowCoexistStyle = options.allowCoexistStyle !== false
+  const allowCoexistStyle = options.allowCoexistStyle === true
   const allowCoexistClass = options.allowCoexistClass !== false
 
   const directiveNames = new Set()
@@ -90,7 +90,7 @@ module.exports = {
     docs: {
       description: 'disallow duplication of attributes',
       category: 'Best Practices',
-      recommended: false
+      recommended: true
     },
     fixable: false,
 
diff --git a/lib/rules/no-multi-spaces.js b/lib/rules/no-multi-spaces.js
index 844cdbc62..b66fa447f 100644
--- a/lib/rules/no-multi-spaces.js
+++ b/lib/rules/no-multi-spaces.js
@@ -13,7 +13,7 @@ module.exports = {
     docs: {
       description: 'disallow multiple spaces',
       category: 'Stylistic Issues',
-      recommended: false
+      recommended: true
     },
     fixable: 'whitespace',  // or "code" or "whitespace"
     schema: []
diff --git a/lib/rules/no-reserved-keys.js b/lib/rules/no-reserved-keys.js
index 2489e4fec..ca0d36334 100644
--- a/lib/rules/no-reserved-keys.js
+++ b/lib/rules/no-reserved-keys.js
@@ -51,7 +51,7 @@ module.exports = {
     docs: {
       description: 'disallow overwriting reserved keys',
       category: 'Possible Errors',
-      recommended: false
+      recommended: true
     },
     fixable: null,
     schema: [
diff --git a/lib/rules/no-shared-component-data.js b/lib/rules/no-shared-component-data.js
index cf942ef13..a5668746d 100644
--- a/lib/rules/no-shared-component-data.js
+++ b/lib/rules/no-shared-component-data.js
@@ -39,7 +39,7 @@ module.exports = {
     docs: {
       description: "enforce component's data property to be a function",
       category: 'Possible Errors',
-      recommended: false
+      recommended: true
     },
     fixable: null,  // or "code" or "whitespace"
     schema: []
diff --git a/lib/rules/no-side-effects-in-computed-properties.js b/lib/rules/no-side-effects-in-computed-properties.js
index 9ac247d17..c8fac42e1 100644
--- a/lib/rules/no-side-effects-in-computed-properties.js
+++ b/lib/rules/no-side-effects-in-computed-properties.js
@@ -64,7 +64,7 @@ module.exports = {
     docs: {
       description: 'disallow side effects in computed properties',
       category: 'Best Practices',
-      recommended: false
+      recommended: true
     },
     fixable: null,
     schema: []
diff --git a/lib/rules/no-template-key.js b/lib/rules/no-template-key.js
index 41e4b8fd0..313b0d745 100644
--- a/lib/rules/no-template-key.js
+++ b/lib/rules/no-template-key.js
@@ -45,7 +45,7 @@ module.exports = {
     docs: {
       description: 'disallow `key` attribute on `<template>`',
       category: 'Possible Errors',
-      recommended: false
+      recommended: true
     },
     fixable: false,
     schema: []
diff --git a/lib/rules/order-in-components.js b/lib/rules/order-in-components.js
index 3ea350501..013fe01fd 100644
--- a/lib/rules/order-in-components.js
+++ b/lib/rules/order-in-components.js
@@ -7,19 +7,23 @@
 const utils = require('../utils')
 
 const defaultOrder = [
-  ['name', 'delimiters', 'functional', 'model'],
-  ['components', 'directives', 'filters'],
-  ['parent', 'mixins', 'extends', 'provide', 'inject'],
   'el',
-  'template',
-  'props',
-  'propsData',
+  'name',
+  'parent',
+  'functional',
+  ['delimiters', 'comments'],
+  ['components', 'directives', 'filters'],
+  'extends',
+  'mixins',
+  'inheritAttrs',
+  'model',
+  ['props', 'propsData'],
   'data',
   'computed',
   'watch',
   'LIFECYCLE_HOOKS',
   'methods',
-  'render',
+  ['template', 'render'],
   'renderError'
 ]
 
@@ -97,7 +101,7 @@ module.exports = {
     docs: {
       description: 'enforce order of properties in components',
       category: 'Best Practices',
-      recommended: false
+      recommended: true
     },
     fixable: null,
     schema: [
diff --git a/lib/rules/require-default-prop.js b/lib/rules/require-default-prop.js
index 1dbd266e6..06047566a 100644
--- a/lib/rules/require-default-prop.js
+++ b/lib/rules/require-default-prop.js
@@ -15,7 +15,7 @@ module.exports = {
     docs: {
       description: 'require default value for props',
       category: 'Best Practices',
-      recommended: false
+      recommended: true
     },
     fixable: null,  // or "code" or "whitespace"
     schema: []
diff --git a/lib/rules/require-prop-types.js b/lib/rules/require-prop-types.js
index 16382aa6d..b46cbb556 100644
--- a/lib/rules/require-prop-types.js
+++ b/lib/rules/require-prop-types.js
@@ -82,7 +82,7 @@ module.exports = {
     docs: {
       description: 'require type definitions in props',
       category: 'Best Practices',
-      recommended: false
+      recommended: true
     },
     fixable: null,  // or "code" or "whitespace"
     schema: [
diff --git a/lib/rules/require-render-return.js b/lib/rules/require-render-return.js
index 9ff268a93..39a644479 100644
--- a/lib/rules/require-render-return.js
+++ b/lib/rules/require-render-return.js
@@ -45,7 +45,7 @@ module.exports = {
     docs: {
       description: 'enforce render function to always return value',
       category: 'Possible Errors',
-      recommended: false
+      recommended: true
     },
     fixable: null,  // or "code" or "whitespace"
     schema: []
diff --git a/lib/rules/require-valid-default-prop.js b/lib/rules/require-valid-default-prop.js
index d4c8ddca7..473f34c95 100644
--- a/lib/rules/require-valid-default-prop.js
+++ b/lib/rules/require-valid-default-prop.js
@@ -24,7 +24,7 @@ module.exports = {
     docs: {
       description: 'enforce props default values to be valid',
       category: 'Possible Errors',
-      recommended: false
+      recommended: true
     },
     fixable: null,
     schema: []
diff --git a/lib/rules/return-in-computed-property.js b/lib/rules/return-in-computed-property.js
index a3a7858d3..c85870deb 100644
--- a/lib/rules/return-in-computed-property.js
+++ b/lib/rules/return-in-computed-property.js
@@ -49,7 +49,7 @@ module.exports = {
     docs: {
       description: 'enforce that a return statement is present in computed property',
       category: 'Possible Errors',
-      recommended: false
+      recommended: true
     },
     fixable: null,  // or "code" or "whitespace"
     schema: [
diff --git a/lib/rules/this-in-template.js b/lib/rules/this-in-template.js
index 9095988a6..62ba6f1a0 100644
--- a/lib/rules/this-in-template.js
+++ b/lib/rules/this-in-template.js
@@ -20,7 +20,7 @@ module.exports = {
     docs: {
       description: 'enforce usage of `this` in template',
       category: 'Best Practices',
-      recommended: false
+      recommended: true
     },
     fixable: null,
     schema: [
diff --git a/lib/rules/v-bind-style.js b/lib/rules/v-bind-style.js
index 701be354f..4b67aa89d 100644
--- a/lib/rules/v-bind-style.js
+++ b/lib/rules/v-bind-style.js
@@ -54,11 +54,11 @@ module.exports = {
     docs: {
       description: 'enforce `v-bind` directive style',
       category: 'Stylistic Issues',
-      recommended: false
+      recommended: true
     },
     fixable: 'code',
     schema: [
-            { enum: ['shorthand', 'longform'] }
+      { enum: ['shorthand', 'longform'] }
     ]
   }
 }
diff --git a/lib/rules/v-on-style.js b/lib/rules/v-on-style.js
index e7b1b71a8..66036c623 100644
--- a/lib/rules/v-on-style.js
+++ b/lib/rules/v-on-style.js
@@ -55,11 +55,11 @@ module.exports = {
     docs: {
       description: 'enforce `v-on` directive style',
       category: 'Stylistic Issues',
-      recommended: false
+      recommended: true
     },
     fixable: 'code',
     schema: [
-            { enum: ['shorthand', 'longform'] }
+      { enum: ['shorthand', 'longform'] }
     ]
   }
 }
diff --git a/tools/update-rules.js b/tools/update-rules.js
index 4980d6c0c..d76072285 100644
--- a/tools/update-rules.js
+++ b/tools/update-rules.js
@@ -86,7 +86,11 @@ ${
 const recommendedRules = rules.reduce((obj, entry) => {
   const name = `vue/${entry[0]}`
   const recommended = entry[1].meta.docs.recommended
-  const status = recommended ? 'error' : 'off'
+  const status = recommended
+    ? recommended === true
+      ? 'error'
+      : recommended
+    : 'off'
   obj[name] = status
   return obj
 }, {})

From 0a1237b1cb334425d60bc940f5988be58ff0a5ca Mon Sep 17 00:00:00 2001
From: Chris Fritz <chrisvfritz@gmail.com>
Date: Sun, 8 Oct 2017 18:41:23 -0400
Subject: [PATCH 02/10] categorize rules by style guide priority levels

---
 README.md                                     | 130 +++++++++-------
 docs/rules/attribute-hyphenation.md           |   1 -
 docs/rules/html-end-tags.md                   |   1 -
 docs/rules/html-indent.md                     |   2 +-
 docs/rules/html-self-closing.md               |   1 -
 docs/rules/jsx-uses-vars.md                   |   2 -
 docs/rules/max-attributes-per-line.md         |   2 -
 docs/rules/mustache-interpolation-spacing.md  |   1 -
 docs/rules/name-property-casing.md            |   1 -
 docs/rules/no-async-in-computed-properties.md |   2 -
 docs/rules/no-confusing-v-for-v-if.md         |   2 -
 docs/rules/no-dupe-keys.md                    |   2 -
 docs/rules/no-duplicate-attributes.md         |   2 -
 docs/rules/no-multi-spaces.md                 |   1 -
 docs/rules/no-parsing-error.md                |   2 -
 docs/rules/no-reserved-keys.md                |   2 -
 docs/rules/no-shared-component-data.md        |   2 -
 .../no-side-effects-in-computed-properties.md |   2 -
 docs/rules/no-template-key.md                 |   2 -
 docs/rules/no-textarea-mustache.md            |   2 -
 docs/rules/order-in-components.md             |   2 -
 docs/rules/require-component-is.md            |   2 -
 docs/rules/require-default-prop.md            |   2 -
 docs/rules/require-prop-types.md              |   2 -
 docs/rules/require-render-return.md           |   2 -
 docs/rules/require-v-for-key.md               |   2 -
 docs/rules/require-valid-default-prop.md      |   2 -
 docs/rules/return-in-computed-property.md     |   2 -
 docs/rules/this-in-template.md                |   2 -
 docs/rules/v-bind-style.md                    |   1 -
 docs/rules/v-on-style.md                      |   1 -
 docs/rules/valid-template-root.md             |   2 -
 docs/rules/valid-v-bind.md                    |   2 -
 docs/rules/valid-v-cloak.md                   |   2 -
 docs/rules/valid-v-else-if.md                 |   2 -
 docs/rules/valid-v-else.md                    |   2 -
 docs/rules/valid-v-for.md                     |   2 -
 docs/rules/valid-v-html.md                    |   2 -
 docs/rules/valid-v-if.md                      |   2 -
 docs/rules/valid-v-model.md                   |   2 -
 docs/rules/valid-v-on.md                      |   2 -
 docs/rules/valid-v-once.md                    |   2 -
 docs/rules/valid-v-pre.md                     |   2 -
 docs/rules/valid-v-show.md                    |   2 -
 docs/rules/valid-v-text.md                    |   2 -
 .../consistent-docs-description.js            |   3 +-
 eslint-internal-rules/no-invalid-meta.js      |  20 +--
 lib/all-rules.js                              |  51 +++++++
 lib/base-rules.js                             |   8 +
 lib/config/all.js                             |   4 +
 lib/config/base.js                            |   4 +-
 lib/config/essential.js                       |   4 +
 lib/config/strongly-recommended.js            |   4 +
 lib/essential-rules.js                        |  37 +++++
 lib/recommended-rules.js                      |  30 +---
 lib/rules/attribute-hyphenation.js            |   3 +-
 lib/rules/html-end-tags.js                    |   3 +-
 lib/rules/html-indent.js                      |   5 +-
 lib/rules/html-no-self-closing.js             |   3 +-
 lib/rules/html-quotes.js                      |   3 +-
 lib/rules/html-self-closing.js                |   3 +-
 lib/rules/jsx-uses-vars.js                    |   3 +-
 lib/rules/max-attributes-per-line.js          |   3 +-
 lib/rules/mustache-interpolation-spacing.js   |   3 +-
 lib/rules/name-property-casing.js             |   3 +-
 lib/rules/no-async-in-computed-properties.js  |   3 +-
 lib/rules/no-confusing-v-for-v-if.js          |   3 +-
 lib/rules/no-dupe-keys.js                     |   3 +-
 lib/rules/no-duplicate-attributes.js          |   5 +-
 lib/rules/no-invalid-template-root.js         |   3 +-
 lib/rules/no-invalid-v-bind.js                |   3 +-
 lib/rules/no-invalid-v-cloak.js               |   3 +-
 lib/rules/no-invalid-v-else-if.js             |   3 +-
 lib/rules/no-invalid-v-else.js                |   3 +-
 lib/rules/no-invalid-v-for.js                 |   3 +-
 lib/rules/no-invalid-v-html.js                |   3 +-
 lib/rules/no-invalid-v-if.js                  |   3 +-
 lib/rules/no-invalid-v-model.js               |   3 +-
 lib/rules/no-invalid-v-on.js                  |   3 +-
 lib/rules/no-invalid-v-once.js                |   3 +-
 lib/rules/no-invalid-v-pre.js                 |   3 +-
 lib/rules/no-invalid-v-show.js                |   3 +-
 lib/rules/no-invalid-v-text.js                |   3 +-
 lib/rules/no-multi-spaces.js                  |   3 +-
 lib/rules/no-parsing-error.js                 |   3 +-
 lib/rules/no-reserved-keys.js                 |   3 +-
 lib/rules/no-reservered-keys.js               |   3 +-
 lib/rules/no-shared-component-data.js         |   3 +-
 .../no-side-effects-in-computed-properties.js |   3 +-
 lib/rules/no-template-key.js                  |   3 +-
 lib/rules/no-textarea-mustache.js             |   3 +-
 lib/rules/no-unused-vars.js                   |   3 +-
 lib/rules/order-in-components.js              |   3 +-
 lib/rules/require-component-is.js             |   3 +-
 lib/rules/require-default-prop.js             |   3 +-
 lib/rules/require-prop-types.js               |   3 +-
 lib/rules/require-render-return.js            |   3 +-
 lib/rules/require-v-for-key.js                |   3 +-
 lib/rules/require-valid-default-prop.js       |   3 +-
 lib/rules/return-in-computed-property.js      |   3 +-
 lib/rules/this-in-template.js                 |   3 +-
 lib/rules/v-bind-style.js                     |   3 +-
 lib/rules/v-on-style.js                       |   3 +-
 lib/rules/valid-template-root.js              |   3 +-
 lib/rules/valid-v-bind.js                     |   3 +-
 lib/rules/valid-v-cloak.js                    |   3 +-
 lib/rules/valid-v-else-if.js                  |   3 +-
 lib/rules/valid-v-else.js                     |   3 +-
 lib/rules/valid-v-for.js                      |   3 +-
 lib/rules/valid-v-html.js                     |   3 +-
 lib/rules/valid-v-if.js                       |   3 +-
 lib/rules/valid-v-model.js                    |   3 +-
 lib/rules/valid-v-on.js                       |   3 +-
 lib/rules/valid-v-once.js                     |   3 +-
 lib/rules/valid-v-pre.js                      |   3 +-
 lib/rules/valid-v-show.js                     |   3 +-
 lib/rules/valid-v-text.js                     |   3 +-
 lib/strongly-recommended-rules.js             |  49 ++++++
 tools/update-rules.js                         | 143 +++++++++++-------
 119 files changed, 400 insertions(+), 357 deletions(-)
 create mode 100644 lib/all-rules.js
 create mode 100644 lib/base-rules.js
 create mode 100644 lib/config/all.js
 create mode 100644 lib/config/essential.js
 create mode 100644 lib/config/strongly-recommended.js
 create mode 100644 lib/essential-rules.js
 create mode 100644 lib/strongly-recommended-rules.js

diff --git a/README.md b/README.md
index 7d874277a..803a1f42b 100644
--- a/README.md
+++ b/README.md
@@ -88,74 +88,98 @@ The `--fix` option on the command line automatically fixes problems reported by
 
 <!--RULES_TABLE_START-->
 
-### Possible Errors
+### Base Rules (Enabling Correct ESLint Parsing)
+
+Enforce all the rules in this category, as well as all higher priority rules, with:
+
+``` json
+"extends": "plugin:vue/base"
+```
 
 |    | Rule ID | Description |
 |:---|:--------|:------------|
-| :white_check_mark: | [no-dupe-keys](./docs/rules/no-dupe-keys.md) | disallow duplication of field names |
-| :white_check_mark: | [no-parsing-error](./docs/rules/no-parsing-error.md) | disallow parsing errors in `<template>` |
-| :white_check_mark: | [no-reserved-keys](./docs/rules/no-reserved-keys.md) | disallow overwriting reserved keys |
-| :white_check_mark: | [no-shared-component-data](./docs/rules/no-shared-component-data.md) | enforce component's data property to be a function |
-| :white_check_mark: | [no-template-key](./docs/rules/no-template-key.md) | disallow `key` attribute on `<template>` |
-|  | [no-unused-vars](./docs/rules/no-unused-vars.md) | disallow unused variable definitions of v-for directives or scope attributes |
-| :white_check_mark: | [require-render-return](./docs/rules/require-render-return.md) | enforce render function to always return value |
-| :white_check_mark: | [require-valid-default-prop](./docs/rules/require-valid-default-prop.md) | enforce props default values to be valid |
-| :white_check_mark: | [return-in-computed-property](./docs/rules/return-in-computed-property.md) | enforce that a return statement is present in computed property |
-| :white_check_mark: | [valid-template-root](./docs/rules/valid-template-root.md) | enforce valid template root |
-| :white_check_mark: | [valid-v-bind](./docs/rules/valid-v-bind.md) | enforce valid `v-bind` directives |
-| :white_check_mark: | [valid-v-cloak](./docs/rules/valid-v-cloak.md) | enforce valid `v-cloak` directives |
-| :white_check_mark: | [valid-v-else-if](./docs/rules/valid-v-else-if.md) | enforce valid `v-else-if` directives |
-| :white_check_mark: | [valid-v-else](./docs/rules/valid-v-else.md) | enforce valid `v-else` directives |
-| :white_check_mark: | [valid-v-for](./docs/rules/valid-v-for.md) | enforce valid `v-for` directives |
-| :white_check_mark: | [valid-v-html](./docs/rules/valid-v-html.md) | enforce valid `v-html` directives |
-| :white_check_mark: | [valid-v-if](./docs/rules/valid-v-if.md) | enforce valid `v-if` directives |
-| :white_check_mark: | [valid-v-model](./docs/rules/valid-v-model.md) | enforce valid `v-model` directives |
-| :white_check_mark: | [valid-v-on](./docs/rules/valid-v-on.md) | enforce valid `v-on` directives |
-| :white_check_mark: | [valid-v-once](./docs/rules/valid-v-once.md) | enforce valid `v-once` directives |
-| :white_check_mark: | [valid-v-pre](./docs/rules/valid-v-pre.md) | enforce valid `v-pre` directives |
-| :white_check_mark: | [valid-v-show](./docs/rules/valid-v-show.md) | enforce valid `v-show` directives |
-| :white_check_mark: | [valid-v-text](./docs/rules/valid-v-text.md) | enforce valid `v-text` directives |
-
-
-### Best Practices
+|  | [jsx-uses-vars](./docs/rules/jsx-uses-vars.md) | prevent variables used in JSX to be marked as unused |
+
+
+### Priority A: Essential (Error Prevention)
+
+Enforce all the rules in this category, as well as all higher priority rules, with:
+
+``` json
+"extends": "plugin:vue/essential"
+```
 
 |    | Rule ID | Description |
 |:---|:--------|:------------|
-| :white_check_mark::wrench: | [html-end-tags](./docs/rules/html-end-tags.md) | enforce end tag style |
-| :white_check_mark: | [no-async-in-computed-properties](./docs/rules/no-async-in-computed-properties.md) | disallow asynchronous actions in computed properties |
-| :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 |
-| :white_check_mark: | [no-duplicate-attributes](./docs/rules/no-duplicate-attributes.md) | disallow duplication of attributes |
-| :white_check_mark: | [no-side-effects-in-computed-properties](./docs/rules/no-side-effects-in-computed-properties.md) | disallow side effects in computed properties |
-| :white_check_mark: | [no-textarea-mustache](./docs/rules/no-textarea-mustache.md) | disallow mustaches in `<textarea>` |
-| :white_check_mark: | [order-in-components](./docs/rules/order-in-components.md) | enforce order of properties in components |
-| :white_check_mark: | [require-component-is](./docs/rules/require-component-is.md) | require `v-bind:is` of `<component>` elements |
-| :white_check_mark: | [require-default-prop](./docs/rules/require-default-prop.md) | require default value for props |
-| :white_check_mark: | [require-prop-types](./docs/rules/require-prop-types.md) | require type definitions in props |
-| :white_check_mark: | [require-v-for-key](./docs/rules/require-v-for-key.md) | require `v-bind:key` with `v-for` directives |
-| :white_check_mark: | [this-in-template](./docs/rules/this-in-template.md) | enforce usage of `this` in template |
-
-
-### Stylistic Issues
+|  | [no-async-in-computed-properties](./docs/rules/no-async-in-computed-properties.md) | disallow asynchronous actions in computed properties |
+|  | [no-dupe-keys](./docs/rules/no-dupe-keys.md) | disallow duplication of field names |
+|  | [no-duplicate-attributes](./docs/rules/no-duplicate-attributes.md) | disallow duplication of attributes |
+|  | [no-parsing-error](./docs/rules/no-parsing-error.md) | disallow parsing errors in `<template>` |
+|  | [no-reserved-keys](./docs/rules/no-reserved-keys.md) | disallow overwriting reserved keys |
+|  | [no-shared-component-data](./docs/rules/no-shared-component-data.md) | enforce component's data property to be a function |
+|  | [no-side-effects-in-computed-properties](./docs/rules/no-side-effects-in-computed-properties.md) | disallow side effects in computed properties |
+|  | [no-template-key](./docs/rules/no-template-key.md) | disallow `key` attribute on `<template>` |
+|  | [no-textarea-mustache](./docs/rules/no-textarea-mustache.md) | disallow mustaches in `<textarea>` |
+|  | [no-unused-vars](./docs/rules/no-unused-vars.md) | disallow unused variable definitions of v-for directives or scope attributes |
+|  | [require-component-is](./docs/rules/require-component-is.md) | require `v-bind:is` of `<component>` elements |
+|  | [require-render-return](./docs/rules/require-render-return.md) | enforce render function to always return value |
+|  | [require-v-for-key](./docs/rules/require-v-for-key.md) | require `v-bind:key` with `v-for` directives |
+|  | [require-valid-default-prop](./docs/rules/require-valid-default-prop.md) | enforce props default values to be valid |
+|  | [return-in-computed-property](./docs/rules/return-in-computed-property.md) | enforce that a return statement is present in computed property |
+|  | [valid-template-root](./docs/rules/valid-template-root.md) | enforce valid template root |
+|  | [valid-v-bind](./docs/rules/valid-v-bind.md) | enforce valid `v-bind` directives |
+|  | [valid-v-cloak](./docs/rules/valid-v-cloak.md) | enforce valid `v-cloak` directives |
+|  | [valid-v-else-if](./docs/rules/valid-v-else-if.md) | enforce valid `v-else-if` directives |
+|  | [valid-v-else](./docs/rules/valid-v-else.md) | enforce valid `v-else` directives |
+|  | [valid-v-for](./docs/rules/valid-v-for.md) | enforce valid `v-for` directives |
+|  | [valid-v-html](./docs/rules/valid-v-html.md) | enforce valid `v-html` directives |
+|  | [valid-v-if](./docs/rules/valid-v-if.md) | enforce valid `v-if` directives |
+|  | [valid-v-model](./docs/rules/valid-v-model.md) | enforce valid `v-model` directives |
+|  | [valid-v-on](./docs/rules/valid-v-on.md) | enforce valid `v-on` directives |
+|  | [valid-v-once](./docs/rules/valid-v-once.md) | enforce valid `v-once` directives |
+|  | [valid-v-pre](./docs/rules/valid-v-pre.md) | enforce valid `v-pre` directives |
+|  | [valid-v-show](./docs/rules/valid-v-show.md) | enforce valid `v-show` directives |
+|  | [valid-v-text](./docs/rules/valid-v-text.md) | enforce valid `v-text` directives |
+
+
+### Priority B: Strongly Recommended (Improving Readability)
+
+Enforce all the rules in this category, as well as all higher priority rules, with:
+
+``` json
+"extends": "plugin:vue/strongly-recommended"
+```
 
 |    | Rule ID | Description |
 |:---|:--------|:------------|
-| :white_check_mark::wrench: | [attribute-hyphenation](./docs/rules/attribute-hyphenation.md) | enforce attribute naming style in template |
+| :wrench: | [attribute-hyphenation](./docs/rules/attribute-hyphenation.md) | enforce attribute naming style in template |
+| :wrench: | [html-end-tags](./docs/rules/html-end-tags.md) | enforce end tag style |
 | :wrench: | [html-indent](./docs/rules/html-indent.md) | enforce consistent indentation in `<template>` |
-|  | [html-quotes](./docs/rules/html-quotes.md) | enforce quotes style of HTML attributes |
-| :white_check_mark::wrench: | [html-self-closing](./docs/rules/html-self-closing.md) | enforce self-closing style |
-| :white_check_mark: | [max-attributes-per-line](./docs/rules/max-attributes-per-line.md) | enforce the maximum number of attributes per line |
-| :white_check_mark::wrench: | [mustache-interpolation-spacing](./docs/rules/mustache-interpolation-spacing.md) | enforce unified spacing in mustache interpolations |
-| :white_check_mark::wrench: | [name-property-casing](./docs/rules/name-property-casing.md) | enforce specific casing for the name property in Vue components |
-| :white_check_mark::wrench: | [no-multi-spaces](./docs/rules/no-multi-spaces.md) | disallow multiple spaces |
-| :white_check_mark::wrench: | [v-bind-style](./docs/rules/v-bind-style.md) | enforce `v-bind` directive style |
-| :white_check_mark::wrench: | [v-on-style](./docs/rules/v-on-style.md) | enforce `v-on` directive style |
+| :wrench: | [html-self-closing](./docs/rules/html-self-closing.md) | enforce self-closing style |
+|  | [max-attributes-per-line](./docs/rules/max-attributes-per-line.md) | enforce the maximum number of attributes per line |
+| :wrench: | [mustache-interpolation-spacing](./docs/rules/mustache-interpolation-spacing.md) | enforce unified spacing in mustache interpolations |
+| :wrench: | [name-property-casing](./docs/rules/name-property-casing.md) | enforce specific casing for the name property in Vue components |
+| :wrench: | [no-multi-spaces](./docs/rules/no-multi-spaces.md) | disallow multiple spaces |
+|  | [require-default-prop](./docs/rules/require-default-prop.md) | require default value for props |
+|  | [require-prop-types](./docs/rules/require-prop-types.md) | require type definitions in props |
+| :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
+### Priority C: Recommended (Minimizing Arbitrary Choices and Cognitive Overhead)
+
+Enforce all the rules in this category, as well as all higher priority rules, with:
+
+``` json
+"extends": "plugin:vue/recommended"
+```
 
 |    | 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 |
+|  | [html-quotes](./docs/rules/html-quotes.md) | enforce quotes style of HTML attributes |
+|  | [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 |
+|  | [order-in-components](./docs/rules/order-in-components.md) | enforce order of properties in components |
+|  | [this-in-template](./docs/rules/this-in-template.md) | enforce usage of `this` in template |
 
 ### Deprecated
 
diff --git a/docs/rules/attribute-hyphenation.md b/docs/rules/attribute-hyphenation.md
index b6a7049a4..0028c2a58 100644
--- a/docs/rules/attribute-hyphenation.md
+++ b/docs/rules/attribute-hyphenation.md
@@ -1,6 +1,5 @@
 # enforce attribute naming style in template (attribute-hyphenation)
 
-- :white_check_mark: The `"extends": "plugin:vue/recommended"` property in a configuration file enables this rule.
 - :wrench: The `--fix` option on the [command line](http://eslint.org/docs/user-guide/command-line-interface#fix) can automatically fix some of the problems reported by this rule.
 
 ## :wrench: Options
diff --git a/docs/rules/html-end-tags.md b/docs/rules/html-end-tags.md
index 891ef6952..51acebeda 100644
--- a/docs/rules/html-end-tags.md
+++ b/docs/rules/html-end-tags.md
@@ -1,6 +1,5 @@
 # enforce end tag style (html-end-tags)
 
-- :white_check_mark: The `"extends": "plugin:vue/recommended"` property in a configuration file enables this rule.
 - :wrench: The `--fix` option on the [command line](http://eslint.org/docs/user-guide/command-line-interface#fix) can automatically fix some of the problems reported by this rule.
 
 This rule enforce the way of end tags.
diff --git a/docs/rules/html-indent.md b/docs/rules/html-indent.md
index e65329d89..95de69d9f 100644
--- a/docs/rules/html-indent.md
+++ b/docs/rules/html-indent.md
@@ -65,7 +65,7 @@ This rule enforces a consistent indentation style in `<template>`. The default s
 }
 ```
 
-- `type` (`number | "tab"`) ... The type of indentation. Default is `4`. If this is a number, it's the number of spaces for one indent. If this is `"tab"`, it uses one tab for one indent.
+- `type` (`number | "tab"`) ... The type of indentation. Default is `2`. If this is a number, it's the number of spaces for one indent. If this is `"tab"`, it uses one tab for one indent.
 - `attribute` (`integer`) ... The multiplier of indentation for attributes. Default is `1`.
 - `closeBracket` (`integer`) ... The multiplier of indentation for right brackets. Default is `0`.
 - `ignores` (`string[]`) ... The selector to ignore nodes. The AST spec is [here](https://github.com/mysticatea/vue-eslint-parser/blob/master/docs/ast.md). You can use [esquery](https://github.com/estools/esquery#readme) to select nodes. Default is an empty array.
diff --git a/docs/rules/html-self-closing.md b/docs/rules/html-self-closing.md
index 9ff3cb698..760ebb0b1 100644
--- a/docs/rules/html-self-closing.md
+++ b/docs/rules/html-self-closing.md
@@ -1,6 +1,5 @@
 # enforce self-closing style (html-self-closing)
 
-- :white_check_mark: The `"extends": "plugin:vue/recommended"` property in a configuration file enables this rule.
 - :wrench: The `--fix` option on the [command line](http://eslint.org/docs/user-guide/command-line-interface#fix) can automatically fix some of the problems reported by this rule.
 
 In Vue.js template, we can use either two styles for elements which don't have their content.
diff --git a/docs/rules/jsx-uses-vars.md b/docs/rules/jsx-uses-vars.md
index 1d9a4df94..af65b9f58 100644
--- a/docs/rules/jsx-uses-vars.md
+++ b/docs/rules/jsx-uses-vars.md
@@ -1,7 +1,5 @@
 # prevent variables used in JSX to be marked as unused (jsx-uses-vars)
 
-- :white_check_mark: The `"extends": "plugin:vue/recommended"` property in a configuration file enables this rule.
-
 Since 0.17.0 the ESLint `no-unused-vars` rule does not detect variables used in JSX ([see details](http://eslint.org/blog/2015/03/eslint-0.17.0-released#changes-to-jsxreact-handling)).
 This rule will find variables used in JSX and mark them as used.
 
diff --git a/docs/rules/max-attributes-per-line.md b/docs/rules/max-attributes-per-line.md
index bc745bdd3..8920a766b 100644
--- a/docs/rules/max-attributes-per-line.md
+++ b/docs/rules/max-attributes-per-line.md
@@ -1,7 +1,5 @@
 # enforce the maximum number of attributes per line (max-attributes-per-line)
 
-- :white_check_mark: The `"extends": "plugin:vue/recommended"` property in a configuration file enables this rule.
-
 Limits the maximum number of attributes/properties per line to improve readability.
 
 
diff --git a/docs/rules/mustache-interpolation-spacing.md b/docs/rules/mustache-interpolation-spacing.md
index 4e1506930..fcb385891 100644
--- a/docs/rules/mustache-interpolation-spacing.md
+++ b/docs/rules/mustache-interpolation-spacing.md
@@ -1,6 +1,5 @@
 # enforce unified spacing in mustache interpolations (mustache-interpolation-spacing)
 
-- :white_check_mark: The `"extends": "plugin:vue/recommended"` property in a configuration file enables this rule.
 - :wrench: The `--fix` option on the [command line](http://eslint.org/docs/user-guide/command-line-interface#fix) can automatically fix some of the problems reported by this rule.
 
 ## :book: Rule Details
diff --git a/docs/rules/name-property-casing.md b/docs/rules/name-property-casing.md
index 84dcdd3e2..648935b58 100644
--- a/docs/rules/name-property-casing.md
+++ b/docs/rules/name-property-casing.md
@@ -1,6 +1,5 @@
 # enforce specific casing for the name property in Vue components (name-property-casing)
 
-- :white_check_mark: The `"extends": "plugin:vue/recommended"` property in a configuration file enables this rule.
 - :wrench: The `--fix` option on the [command line](http://eslint.org/docs/user-guide/command-line-interface#fix) can automatically fix some of the problems reported by this rule.
 
 Define a style for the `name` property casing for consistency purposes.
diff --git a/docs/rules/no-async-in-computed-properties.md b/docs/rules/no-async-in-computed-properties.md
index 6563bf5dd..4fd8790a3 100644
--- a/docs/rules/no-async-in-computed-properties.md
+++ b/docs/rules/no-async-in-computed-properties.md
@@ -1,7 +1,5 @@
 # disallow asynchronous actions in computed properties (no-async-in-computed-properties)
 
-- :white_check_mark: The `"extends": "plugin:vue/recommended"` property in a configuration file enables this rule.
-
 Computed properties should be synchronous. Asynchronous actions inside them may not work as expected and can lead to an unexpected behaviour, that's why you should avoid them.
 If you need async computed properties you might want to consider using additional plugin [vue-async-computed]
 
diff --git a/docs/rules/no-confusing-v-for-v-if.md b/docs/rules/no-confusing-v-for-v-if.md
index 929b1b446..ed730ebd9 100644
--- a/docs/rules/no-confusing-v-for-v-if.md
+++ b/docs/rules/no-confusing-v-for-v-if.md
@@ -1,7 +1,5 @@
 # disallow confusing `v-for` and `v-if` on the same element (no-confusing-v-for-v-if)
 
-- :white_check_mark: The `"extends": "plugin:vue/recommended"` property in a configuration file enables this rule.
-
 > When they exist on the same node, `v-for` has a higher priority than `v-if`. That means the `v-if` will be run on each iteration of the loop separately.
 >
 > https://vuejs.org/v2/guide/list.html#v-for-with-v-if
diff --git a/docs/rules/no-dupe-keys.md b/docs/rules/no-dupe-keys.md
index 7f0d0061b..6f3bb547a 100644
--- a/docs/rules/no-dupe-keys.md
+++ b/docs/rules/no-dupe-keys.md
@@ -1,7 +1,5 @@
 # disallow duplication of field names (no-dupe-keys)
 
-- :white_check_mark: The `"extends": "plugin:vue/recommended"` property in a configuration file enables this rule.
-
 This rule prevents to use duplicated names.
 
 ## :book: Rule Details
diff --git a/docs/rules/no-duplicate-attributes.md b/docs/rules/no-duplicate-attributes.md
index c62dc316d..3b4f7ae13 100644
--- a/docs/rules/no-duplicate-attributes.md
+++ b/docs/rules/no-duplicate-attributes.md
@@ -1,7 +1,5 @@
 # disallow duplication of attributes (no-duplicate-attributes)
 
-- :white_check_mark: The `"extends": "plugin:vue/recommended"` property in a configuration file enables this rule.
-
 When duplicate arguments exist, only the last one is valid.
 It's possibly mistakes.
 
diff --git a/docs/rules/no-multi-spaces.md b/docs/rules/no-multi-spaces.md
index b94c54cb5..c098248d5 100644
--- a/docs/rules/no-multi-spaces.md
+++ b/docs/rules/no-multi-spaces.md
@@ -1,6 +1,5 @@
 # disallow multiple spaces (no-multi-spaces)
 
-- :white_check_mark: The `"extends": "plugin:vue/recommended"` property in a configuration file enables this rule.
 - :wrench: The `--fix` option on the [command line](http://eslint.org/docs/user-guide/command-line-interface#fix) can automatically fix some of the problems reported by this rule.
 
 The `--fix` option on the command line can automatically fix some of the problems reported by this rule.
diff --git a/docs/rules/no-parsing-error.md b/docs/rules/no-parsing-error.md
index ab6e7d029..a68e6afc9 100644
--- a/docs/rules/no-parsing-error.md
+++ b/docs/rules/no-parsing-error.md
@@ -1,7 +1,5 @@
 # disallow parsing errors in `<template>` (no-parsing-error)
 
-- :white_check_mark: The `"extends": "plugin:vue/recommended"` property in a configuration file enables this rule.
-
 This rule reports syntax errors in `<template>`. For example:
 
 - Syntax errors of scripts in directives.
diff --git a/docs/rules/no-reserved-keys.md b/docs/rules/no-reserved-keys.md
index 29b445b1a..6bf480c15 100644
--- a/docs/rules/no-reserved-keys.md
+++ b/docs/rules/no-reserved-keys.md
@@ -1,7 +1,5 @@
 # disallow overwriting reserved keys (no-reserved-keys)
 
-- :white_check_mark: The `"extends": "plugin:vue/recommended"` property in a configuration file enables this rule.
-
 This rule prevents to use reserved names from to avoid conflicts and unexpected behavior.
 
 ## Rule Details
diff --git a/docs/rules/no-shared-component-data.md b/docs/rules/no-shared-component-data.md
index 941737f4d..836eea109 100644
--- a/docs/rules/no-shared-component-data.md
+++ b/docs/rules/no-shared-component-data.md
@@ -1,7 +1,5 @@
 # enforce component's data property to be a function (no-shared-component-data)
 
-- :white_check_mark: The `"extends": "plugin:vue/recommended"` property in a configuration file enables this rule.
-
 When using the data property on a component (i.e. anywhere except on `new Vue`), the value must be a function that returns an object.
 
 ## :book: Rule Details
diff --git a/docs/rules/no-side-effects-in-computed-properties.md b/docs/rules/no-side-effects-in-computed-properties.md
index 480854e5b..5a7ff8aec 100644
--- a/docs/rules/no-side-effects-in-computed-properties.md
+++ b/docs/rules/no-side-effects-in-computed-properties.md
@@ -1,7 +1,5 @@
 # disallow side effects in computed properties (no-side-effects-in-computed-properties)
 
-- :white_check_mark: The `"extends": "plugin:vue/recommended"` property in a configuration file enables this rule.
-
 It is considered a very bad practice to introduce side effects inside computed properties. It makes the code not predictable and hard to understand.
 
 
diff --git a/docs/rules/no-template-key.md b/docs/rules/no-template-key.md
index dc36cc7dd..d0d1eca8d 100644
--- a/docs/rules/no-template-key.md
+++ b/docs/rules/no-template-key.md
@@ -1,7 +1,5 @@
 # disallow `key` attribute on `<template>` (no-template-key)
 
-- :white_check_mark: The `"extends": "plugin:vue/recommended"` property in a configuration file enables this rule.
-
 Vue.js disallows `key` attribute on `<template>` elements.
 
 ## :book: Rule Details
diff --git a/docs/rules/no-textarea-mustache.md b/docs/rules/no-textarea-mustache.md
index 14a2ee54c..c5251eff8 100644
--- a/docs/rules/no-textarea-mustache.md
+++ b/docs/rules/no-textarea-mustache.md
@@ -1,7 +1,5 @@
 # disallow mustaches in `<textarea>` (no-textarea-mustache)
 
-- :white_check_mark: The `"extends": "plugin:vue/recommended"` property in a configuration file enables this rule.
-
 > Interpolation on textareas (`<textarea>{{text}}</textarea>`) won't work. Use `v-model` instead.
 >
 > https://vuejs.org/v2/guide/forms.html#Multiline-text
diff --git a/docs/rules/order-in-components.md b/docs/rules/order-in-components.md
index bddda2eab..97032823c 100644
--- a/docs/rules/order-in-components.md
+++ b/docs/rules/order-in-components.md
@@ -1,7 +1,5 @@
 # enforce order of properties in components (order-in-components)
 
-- :white_check_mark: The `"extends": "plugin:vue/recommended"` property in a configuration file enables this rule.
-
 This rule makes sure you keep declared order of properties in components.
 
 ## :book: Rule Details
diff --git a/docs/rules/require-component-is.md b/docs/rules/require-component-is.md
index 41fe9b23d..c15a3c905 100644
--- a/docs/rules/require-component-is.md
+++ b/docs/rules/require-component-is.md
@@ -1,7 +1,5 @@
 # require `v-bind:is` of `<component>` elements (require-component-is)
 
-- :white_check_mark: The `"extends": "plugin:vue/recommended"` property in a configuration file enables this rule.
-
 > You can use the same mount point and dynamically switch between multiple components using the reserved `<component>` element and dynamically bind to its `is` attribute:
 >
 > https://vuejs.org/v2/guide/components.html#Dynamic-Components
diff --git a/docs/rules/require-default-prop.md b/docs/rules/require-default-prop.md
index 8e21fbd53..08fb9db09 100644
--- a/docs/rules/require-default-prop.md
+++ b/docs/rules/require-default-prop.md
@@ -1,7 +1,5 @@
 # require default value for props (require-default-prop)
 
-- :white_check_mark: The `"extends": "plugin:vue/recommended"` property in a configuration file enables this rule.
-
 This rule requires default value to be set for each props that are not marked as `required`.
 
 ## Rule Details
diff --git a/docs/rules/require-prop-types.md b/docs/rules/require-prop-types.md
index 638d77d6b..3236d74a2 100644
--- a/docs/rules/require-prop-types.md
+++ b/docs/rules/require-prop-types.md
@@ -1,7 +1,5 @@
 # require type definitions in props (require-prop-types)
 
-- :white_check_mark: The `"extends": "plugin:vue/recommended"` property in a configuration file enables this rule.
-
 In committed code, prop definitions should always be as detailed as possible, specifying at least type(s).
 
 ## :book: Rule Details
diff --git a/docs/rules/require-render-return.md b/docs/rules/require-render-return.md
index 9d0c81fb9..ffbb374d0 100644
--- a/docs/rules/require-render-return.md
+++ b/docs/rules/require-render-return.md
@@ -1,7 +1,5 @@
 # enforce render function to always return value (require-render-return)
 
-- :white_check_mark: The `"extends": "plugin:vue/recommended"` property in a configuration file enables this rule.
-
 This rule aims to enforce render function to always return value
 
 ## :book: Rule Details
diff --git a/docs/rules/require-v-for-key.md b/docs/rules/require-v-for-key.md
index 9db96c330..783f5f6ac 100644
--- a/docs/rules/require-v-for-key.md
+++ b/docs/rules/require-v-for-key.md
@@ -1,7 +1,5 @@
 # require `v-bind:key` with `v-for` directives (require-v-for-key)
 
-- :white_check_mark: The `"extends": "plugin:vue/recommended"` property in a configuration file enables this rule.
-
 When `v-for` is written on custom components, it requires `v-bind:key` at the same time.
 On other elements, it's better that `v-bind:key` is written as well.
 
diff --git a/docs/rules/require-valid-default-prop.md b/docs/rules/require-valid-default-prop.md
index bf061e4aa..81b3aac8a 100644
--- a/docs/rules/require-valid-default-prop.md
+++ b/docs/rules/require-valid-default-prop.md
@@ -1,7 +1,5 @@
 # enforce props default values to be valid (require-valid-default-prop)
 
-- :white_check_mark: The `"extends": "plugin:vue/recommended"` property in a configuration file enables this rule.
-
 This rule checks whether the default value of each prop is valid for the given type. It should report an error when default value for type `Array` or `Object` is not returned using function.
 
 ## :book: Rule Details
diff --git a/docs/rules/return-in-computed-property.md b/docs/rules/return-in-computed-property.md
index a9a093ffa..83c1adae1 100644
--- a/docs/rules/return-in-computed-property.md
+++ b/docs/rules/return-in-computed-property.md
@@ -1,7 +1,5 @@
 # enforce that a return statement is present in computed property (return-in-computed-property)
 
-- :white_check_mark: The `"extends": "plugin:vue/recommended"` property in a configuration file enables this rule.
-
 ## :book: Rule Details
 
 This rule enforces that a `return` statement is present in `computed` properties.
diff --git a/docs/rules/this-in-template.md b/docs/rules/this-in-template.md
index 14104f5a3..037bbe0ed 100644
--- a/docs/rules/this-in-template.md
+++ b/docs/rules/this-in-template.md
@@ -1,7 +1,5 @@
 # enforce usage of `this` in template (this-in-template)
 
-- :white_check_mark: The `"extends": "plugin:vue/recommended"` property in a configuration file enables this rule.
-
 ## :book: Rule Details
 
 :-1: Examples of **incorrect** code for this rule:
diff --git a/docs/rules/v-bind-style.md b/docs/rules/v-bind-style.md
index 28e380472..1375306bc 100644
--- a/docs/rules/v-bind-style.md
+++ b/docs/rules/v-bind-style.md
@@ -1,6 +1,5 @@
 # enforce `v-bind` directive style (v-bind-style)
 
-- :white_check_mark: The `"extends": "plugin:vue/recommended"` property in a configuration file enables this rule.
 - :wrench: The `--fix` option on the [command line](http://eslint.org/docs/user-guide/command-line-interface#fix) can automatically fix some of the problems reported by this rule.
 
 This rule enforces `v-bind` directive style which you should use shorthand or long form.
diff --git a/docs/rules/v-on-style.md b/docs/rules/v-on-style.md
index c52dcee3e..144ee12b7 100644
--- a/docs/rules/v-on-style.md
+++ b/docs/rules/v-on-style.md
@@ -1,6 +1,5 @@
 # enforce `v-on` directive style (v-on-style)
 
-- :white_check_mark: The `"extends": "plugin:vue/recommended"` property in a configuration file enables this rule.
 - :wrench: The `--fix` option on the [command line](http://eslint.org/docs/user-guide/command-line-interface#fix) can automatically fix some of the problems reported by this rule.
 
 This rule enforces `v-on` directive style which you should use shorthand or long form.
diff --git a/docs/rules/valid-template-root.md b/docs/rules/valid-template-root.md
index bde86b40a..762eadee3 100644
--- a/docs/rules/valid-template-root.md
+++ b/docs/rules/valid-template-root.md
@@ -1,7 +1,5 @@
 # enforce valid template root (valid-template-root)
 
-- :white_check_mark: The `"extends": "plugin:vue/recommended"` property in a configuration file enables this rule.
-
 This rule checks whether every template root is valid.
 
 ## :book: Rule Details
diff --git a/docs/rules/valid-v-bind.md b/docs/rules/valid-v-bind.md
index bcb01ed2e..11b3431fe 100644
--- a/docs/rules/valid-v-bind.md
+++ b/docs/rules/valid-v-bind.md
@@ -1,7 +1,5 @@
 # enforce valid `v-bind` directives (valid-v-bind)
 
-- :white_check_mark: The `"extends": "plugin:vue/recommended"` property in a configuration file enables this rule.
-
 This rule checks whether every `v-bind` directive is valid.
 
 ## :book: Rule Details
diff --git a/docs/rules/valid-v-cloak.md b/docs/rules/valid-v-cloak.md
index b0905c3d4..52c249fcb 100644
--- a/docs/rules/valid-v-cloak.md
+++ b/docs/rules/valid-v-cloak.md
@@ -1,7 +1,5 @@
 # enforce valid `v-cloak` directives (valid-v-cloak)
 
-- :white_check_mark: The `"extends": "plugin:vue/recommended"` property in a configuration file enables this rule.
-
 This rule checks whether every `v-cloak` directive is valid.
 
 ## :book: Rule Details
diff --git a/docs/rules/valid-v-else-if.md b/docs/rules/valid-v-else-if.md
index 83916b7bd..a26a08a92 100644
--- a/docs/rules/valid-v-else-if.md
+++ b/docs/rules/valid-v-else-if.md
@@ -1,7 +1,5 @@
 # enforce valid `v-else-if` directives (valid-v-else-if)
 
-- :white_check_mark: The `"extends": "plugin:vue/recommended"` property in a configuration file enables this rule.
-
 This rule checks whether every `v-else-if` directive is valid.
 
 ## :book: Rule Details
diff --git a/docs/rules/valid-v-else.md b/docs/rules/valid-v-else.md
index f9e849a98..8f4304415 100644
--- a/docs/rules/valid-v-else.md
+++ b/docs/rules/valid-v-else.md
@@ -1,7 +1,5 @@
 # enforce valid `v-else` directives (valid-v-else)
 
-- :white_check_mark: The `"extends": "plugin:vue/recommended"` property in a configuration file enables this rule.
-
 This rule checks whether every `v-else` directive is valid.
 
 ## :book: Rule Details
diff --git a/docs/rules/valid-v-for.md b/docs/rules/valid-v-for.md
index 59d05bda5..03720b6a6 100644
--- a/docs/rules/valid-v-for.md
+++ b/docs/rules/valid-v-for.md
@@ -1,7 +1,5 @@
 # enforce valid `v-for` directives (valid-v-for)
 
-- :white_check_mark: The `"extends": "plugin:vue/recommended"` property in a configuration file enables this rule.
-
 This rule checks whether every `v-for` directive is valid.
 
 ## :book: Rule Details
diff --git a/docs/rules/valid-v-html.md b/docs/rules/valid-v-html.md
index 1967bbe7a..1269cb850 100644
--- a/docs/rules/valid-v-html.md
+++ b/docs/rules/valid-v-html.md
@@ -1,7 +1,5 @@
 # enforce valid `v-html` directives (valid-v-html)
 
-- :white_check_mark: The `"extends": "plugin:vue/recommended"` property in a configuration file enables this rule.
-
 This rule checks whether every `v-html` directive is valid.
 
 ## :book: Rule Details
diff --git a/docs/rules/valid-v-if.md b/docs/rules/valid-v-if.md
index bee8ab638..4955b9439 100644
--- a/docs/rules/valid-v-if.md
+++ b/docs/rules/valid-v-if.md
@@ -1,7 +1,5 @@
 # enforce valid `v-if` directives (valid-v-if)
 
-- :white_check_mark: The `"extends": "plugin:vue/recommended"` property in a configuration file enables this rule.
-
 This rule checks whether every `v-if` directive is valid.
 
 ## :book: Rule Details
diff --git a/docs/rules/valid-v-model.md b/docs/rules/valid-v-model.md
index 1c71de3a8..35a986144 100644
--- a/docs/rules/valid-v-model.md
+++ b/docs/rules/valid-v-model.md
@@ -1,7 +1,5 @@
 # enforce valid `v-model` directives (valid-v-model)
 
-- :white_check_mark: The `"extends": "plugin:vue/recommended"` property in a configuration file enables this rule.
-
 This rule checks whether every `v-model` directive is valid.
 
 ## :book: Rule Details
diff --git a/docs/rules/valid-v-on.md b/docs/rules/valid-v-on.md
index df9554444..26d71c032 100644
--- a/docs/rules/valid-v-on.md
+++ b/docs/rules/valid-v-on.md
@@ -1,7 +1,5 @@
 # enforce valid `v-on` directives (valid-v-on)
 
-- :white_check_mark: The `"extends": "plugin:vue/recommended"` property in a configuration file enables this rule.
-
 This rule checks whether every `v-on` directive is valid.
 
 ## :book: Rule Details
diff --git a/docs/rules/valid-v-once.md b/docs/rules/valid-v-once.md
index 40972e39f..3df04f844 100644
--- a/docs/rules/valid-v-once.md
+++ b/docs/rules/valid-v-once.md
@@ -1,7 +1,5 @@
 # enforce valid `v-once` directives (valid-v-once)
 
-- :white_check_mark: The `"extends": "plugin:vue/recommended"` property in a configuration file enables this rule.
-
 This rule checks whether every `v-once` directive is valid.
 
 ## :book: Rule Details
diff --git a/docs/rules/valid-v-pre.md b/docs/rules/valid-v-pre.md
index 26692301e..6855363c4 100644
--- a/docs/rules/valid-v-pre.md
+++ b/docs/rules/valid-v-pre.md
@@ -1,7 +1,5 @@
 # enforce valid `v-pre` directives (valid-v-pre)
 
-- :white_check_mark: The `"extends": "plugin:vue/recommended"` property in a configuration file enables this rule.
-
 This rule checks whether every `v-pre` directive is valid.
 
 ## :book: Rule Details
diff --git a/docs/rules/valid-v-show.md b/docs/rules/valid-v-show.md
index 4a7589044..746a1d01c 100644
--- a/docs/rules/valid-v-show.md
+++ b/docs/rules/valid-v-show.md
@@ -1,7 +1,5 @@
 # enforce valid `v-show` directives (valid-v-show)
 
-- :white_check_mark: The `"extends": "plugin:vue/recommended"` property in a configuration file enables this rule.
-
 This rule checks whether every `v-show` directive is valid.
 
 ## :book: Rule Details
diff --git a/docs/rules/valid-v-text.md b/docs/rules/valid-v-text.md
index b447705c7..055d0e50f 100644
--- a/docs/rules/valid-v-text.md
+++ b/docs/rules/valid-v-text.md
@@ -1,7 +1,5 @@
 # enforce valid `v-text` directives (valid-v-text)
 
-- :white_check_mark: The `"extends": "plugin:vue/recommended"` property in a configuration file enables this rule.
-
 This rule checks whether every `v-text` directive is valid.
 
 ## :book: Rule Details
diff --git a/eslint-internal-rules/consistent-docs-description.js b/eslint-internal-rules/consistent-docs-description.js
index dc30a5699..acc4cdfb6 100644
--- a/eslint-internal-rules/consistent-docs-description.js
+++ b/eslint-internal-rules/consistent-docs-description.js
@@ -115,8 +115,7 @@ module.exports = {
   meta: {
     docs: {
       description: 'enforce correct conventions of `meta.docs.description` property in core rules',
-      category: 'Internal',
-      recommended: false
+      category: 'Internal'
     },
     fixable: 'code',
     schema: []
diff --git a/eslint-internal-rules/no-invalid-meta.js b/eslint-internal-rules/no-invalid-meta.js
index 1550d619f..af4afd8e3 100644
--- a/eslint-internal-rules/no-invalid-meta.js
+++ b/eslint-internal-rules/no-invalid-meta.js
@@ -72,18 +72,6 @@ function hasMetaDocsCategory (metaPropertyNode) {
   return metaDocs && getPropertyFromObject('category', metaDocs.value)
 }
 
-/**
- * Whether this `meta` ObjectExpression has a `docs.recommended` property defined or not.
- *
- * @param {ASTNode} metaPropertyNode The `meta` ObjectExpression for this rule.
- * @returns {boolean} `true` if a `docs.recommended` property exists.
- */
-function hasMetaDocsRecommended (metaPropertyNode) {
-  const metaDocs = getPropertyFromObject('docs', metaPropertyNode.value)
-
-  return metaDocs && getPropertyFromObject('recommended', metaDocs.value)
-}
-
 /**
  * Whether this `meta` ObjectExpression has a `schema` property defined or not.
  *
@@ -125,11 +113,6 @@ function checkMetaValidity (context, exportsNode) {
     return
   }
 
-  if (!hasMetaDocsRecommended(metaProperty)) {
-    context.report(metaProperty, 'Rule is missing a meta.docs.recommended property.')
-    return
-  }
-
   if (!hasMetaSchema(metaProperty)) {
     context.report(metaProperty, 'Rule is missing a meta.schema property.')
   }
@@ -153,8 +136,7 @@ module.exports = {
   meta: {
     docs: {
       description: 'enforce correct use of `meta` property in core rules',
-      category: 'Internal',
-      recommended: false
+      category: 'Internal'
     },
 
     schema: []
diff --git a/lib/all-rules.js b/lib/all-rules.js
new file mode 100644
index 000000000..b2ff227f5
--- /dev/null
+++ b/lib/all-rules.js
@@ -0,0 +1,51 @@
+/*
+* IMPORTANT!
+* This file has been automatically generated,
+* in order to update it's content execute "npm run update"
+*/
+module.exports = {
+  "vue/attribute-hyphenation": "error",
+  "vue/html-end-tags": "error",
+  "vue/html-quotes": "error",
+  "vue/html-self-closing": "error",
+  "vue/jsx-uses-vars": "error",
+  "vue/max-attributes-per-line": "error",
+  "vue/mustache-interpolation-spacing": "error",
+  "vue/name-property-casing": "error",
+  "vue/no-async-in-computed-properties": "error",
+  "vue/no-confusing-v-for-v-if": "error",
+  "vue/no-dupe-keys": "error",
+  "vue/no-duplicate-attributes": "error",
+  "vue/no-multi-spaces": "error",
+  "vue/no-parsing-error": "error",
+  "vue/no-reserved-keys": "error",
+  "vue/no-shared-component-data": "error",
+  "vue/no-side-effects-in-computed-properties": "error",
+  "vue/no-template-key": "error",
+  "vue/no-textarea-mustache": "error",
+  "vue/order-in-components": "error",
+  "vue/require-component-is": "error",
+  "vue/require-default-prop": "error",
+  "vue/require-prop-types": "error",
+  "vue/require-render-return": "error",
+  "vue/require-v-for-key": "error",
+  "vue/require-valid-default-prop": "error",
+  "vue/return-in-computed-property": "error",
+  "vue/this-in-template": "error",
+  "vue/v-bind-style": "error",
+  "vue/v-on-style": "error",
+  "vue/valid-template-root": "error",
+  "vue/valid-v-bind": "error",
+  "vue/valid-v-cloak": "error",
+  "vue/valid-v-else-if": "error",
+  "vue/valid-v-else": "error",
+  "vue/valid-v-for": "error",
+  "vue/valid-v-html": "error",
+  "vue/valid-v-if": "error",
+  "vue/valid-v-model": "error",
+  "vue/valid-v-on": "error",
+  "vue/valid-v-once": "error",
+  "vue/valid-v-pre": "error",
+  "vue/valid-v-show": "error",
+  "vue/valid-v-text": "error"
+}
\ No newline at end of file
diff --git a/lib/base-rules.js b/lib/base-rules.js
new file mode 100644
index 000000000..338b9c97b
--- /dev/null
+++ b/lib/base-rules.js
@@ -0,0 +1,8 @@
+/*
+* IMPORTANT!
+* This file has been automatically generated,
+* in order to update it's content execute "npm run update"
+*/
+module.exports = {
+  "vue/jsx-uses-vars": "error"
+}
\ No newline at end of file
diff --git a/lib/config/all.js b/lib/config/all.js
new file mode 100644
index 000000000..5a52e9ca0
--- /dev/null
+++ b/lib/config/all.js
@@ -0,0 +1,4 @@
+module.exports = {
+  extends: require.resolve('./base.js'),
+  rules: require('../all-rules.js')
+}
diff --git a/lib/config/base.js b/lib/config/base.js
index fb9f2ad78..2039b8019 100644
--- a/lib/config/base.js
+++ b/lib/config/base.js
@@ -19,5 +19,7 @@ module.exports = {
 
   plugins: [
     'vue'
-  ]
+  ],
+
+  rules: require('../base-rules.js')
 }
diff --git a/lib/config/essential.js b/lib/config/essential.js
new file mode 100644
index 000000000..474931520
--- /dev/null
+++ b/lib/config/essential.js
@@ -0,0 +1,4 @@
+module.exports = {
+  extends: require.resolve('./base.js'),
+  rules: require('../essential-rules.js')
+}
diff --git a/lib/config/strongly-recommended.js b/lib/config/strongly-recommended.js
new file mode 100644
index 000000000..af0045aa3
--- /dev/null
+++ b/lib/config/strongly-recommended.js
@@ -0,0 +1,4 @@
+module.exports = {
+  extends: require.resolve('./base.js'),
+  rules: require('../strongly-recommended-rules.js')
+}
diff --git a/lib/essential-rules.js b/lib/essential-rules.js
new file mode 100644
index 000000000..e918cb366
--- /dev/null
+++ b/lib/essential-rules.js
@@ -0,0 +1,37 @@
+/*
+* IMPORTANT!
+* This file has been automatically generated,
+* in order to update it's content execute "npm run update"
+*/
+module.exports = {
+  "vue/jsx-uses-vars": "error",
+  "vue/no-async-in-computed-properties": "error",
+  "vue/no-dupe-keys": "error",
+  "vue/no-duplicate-attributes": "error",
+  "vue/no-parsing-error": "error",
+  "vue/no-reserved-keys": "error",
+  "vue/no-shared-component-data": "error",
+  "vue/no-side-effects-in-computed-properties": "error",
+  "vue/no-template-key": "error",
+  "vue/no-textarea-mustache": "error",
+  "vue/no-unused-vars": "error",
+  "vue/require-component-is": "error",
+  "vue/require-render-return": "error",
+  "vue/require-v-for-key": "error",
+  "vue/require-valid-default-prop": "error",
+  "vue/return-in-computed-property": "error",
+  "vue/valid-template-root": "error",
+  "vue/valid-v-bind": "error",
+  "vue/valid-v-cloak": "error",
+  "vue/valid-v-else-if": "error",
+  "vue/valid-v-else": "error",
+  "vue/valid-v-for": "error",
+  "vue/valid-v-html": "error",
+  "vue/valid-v-if": "error",
+  "vue/valid-v-model": "error",
+  "vue/valid-v-on": "error",
+  "vue/valid-v-once": "error",
+  "vue/valid-v-pre": "error",
+  "vue/valid-v-show": "error",
+  "vue/valid-v-text": "error"
+}
\ No newline at end of file
diff --git a/lib/recommended-rules.js b/lib/recommended-rules.js
index 67863d3fa..b11f218a5 100644
--- a/lib/recommended-rules.js
+++ b/lib/recommended-rules.js
@@ -1,14 +1,13 @@
 /*
- * IMPORTANT!
- * This file has been automatically generated,
- * in order to update its content execute "npm run update"
- */
+* IMPORTANT!
+* This file has been automatically generated,
+* in order to update it's content execute "npm run update"
+*/
 module.exports = {
   "vue/attribute-hyphenation": "error",
   "vue/html-end-tags": "error",
-  "vue/html-indent": "off",
-  "vue/html-no-self-closing": "error",
-  "vue/html-quotes": "off",
+  "vue/html-indent": "error",
+  "vue/html-quotes": "error",
   "vue/html-self-closing": "error",
   "vue/jsx-uses-vars": "error",
   "vue/max-attributes-per-line": "error",
@@ -18,29 +17,14 @@ module.exports = {
   "vue/no-confusing-v-for-v-if": "error",
   "vue/no-dupe-keys": "error",
   "vue/no-duplicate-attributes": "error",
-  "vue/no-invalid-template-root": "off",
-  "vue/no-invalid-v-bind": "off",
-  "vue/no-invalid-v-cloak": "off",
-  "vue/no-invalid-v-else-if": "off",
-  "vue/no-invalid-v-else": "off",
-  "vue/no-invalid-v-for": "off",
-  "vue/no-invalid-v-html": "off",
-  "vue/no-invalid-v-if": "off",
-  "vue/no-invalid-v-model": "off",
-  "vue/no-invalid-v-on": "off",
-  "vue/no-invalid-v-once": "off",
-  "vue/no-invalid-v-pre": "off",
-  "vue/no-invalid-v-show": "off",
-  "vue/no-invalid-v-text": "off",
   "vue/no-multi-spaces": "error",
   "vue/no-parsing-error": "error",
   "vue/no-reserved-keys": "error",
-  "vue/no-reservered-keys": "off",
   "vue/no-shared-component-data": "error",
   "vue/no-side-effects-in-computed-properties": "error",
   "vue/no-template-key": "error",
   "vue/no-textarea-mustache": "error",
-  "vue/no-unused-vars": "off",
+  "vue/no-unused-vars": "error",
   "vue/order-in-components": "error",
   "vue/require-component-is": "error",
   "vue/require-default-prop": "error",
diff --git a/lib/rules/attribute-hyphenation.js b/lib/rules/attribute-hyphenation.js
index 4c09b6320..94ddf2f2d 100644
--- a/lib/rules/attribute-hyphenation.js
+++ b/lib/rules/attribute-hyphenation.js
@@ -59,8 +59,7 @@ module.exports = {
   meta: {
     docs: {
       description: 'enforce attribute naming style in template',
-      category: 'Stylistic Issues',
-      recommended: true
+      category: 'strongly-recommended'
     },
     fixable: 'code',
     schema: [
diff --git a/lib/rules/html-end-tags.js b/lib/rules/html-end-tags.js
index c6ce7991c..8846fb636 100644
--- a/lib/rules/html-end-tags.js
+++ b/lib/rules/html-end-tags.js
@@ -60,8 +60,7 @@ module.exports = {
   meta: {
     docs: {
       description: 'enforce end tag style',
-      category: 'Best Practices',
-      recommended: true
+      category: 'strongly-recommended'
     },
     fixable: 'code',
     schema: []
diff --git a/lib/rules/html-indent.js b/lib/rules/html-indent.js
index 16bcf42b5..b4a41d572 100644
--- a/lib/rules/html-indent.js
+++ b/lib/rules/html-indent.js
@@ -30,7 +30,7 @@ const BLOCK_COMMENT_PREFIX = /^\s*\*/
 function parseOptions (type, options) {
   const ret = {
     indentChar: ' ',
-    indentSize: 4,
+    indentSize: 2,
     attribute: 1,
     closeBracket: 0,
     switchCase: 0,
@@ -1191,8 +1191,7 @@ module.exports = {
   meta: {
     docs: {
       description: 'enforce consistent indentation in `<template>`',
-      category: 'Stylistic Issues',
-      recommended: false
+      category: 'strongly-recommended'
     },
     fixable: 'whitespace',
     schema: [
diff --git a/lib/rules/html-no-self-closing.js b/lib/rules/html-no-self-closing.js
index d36c9cdc6..974b9c3c3 100644
--- a/lib/rules/html-no-self-closing.js
+++ b/lib/rules/html-no-self-closing.js
@@ -53,8 +53,7 @@ module.exports = {
   meta: {
     docs: {
       description: 'disallow self-closing elements',
-      category: 'Best Practices',
-      recommended: true,
+      category: 'strongly-recommended',
       replacedBy: ['html-self-closing']
     },
     deprecated: true,
diff --git a/lib/rules/html-quotes.js b/lib/rules/html-quotes.js
index 8575effd3..9326420b9 100644
--- a/lib/rules/html-quotes.js
+++ b/lib/rules/html-quotes.js
@@ -52,8 +52,7 @@ module.exports = {
   meta: {
     docs: {
       description: 'enforce quotes style of HTML attributes',
-      category: 'Stylistic Issues',
-      recommended: false
+      category: 'recommended'
     },
     fixable: false,
     schema: [
diff --git a/lib/rules/html-self-closing.js b/lib/rules/html-self-closing.js
index 4508c4364..f311a63f9 100644
--- a/lib/rules/html-self-closing.js
+++ b/lib/rules/html-self-closing.js
@@ -143,8 +143,7 @@ module.exports = {
   meta: {
     docs: {
       description: 'enforce self-closing style',
-      category: 'Stylistic Issues',
-      recommended: true
+      category: 'strongly-recommended'
     },
     fixable: 'code',
     schema: {
diff --git a/lib/rules/jsx-uses-vars.js b/lib/rules/jsx-uses-vars.js
index cc1fe70ee..d64a436dc 100644
--- a/lib/rules/jsx-uses-vars.js
+++ b/lib/rules/jsx-uses-vars.js
@@ -38,8 +38,7 @@ module.exports = {
   meta: {
     docs: {
       description: 'prevent variables used in JSX to be marked as unused', // eslint-disable-line consistent-docs-description
-      category: 'Variables',
-      recommended: true
+      category: 'base'
     },
     schema: []
   },
diff --git a/lib/rules/max-attributes-per-line.js b/lib/rules/max-attributes-per-line.js
index 1c6703385..375dcbf79 100644
--- a/lib/rules/max-attributes-per-line.js
+++ b/lib/rules/max-attributes-per-line.js
@@ -13,8 +13,7 @@ module.exports = {
   meta: {
     docs: {
       description: 'enforce the maximum number of attributes per line',
-      category: 'Stylistic Issues',
-      recommended: true
+      category: 'strongly-recommended'
     },
     fixable: null,
     schema: [
diff --git a/lib/rules/mustache-interpolation-spacing.js b/lib/rules/mustache-interpolation-spacing.js
index be871fcf8..87d758d9b 100644
--- a/lib/rules/mustache-interpolation-spacing.js
+++ b/lib/rules/mustache-interpolation-spacing.js
@@ -18,8 +18,7 @@ module.exports = {
   meta: {
     docs: {
       description: 'enforce unified spacing in mustache interpolations',
-      category: 'Stylistic Issues',
-      recommended: true
+      category: 'strongly-recommended'
     },
     fixable: 'whitespace',
     schema: [
diff --git a/lib/rules/name-property-casing.js b/lib/rules/name-property-casing.js
index fe15e3189..4b3d482c5 100644
--- a/lib/rules/name-property-casing.js
+++ b/lib/rules/name-property-casing.js
@@ -48,8 +48,7 @@ module.exports = {
   meta: {
     docs: {
       description: 'enforce specific casing for the name property in Vue components',
-      category: 'Stylistic Issues',
-      recommended: true
+      category: 'strongly-recommended'
     },
     fixable: 'code',  // or "code" or "whitespace"
     schema: [
diff --git a/lib/rules/no-async-in-computed-properties.js b/lib/rules/no-async-in-computed-properties.js
index 6d1f8b413..2a3a17d53 100644
--- a/lib/rules/no-async-in-computed-properties.js
+++ b/lib/rules/no-async-in-computed-properties.js
@@ -148,8 +148,7 @@ module.exports = {
   meta: {
     docs: {
       description: 'disallow asynchronous actions in computed properties',
-      category: 'Best Practices',
-      recommended: true
+      category: 'essential'
     },
     fixable: null,
     schema: []
diff --git a/lib/rules/no-confusing-v-for-v-if.js b/lib/rules/no-confusing-v-for-v-if.js
index 26a8d8688..1e00158f6 100644
--- a/lib/rules/no-confusing-v-for-v-if.js
+++ b/lib/rules/no-confusing-v-for-v-if.js
@@ -61,8 +61,7 @@ module.exports = {
   meta: {
     docs: {
       description: 'disallow confusing `v-for` and `v-if` on the same element',
-      category: 'Best Practices',
-      recommended: true
+      category: 'recommended'
     },
     fixable: false,
     schema: []
diff --git a/lib/rules/no-dupe-keys.js b/lib/rules/no-dupe-keys.js
index d5a4efb86..52260e768 100644
--- a/lib/rules/no-dupe-keys.js
+++ b/lib/rules/no-dupe-keys.js
@@ -47,8 +47,7 @@ module.exports = {
   meta: {
     docs: {
       description: 'disallow duplication of field names',
-      category: 'Possible Errors',
-      recommended: true
+      category: 'essential'
     },
     fixable: null,  // or "code" or "whitespace"
     schema: [
diff --git a/lib/rules/no-duplicate-attributes.js b/lib/rules/no-duplicate-attributes.js
index 1a11b35c8..704858f6b 100644
--- a/lib/rules/no-duplicate-attributes.js
+++ b/lib/rules/no-duplicate-attributes.js
@@ -38,7 +38,7 @@ function getName (attribute) {
  */
 function create (context) {
   const options = context.options[0] || {}
-  const allowCoexistStyle = options.allowCoexistStyle === true
+  const allowCoexistStyle = options.allowCoexistStyle !== false
   const allowCoexistClass = options.allowCoexistClass !== false
 
   const directiveNames = new Set()
@@ -89,8 +89,7 @@ module.exports = {
   meta: {
     docs: {
       description: 'disallow duplication of attributes',
-      category: 'Best Practices',
-      recommended: true
+      category: 'essential'
     },
     fixable: false,
 
diff --git a/lib/rules/no-invalid-template-root.js b/lib/rules/no-invalid-template-root.js
index 1dda8b808..1d461244b 100644
--- a/lib/rules/no-invalid-template-root.js
+++ b/lib/rules/no-invalid-template-root.js
@@ -113,8 +113,7 @@ module.exports = {
   meta: {
     docs: {
       description: 'disallow invalid template root',
-      category: 'Possible Errors',
-      recommended: false,
+      category: 'essential',
       replacedBy: ['valid-template-root']
     },
     deprecated: true,
diff --git a/lib/rules/no-invalid-v-bind.js b/lib/rules/no-invalid-v-bind.js
index 05aa8e0ff..ab405ba6f 100644
--- a/lib/rules/no-invalid-v-bind.js
+++ b/lib/rules/no-invalid-v-bind.js
@@ -57,8 +57,7 @@ module.exports = {
   meta: {
     docs: {
       description: 'disallow invalid `v-bind` directives',
-      category: 'Possible Errors',
-      recommended: false,
+      category: 'essential',
       replacedBy: ['valid-v-bind']
     },
     deprecated: true,
diff --git a/lib/rules/no-invalid-v-cloak.js b/lib/rules/no-invalid-v-cloak.js
index 73ecabf21..561f2e36d 100644
--- a/lib/rules/no-invalid-v-cloak.js
+++ b/lib/rules/no-invalid-v-cloak.js
@@ -58,8 +58,7 @@ module.exports = {
   meta: {
     docs: {
       description: 'disallow invalid `v-cloak` directives',
-      category: 'Possible Errors',
-      recommended: false,
+      category: 'essential',
       replacedBy: ['valid-v-cloak']
     },
     deprecated: true,
diff --git a/lib/rules/no-invalid-v-else-if.js b/lib/rules/no-invalid-v-else-if.js
index 69cd0ffa9..d8f5724c8 100644
--- a/lib/rules/no-invalid-v-else-if.js
+++ b/lib/rules/no-invalid-v-else-if.js
@@ -81,8 +81,7 @@ module.exports = {
   meta: {
     docs: {
       description: 'disallow invalid `v-else-if` directives',
-      category: 'Possible Errors',
-      recommended: false,
+      category: 'essential',
       replacedBy: ['valid-v-else-if']
     },
     deprecated: true,
diff --git a/lib/rules/no-invalid-v-else.js b/lib/rules/no-invalid-v-else.js
index f06e9e12d..d6261e536 100644
--- a/lib/rules/no-invalid-v-else.js
+++ b/lib/rules/no-invalid-v-else.js
@@ -81,8 +81,7 @@ module.exports = {
   meta: {
     docs: {
       description: 'disallow invalid `v-else` directives',
-      category: 'Possible Errors',
-      recommended: false,
+      category: 'essential',
       replacedBy: ['valid-v-else']
     },
     deprecated: true,
diff --git a/lib/rules/no-invalid-v-for.js b/lib/rules/no-invalid-v-for.js
index 66cd7e691..6cc773e62 100644
--- a/lib/rules/no-invalid-v-for.js
+++ b/lib/rules/no-invalid-v-for.js
@@ -162,8 +162,7 @@ module.exports = {
   meta: {
     docs: {
       description: 'disallow invalid `v-for` directives',
-      category: 'Possible Errors',
-      recommended: false,
+      category: 'essential',
       replacedBy: ['valid-v-for']
     },
     deprecated: true,
diff --git a/lib/rules/no-invalid-v-html.js b/lib/rules/no-invalid-v-html.js
index 2bd6ef3a5..56c3fd2ee 100644
--- a/lib/rules/no-invalid-v-html.js
+++ b/lib/rules/no-invalid-v-html.js
@@ -58,8 +58,7 @@ module.exports = {
   meta: {
     docs: {
       description: 'disallow invalid `v-html` directives',
-      category: 'Possible Errors',
-      recommended: false,
+      category: 'essential',
       replacedBy: ['valid-v-html']
     },
     deprecated: true,
diff --git a/lib/rules/no-invalid-v-if.js b/lib/rules/no-invalid-v-if.js
index e24b2b6dc..a48542521 100644
--- a/lib/rules/no-invalid-v-if.js
+++ b/lib/rules/no-invalid-v-if.js
@@ -74,8 +74,7 @@ module.exports = {
   meta: {
     docs: {
       description: 'disallow invalid `v-if` directives',
-      category: 'Possible Errors',
-      recommended: false,
+      category: 'essential',
       replacedBy: ['valid-v-if']
     },
     deprecated: true,
diff --git a/lib/rules/no-invalid-v-model.js b/lib/rules/no-invalid-v-model.js
index 8c243afc2..25b58e76f 100644
--- a/lib/rules/no-invalid-v-model.js
+++ b/lib/rules/no-invalid-v-model.js
@@ -175,8 +175,7 @@ module.exports = {
   meta: {
     docs: {
       description: 'disallow invalid `v-model` directives',
-      category: 'Possible Errors',
-      recommended: false,
+      category: 'essential',
       replacedBy: ['valid-v-model']
     },
     deprecated: true,
diff --git a/lib/rules/no-invalid-v-on.js b/lib/rules/no-invalid-v-on.js
index 6a7577bed..5906132f6 100644
--- a/lib/rules/no-invalid-v-on.js
+++ b/lib/rules/no-invalid-v-on.js
@@ -63,8 +63,7 @@ module.exports = {
   meta: {
     docs: {
       description: 'disallow invalid `v-on` directives',
-      category: 'Possible Errors',
-      recommended: false,
+      category: 'essential',
       replacedBy: ['valid-v-on']
     },
     deprecated: true,
diff --git a/lib/rules/no-invalid-v-once.js b/lib/rules/no-invalid-v-once.js
index aa6c75d55..d21013bd5 100644
--- a/lib/rules/no-invalid-v-once.js
+++ b/lib/rules/no-invalid-v-once.js
@@ -58,8 +58,7 @@ module.exports = {
   meta: {
     docs: {
       description: 'disallow invalid `v-once` directives',
-      category: 'Possible Errors',
-      recommended: false,
+      category: 'essential',
       replacedBy: ['valid-v-once']
     },
     deprecated: true,
diff --git a/lib/rules/no-invalid-v-pre.js b/lib/rules/no-invalid-v-pre.js
index 3770107f9..30ec2c198 100644
--- a/lib/rules/no-invalid-v-pre.js
+++ b/lib/rules/no-invalid-v-pre.js
@@ -58,8 +58,7 @@ module.exports = {
   meta: {
     docs: {
       description: 'disallow invalid `v-pre` directives',
-      category: 'Possible Errors',
-      recommended: false,
+      category: 'essential',
       replacedBy: ['valid-v-pre']
     },
     deprecated: true,
diff --git a/lib/rules/no-invalid-v-show.js b/lib/rules/no-invalid-v-show.js
index e98e271f1..17867a389 100644
--- a/lib/rules/no-invalid-v-show.js
+++ b/lib/rules/no-invalid-v-show.js
@@ -58,8 +58,7 @@ module.exports = {
   meta: {
     docs: {
       description: 'disallow invalid `v-show` directives',
-      category: 'Possible Errors',
-      recommended: false,
+      category: 'essential',
       replacedBy: ['valid-v-show']
     },
     deprecated: true,
diff --git a/lib/rules/no-invalid-v-text.js b/lib/rules/no-invalid-v-text.js
index e7716f24e..c21042628 100644
--- a/lib/rules/no-invalid-v-text.js
+++ b/lib/rules/no-invalid-v-text.js
@@ -58,8 +58,7 @@ module.exports = {
   meta: {
     docs: {
       description: 'disallow invalid `v-text` directives',
-      category: 'Possible Errors',
-      recommended: false,
+      category: 'essential',
       replacedBy: ['valid-v-text']
     },
     deprecated: true,
diff --git a/lib/rules/no-multi-spaces.js b/lib/rules/no-multi-spaces.js
index b66fa447f..e26558a80 100644
--- a/lib/rules/no-multi-spaces.js
+++ b/lib/rules/no-multi-spaces.js
@@ -12,8 +12,7 @@ module.exports = {
   meta: {
     docs: {
       description: 'disallow multiple spaces',
-      category: 'Stylistic Issues',
-      recommended: true
+      category: 'strongly-recommended'
     },
     fixable: 'whitespace',  // or "code" or "whitespace"
     schema: []
diff --git a/lib/rules/no-parsing-error.js b/lib/rules/no-parsing-error.js
index 8d48b547e..60dcf47d3 100644
--- a/lib/rules/no-parsing-error.js
+++ b/lib/rules/no-parsing-error.js
@@ -95,8 +95,7 @@ module.exports = {
   meta: {
     docs: {
       description: 'disallow parsing errors in `<template>`',
-      category: 'Possible Errors',
-      recommended: true
+      category: 'essential'
     },
     fixable: false,
     schema: [
diff --git a/lib/rules/no-reserved-keys.js b/lib/rules/no-reserved-keys.js
index ca0d36334..cf3452e3e 100644
--- a/lib/rules/no-reserved-keys.js
+++ b/lib/rules/no-reserved-keys.js
@@ -50,8 +50,7 @@ module.exports = {
   meta: {
     docs: {
       description: 'disallow overwriting reserved keys',
-      category: 'Possible Errors',
-      recommended: true
+      category: 'essential'
     },
     fixable: null,
     schema: [
diff --git a/lib/rules/no-reservered-keys.js b/lib/rules/no-reservered-keys.js
index 5528b424c..dfe3df378 100644
--- a/lib/rules/no-reservered-keys.js
+++ b/lib/rules/no-reservered-keys.js
@@ -50,8 +50,7 @@ module.exports = {
   meta: {
     docs: {
       description: 'disallow overwriting reserved keys',
-      category: 'Possible Errors',
-      recommended: false,
+      category: 'essential',
       replacedBy: ['no-reserved-keys']
     },
     deprecated: true,
diff --git a/lib/rules/no-shared-component-data.js b/lib/rules/no-shared-component-data.js
index a5668746d..85d97b9dd 100644
--- a/lib/rules/no-shared-component-data.js
+++ b/lib/rules/no-shared-component-data.js
@@ -38,8 +38,7 @@ module.exports = {
   meta: {
     docs: {
       description: "enforce component's data property to be a function",
-      category: 'Possible Errors',
-      recommended: true
+      category: 'essential'
     },
     fixable: null,  // or "code" or "whitespace"
     schema: []
diff --git a/lib/rules/no-side-effects-in-computed-properties.js b/lib/rules/no-side-effects-in-computed-properties.js
index c8fac42e1..8bda3d60d 100644
--- a/lib/rules/no-side-effects-in-computed-properties.js
+++ b/lib/rules/no-side-effects-in-computed-properties.js
@@ -63,8 +63,7 @@ module.exports = {
   meta: {
     docs: {
       description: 'disallow side effects in computed properties',
-      category: 'Best Practices',
-      recommended: true
+      category: 'essential'
     },
     fixable: null,
     schema: []
diff --git a/lib/rules/no-template-key.js b/lib/rules/no-template-key.js
index 313b0d745..1ed2647bb 100644
--- a/lib/rules/no-template-key.js
+++ b/lib/rules/no-template-key.js
@@ -44,8 +44,7 @@ module.exports = {
   meta: {
     docs: {
       description: 'disallow `key` attribute on `<template>`',
-      category: 'Possible Errors',
-      recommended: true
+      category: 'essential'
     },
     fixable: false,
     schema: []
diff --git a/lib/rules/no-textarea-mustache.js b/lib/rules/no-textarea-mustache.js
index 9e4d0cbb2..e6eb28e09 100644
--- a/lib/rules/no-textarea-mustache.js
+++ b/lib/rules/no-textarea-mustache.js
@@ -46,8 +46,7 @@ module.exports = {
   meta: {
     docs: {
       description: 'disallow mustaches in `<textarea>`',
-      category: 'Best Practices',
-      recommended: true
+      category: 'essential'
     },
     fixable: false,
     schema: []
diff --git a/lib/rules/no-unused-vars.js b/lib/rules/no-unused-vars.js
index 8aadc0a2e..061cd77aa 100644
--- a/lib/rules/no-unused-vars.js
+++ b/lib/rules/no-unused-vars.js
@@ -38,8 +38,7 @@ module.exports = {
   meta: {
     docs: {
       description: 'disallow unused variable definitions of v-for directives or scope attributes',
-      category: 'Possible Errors',
-      recommended: false
+      category: 'essential'
     },
     fixable: null,
     schema: []
diff --git a/lib/rules/order-in-components.js b/lib/rules/order-in-components.js
index 013fe01fd..34edc1ffd 100644
--- a/lib/rules/order-in-components.js
+++ b/lib/rules/order-in-components.js
@@ -100,8 +100,7 @@ module.exports = {
   meta: {
     docs: {
       description: 'enforce order of properties in components',
-      category: 'Best Practices',
-      recommended: true
+      category: 'recommended'
     },
     fixable: null,
     schema: [
diff --git a/lib/rules/require-component-is.js b/lib/rules/require-component-is.js
index e51727e35..71819c041 100644
--- a/lib/rules/require-component-is.js
+++ b/lib/rules/require-component-is.js
@@ -44,8 +44,7 @@ module.exports = {
   meta: {
     docs: {
       description: 'require `v-bind:is` of `<component>` elements',
-      category: 'Best Practices',
-      recommended: true
+      category: 'essential'
     },
     fixable: false,
     schema: []
diff --git a/lib/rules/require-default-prop.js b/lib/rules/require-default-prop.js
index 06047566a..a36e64db2 100644
--- a/lib/rules/require-default-prop.js
+++ b/lib/rules/require-default-prop.js
@@ -14,8 +14,7 @@ module.exports = {
   meta: {
     docs: {
       description: 'require default value for props',
-      category: 'Best Practices',
-      recommended: true
+      category: 'strongly-recommended'
     },
     fixable: null,  // or "code" or "whitespace"
     schema: []
diff --git a/lib/rules/require-prop-types.js b/lib/rules/require-prop-types.js
index b46cbb556..a4826f57a 100644
--- a/lib/rules/require-prop-types.js
+++ b/lib/rules/require-prop-types.js
@@ -81,8 +81,7 @@ module.exports = {
   meta: {
     docs: {
       description: 'require type definitions in props',
-      category: 'Best Practices',
-      recommended: true
+      category: 'strongly-recommended'
     },
     fixable: null,  // or "code" or "whitespace"
     schema: [
diff --git a/lib/rules/require-render-return.js b/lib/rules/require-render-return.js
index 39a644479..6d35e65cf 100644
--- a/lib/rules/require-render-return.js
+++ b/lib/rules/require-render-return.js
@@ -44,8 +44,7 @@ module.exports = {
   meta: {
     docs: {
       description: 'enforce render function to always return value',
-      category: 'Possible Errors',
-      recommended: true
+      category: 'essential'
     },
     fixable: null,  // or "code" or "whitespace"
     schema: []
diff --git a/lib/rules/require-v-for-key.js b/lib/rules/require-v-for-key.js
index d0bf59a91..2b438bb20 100644
--- a/lib/rules/require-v-for-key.js
+++ b/lib/rules/require-v-for-key.js
@@ -59,8 +59,7 @@ module.exports = {
   meta: {
     docs: {
       description: 'require `v-bind:key` with `v-for` directives',
-      category: 'Best Practices',
-      recommended: true
+      category: 'essential'
     },
     fixable: false,
     schema: []
diff --git a/lib/rules/require-valid-default-prop.js b/lib/rules/require-valid-default-prop.js
index 473f34c95..db4140bc7 100644
--- a/lib/rules/require-valid-default-prop.js
+++ b/lib/rules/require-valid-default-prop.js
@@ -23,8 +23,7 @@ module.exports = {
   meta: {
     docs: {
       description: 'enforce props default values to be valid',
-      category: 'Possible Errors',
-      recommended: true
+      category: 'essential'
     },
     fixable: null,
     schema: []
diff --git a/lib/rules/return-in-computed-property.js b/lib/rules/return-in-computed-property.js
index c85870deb..a372e1ec5 100644
--- a/lib/rules/return-in-computed-property.js
+++ b/lib/rules/return-in-computed-property.js
@@ -48,8 +48,7 @@ module.exports = {
   meta: {
     docs: {
       description: 'enforce that a return statement is present in computed property',
-      category: 'Possible Errors',
-      recommended: true
+      category: 'essential'
     },
     fixable: null,  // or "code" or "whitespace"
     schema: [
diff --git a/lib/rules/this-in-template.js b/lib/rules/this-in-template.js
index 62ba6f1a0..669ce7651 100644
--- a/lib/rules/this-in-template.js
+++ b/lib/rules/this-in-template.js
@@ -19,8 +19,7 @@ module.exports = {
   meta: {
     docs: {
       description: 'enforce usage of `this` in template',
-      category: 'Best Practices',
-      recommended: true
+      category: 'recommended'
     },
     fixable: null,
     schema: [
diff --git a/lib/rules/v-bind-style.js b/lib/rules/v-bind-style.js
index 4b67aa89d..16748bd47 100644
--- a/lib/rules/v-bind-style.js
+++ b/lib/rules/v-bind-style.js
@@ -53,8 +53,7 @@ module.exports = {
   meta: {
     docs: {
       description: 'enforce `v-bind` directive style',
-      category: 'Stylistic Issues',
-      recommended: true
+      category: 'strongly-recommended'
     },
     fixable: 'code',
     schema: [
diff --git a/lib/rules/v-on-style.js b/lib/rules/v-on-style.js
index 66036c623..6ee91df07 100644
--- a/lib/rules/v-on-style.js
+++ b/lib/rules/v-on-style.js
@@ -54,8 +54,7 @@ module.exports = {
   meta: {
     docs: {
       description: 'enforce `v-on` directive style',
-      category: 'Stylistic Issues',
-      recommended: true
+      category: 'strongly-recommended'
     },
     fixable: 'code',
     schema: [
diff --git a/lib/rules/valid-template-root.js b/lib/rules/valid-template-root.js
index 989c69633..016938df3 100644
--- a/lib/rules/valid-template-root.js
+++ b/lib/rules/valid-template-root.js
@@ -113,8 +113,7 @@ module.exports = {
   meta: {
     docs: {
       description: 'enforce valid template root',
-      category: 'Possible Errors',
-      recommended: true
+      category: 'essential'
     },
     fixable: false,
     schema: []
diff --git a/lib/rules/valid-v-bind.js b/lib/rules/valid-v-bind.js
index 8d37a455b..350d1c830 100644
--- a/lib/rules/valid-v-bind.js
+++ b/lib/rules/valid-v-bind.js
@@ -57,8 +57,7 @@ module.exports = {
   meta: {
     docs: {
       description: 'enforce valid `v-bind` directives',
-      category: 'Possible Errors',
-      recommended: true
+      category: 'essential'
     },
     fixable: false,
     schema: []
diff --git a/lib/rules/valid-v-cloak.js b/lib/rules/valid-v-cloak.js
index 4aa2e891d..cc2f730e8 100644
--- a/lib/rules/valid-v-cloak.js
+++ b/lib/rules/valid-v-cloak.js
@@ -58,8 +58,7 @@ module.exports = {
   meta: {
     docs: {
       description: 'enforce valid `v-cloak` directives',
-      category: 'Possible Errors',
-      recommended: true
+      category: 'essential'
     },
     fixable: false,
     schema: []
diff --git a/lib/rules/valid-v-else-if.js b/lib/rules/valid-v-else-if.js
index 6aee2a89e..01d7f488e 100644
--- a/lib/rules/valid-v-else-if.js
+++ b/lib/rules/valid-v-else-if.js
@@ -81,8 +81,7 @@ module.exports = {
   meta: {
     docs: {
       description: 'enforce valid `v-else-if` directives',
-      category: 'Possible Errors',
-      recommended: true
+      category: 'essential'
     },
     fixable: false,
     schema: []
diff --git a/lib/rules/valid-v-else.js b/lib/rules/valid-v-else.js
index 0733cd0a6..444a2afef 100644
--- a/lib/rules/valid-v-else.js
+++ b/lib/rules/valid-v-else.js
@@ -81,8 +81,7 @@ module.exports = {
   meta: {
     docs: {
       description: 'enforce valid `v-else` directives',
-      category: 'Possible Errors',
-      recommended: true
+      category: 'essential'
     },
     fixable: false,
     schema: []
diff --git a/lib/rules/valid-v-for.js b/lib/rules/valid-v-for.js
index a3c303cba..8e084bf9f 100644
--- a/lib/rules/valid-v-for.js
+++ b/lib/rules/valid-v-for.js
@@ -189,8 +189,7 @@ module.exports = {
   meta: {
     docs: {
       description: 'enforce valid `v-for` directives',
-      category: 'Possible Errors',
-      recommended: true
+      category: 'essential'
     },
     fixable: false,
     schema: []
diff --git a/lib/rules/valid-v-html.js b/lib/rules/valid-v-html.js
index 88a65f704..c4d09393e 100644
--- a/lib/rules/valid-v-html.js
+++ b/lib/rules/valid-v-html.js
@@ -58,8 +58,7 @@ module.exports = {
   meta: {
     docs: {
       description: 'enforce valid `v-html` directives',
-      category: 'Possible Errors',
-      recommended: true
+      category: 'essential'
     },
     fixable: false,
     schema: []
diff --git a/lib/rules/valid-v-if.js b/lib/rules/valid-v-if.js
index 4c3880fae..e0607ed08 100644
--- a/lib/rules/valid-v-if.js
+++ b/lib/rules/valid-v-if.js
@@ -74,8 +74,7 @@ module.exports = {
   meta: {
     docs: {
       description: 'enforce valid `v-if` directives',
-      category: 'Possible Errors',
-      recommended: true
+      category: 'essential'
     },
     fixable: false,
     schema: []
diff --git a/lib/rules/valid-v-model.js b/lib/rules/valid-v-model.js
index 7ec83489e..a0620ecd5 100644
--- a/lib/rules/valid-v-model.js
+++ b/lib/rules/valid-v-model.js
@@ -175,8 +175,7 @@ module.exports = {
   meta: {
     docs: {
       description: 'enforce valid `v-model` directives',
-      category: 'Possible Errors',
-      recommended: true
+      category: 'essential'
     },
     fixable: false,
     schema: []
diff --git a/lib/rules/valid-v-on.js b/lib/rules/valid-v-on.js
index 156e3669a..b9c4f9cac 100644
--- a/lib/rules/valid-v-on.js
+++ b/lib/rules/valid-v-on.js
@@ -63,8 +63,7 @@ module.exports = {
   meta: {
     docs: {
       description: 'enforce valid `v-on` directives',
-      category: 'Possible Errors',
-      recommended: true
+      category: 'essential'
     },
     fixable: false,
     schema: []
diff --git a/lib/rules/valid-v-once.js b/lib/rules/valid-v-once.js
index 522778c55..58fcc1308 100644
--- a/lib/rules/valid-v-once.js
+++ b/lib/rules/valid-v-once.js
@@ -58,8 +58,7 @@ module.exports = {
   meta: {
     docs: {
       description: 'enforce valid `v-once` directives',
-      category: 'Possible Errors',
-      recommended: true
+      category: 'essential'
     },
     fixable: false,
     schema: []
diff --git a/lib/rules/valid-v-pre.js b/lib/rules/valid-v-pre.js
index b15778257..713ef4325 100644
--- a/lib/rules/valid-v-pre.js
+++ b/lib/rules/valid-v-pre.js
@@ -58,8 +58,7 @@ module.exports = {
   meta: {
     docs: {
       description: 'enforce valid `v-pre` directives',
-      category: 'Possible Errors',
-      recommended: true
+      category: 'essential'
     },
     fixable: false,
     schema: []
diff --git a/lib/rules/valid-v-show.js b/lib/rules/valid-v-show.js
index e8ecce1c2..0ad65937a 100644
--- a/lib/rules/valid-v-show.js
+++ b/lib/rules/valid-v-show.js
@@ -58,8 +58,7 @@ module.exports = {
   meta: {
     docs: {
       description: 'enforce valid `v-show` directives',
-      category: 'Possible Errors',
-      recommended: true
+      category: 'essential'
     },
     fixable: false,
     schema: []
diff --git a/lib/rules/valid-v-text.js b/lib/rules/valid-v-text.js
index d319b7019..7c193d828 100644
--- a/lib/rules/valid-v-text.js
+++ b/lib/rules/valid-v-text.js
@@ -58,8 +58,7 @@ module.exports = {
   meta: {
     docs: {
       description: 'enforce valid `v-text` directives',
-      category: 'Possible Errors',
-      recommended: true
+      category: 'essential'
     },
     fixable: false,
     schema: []
diff --git a/lib/strongly-recommended-rules.js b/lib/strongly-recommended-rules.js
new file mode 100644
index 000000000..881814f61
--- /dev/null
+++ b/lib/strongly-recommended-rules.js
@@ -0,0 +1,49 @@
+/*
+* IMPORTANT!
+* This file has been automatically generated,
+* in order to update it's content execute "npm run update"
+*/
+module.exports = {
+  "vue/attribute-hyphenation": "error",
+  "vue/html-end-tags": "error",
+  "vue/html-indent": "error",
+  "vue/html-self-closing": "error",
+  "vue/jsx-uses-vars": "error",
+  "vue/max-attributes-per-line": "error",
+  "vue/mustache-interpolation-spacing": "error",
+  "vue/name-property-casing": "error",
+  "vue/no-async-in-computed-properties": "error",
+  "vue/no-dupe-keys": "error",
+  "vue/no-duplicate-attributes": "error",
+  "vue/no-multi-spaces": "error",
+  "vue/no-parsing-error": "error",
+  "vue/no-reserved-keys": "error",
+  "vue/no-shared-component-data": "error",
+  "vue/no-side-effects-in-computed-properties": "error",
+  "vue/no-template-key": "error",
+  "vue/no-textarea-mustache": "error",
+  "vue/no-unused-vars": "error",
+  "vue/require-component-is": "error",
+  "vue/require-default-prop": "error",
+  "vue/require-prop-types": "error",
+  "vue/require-render-return": "error",
+  "vue/require-v-for-key": "error",
+  "vue/require-valid-default-prop": "error",
+  "vue/return-in-computed-property": "error",
+  "vue/v-bind-style": "error",
+  "vue/v-on-style": "error",
+  "vue/valid-template-root": "error",
+  "vue/valid-v-bind": "error",
+  "vue/valid-v-cloak": "error",
+  "vue/valid-v-else-if": "error",
+  "vue/valid-v-else": "error",
+  "vue/valid-v-for": "error",
+  "vue/valid-v-html": "error",
+  "vue/valid-v-if": "error",
+  "vue/valid-v-model": "error",
+  "vue/valid-v-on": "error",
+  "vue/valid-v-once": "error",
+  "vue/valid-v-pre": "error",
+  "vue/valid-v-show": "error",
+  "vue/valid-v-text": "error"
+}
\ No newline at end of file
diff --git a/tools/update-rules.js b/tools/update-rules.js
index d76072285..6e23d01de 100644
--- a/tools/update-rules.js
+++ b/tools/update-rules.js
@@ -18,11 +18,9 @@ const path = require('path')
 
 const root = path.resolve(__dirname, '../lib/rules')
 const readmeFile = path.resolve(__dirname, '../README.md')
-const recommendedRulesFile = path.resolve(__dirname, '../lib/recommended-rules.js')
 const tablePlaceholder = /<!--RULES_TABLE_START-->[\s\S]*<!--RULES_TABLE_END-->/
 const readmeContent = fs.readFileSync(readmeFile, 'utf8')
 
-const STAR = ':white_check_mark:'
 const PEN = ':wrench:'
 const WARN = ':warning:'
 
@@ -34,17 +32,51 @@ const rules = fs.readdirSync(root)
     require(path.join(root, fileName))
   ])
 
-const categories = rules
-  .map(entry => entry[1].meta.docs.category)
-  .reduce((arr, category) => {
-    if (!arr.includes(category)) {
-      arr.push(category)
-    }
-    return arr
-  }, ['Possible Errors', 'Best Practices', 'Stylistic Issues'])
+// In order of priority
+const categories = [
+  'base',
+  'essential',
+  'strongly-recommended',
+  'recommended'
+// Only include categories with existing rules
+].filter(category =>
+  rules.some(entry =>
+    !entry[1].meta.deprecated &&
+    entry[1].meta.docs.category === category
+  )
+)
+
+// Throw if an invalid category has been used
+for (const entry of rules) {
+  const category = entry[1].meta.docs.category
+  if (!categories.includes(category)) {
+    throw new Error(`Rule category ${category} from ${entry[0]} is invalid`)
+  }
+}
+
+const categoryTitles = {
+  base: 'Base Rules (Enabling Correct ESLint Parsing)',
+  essential: 'Priority A: Essential (Error Prevention)',
+  'strongly-recommended': 'Priority B: Strongly Recommended (Improving Readability)',
+  recommended: 'Priority C: Recommended (Minimizing Arbitrary Choices and Cognitive Overhead)',
+  'use-with-caution': 'Priority D: Use with Caution (Potentially Dangerous Patterns)'
+}
+
+// Throw if no title is defined for a category
+for (const category of categories) {
+  if (!categoryTitles[category]) {
+    throw new Error(`Category "${category}" does not have a title defined.`)
+  }
+}
 
 const rulesTableContent = categories.map(category => `
-### ${category}
+### ${categoryTitles[category]}
+
+Enforce all the rules in this category, as well as all higher priority rules, with:
+
+\`\`\` json
+"extends": "plugin:vue/${category}"
+\`\`\`
 
 |    | Rule ID | Description |
 |:---|:--------|:------------|
@@ -54,7 +86,7 @@ ${
     .map(entry => {
       const name = entry[0]
       const meta = entry[1].meta
-      const mark = `${meta.docs.recommended ? STAR : ''}${meta.fixable ? PEN : ''}${meta.deprecated ? WARN : ''}`
+      const mark = `${meta.fixable ? PEN : ''}${meta.deprecated ? WARN : ''}`
       const link = `[${name}](./docs/rules/${name}.md)`
       const description = meta.docs.description || '(no description)'
       return `| ${mark} | ${link} | ${description} |`
@@ -83,60 +115,63 @@ ${
 }
 `
 
-const recommendedRules = rules.reduce((obj, entry) => {
-  const name = `vue/${entry[0]}`
-  const recommended = entry[1].meta.docs.recommended
-  const status = recommended
-    ? recommended === true
-      ? 'error'
-      : recommended
-    : 'off'
-  obj[name] = status
-  return obj
-}, {})
-
-const recommendedRulesContent = `/*
- * IMPORTANT!
- * This file has been automatically generated,
- * in order to update its content execute "npm run update"
- */
-module.exports = ${JSON.stringify(recommendedRules, null, 2)}`
+categories.forEach((category, categoryIndex) => {
+  createRulesFile(category, categories.slice(0, categoryIndex + 1))
+})
+
+function createRulesFile (rulesGroupName, categories) {
+  const enabledRules = rules.filter(entry =>
+    !entry[1].meta.deprecated &&
+    categories.includes(entry[1].meta.docs.category)
+  ).reduce((obj, entry) => {
+    obj[`vue/${entry[0]}`] = 'error'
+    return obj
+  }, {})
+
+  const enabledRulesContent = `/*
+* IMPORTANT!
+* This file has been automatically generated,
+* in order to update it's content execute "npm run update"
+*/
+module.exports = ${JSON.stringify(enabledRules, null, 2)}`
 
-fs.writeFileSync(
-  readmeFile,
-  readmeContent.replace(
-    tablePlaceholder,
-    `<!--RULES_TABLE_START-->\n${rulesTableContent}\n<!--RULES_TABLE_END-->`
+  fs.writeFileSync(
+    readmeFile,
+    readmeContent.replace(
+      tablePlaceholder,
+      `<!--RULES_TABLE_START-->\n${rulesTableContent}\n<!--RULES_TABLE_END-->`
+    )
   )
-)
 
-fs.writeFileSync(
-  recommendedRulesFile,
-  recommendedRulesContent
-)
+  const enabledRulesFile = path.resolve(__dirname, `../lib/${rulesGroupName}-rules.js`)
+
+  fs.writeFileSync(
+    enabledRulesFile,
+    enabledRulesContent
+  )
+}
 
 /*
- * The pattern to match document header.
- * The header is one title line and zero or more unordered list items.
- * E.g.
- *
- * # description
- * - a note. (there are 3 kinds of notes: recommended, deprecated, and autofixable)
- * - another note.
- *
- */
+  * The pattern to match document header.
+  * The header is one title line and zero or more unordered list items.
+  * E.g.
+  *
+  * # description
+  * - a note. (there are 3 kinds of notes: recommended, deprecated, and autofixable)
+  * - another note.
+  *
+  */
 const headerPattern = /^#[^\n]*\n+(?:- .+\n)*\n*/
 
 // Update the header of rule documents.
 const docsRoot = path.resolve(__dirname, '../docs/rules')
-for (const rule of rules) {
-  const ruleId = rule[0]
-  const meta = rule[1].meta
+for (const entry of rules) {
+  const ruleId = entry[0]
+  const meta = entry[1].meta
   const filePath = path.join(docsRoot, `${ruleId}.md`)
-  const recommended = meta.docs.recommended ? `- ${STAR} The \`"extends": "plugin:vue/recommended"\` property in a configuration file enables this rule.\n` : ''
   const deprecated = meta.deprecated ? `- ${WARN} This rule was **deprecated** and replaced by ${meta.docs.replacedBy.map(id => `[${id}](${id}.md) rule`).join(', ')}.\n` : ''
   const autofix = meta.fixable ? `- ${PEN} The \`--fix\` option on the [command line](http://eslint.org/docs/user-guide/command-line-interface#fix) can automatically fix some of the problems reported by this rule.\n` : ''
-  const header = `# ${meta.docs.description} (${ruleId})\n${recommended || deprecated || autofix ? '\n' : ''}${recommended}${deprecated}${autofix}\n`
+  const header = `# ${meta.docs.description} (${ruleId})\n${deprecated || autofix ? '\n' : ''}${deprecated}${autofix}\n`
 
   fs.writeFileSync(
     filePath,

From 8b90b4a306db6ed62c7458059d8470ca533157e3 Mon Sep 17 00:00:00 2001
From: Chris Fritz <chrisvfritz@gmail.com>
Date: Sun, 8 Oct 2017 18:47:14 -0400
Subject: [PATCH 03/10] ignore all rules files in .eslintignore

---
 .eslintignore | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/.eslintignore b/.eslintignore
index 9bb8b51c8..e0072d13e 100644
--- a/.eslintignore
+++ b/.eslintignore
@@ -1,4 +1,4 @@
 node_modules
-lib/recommended-rules.js
+lib/*-rules.js
 coverage
 .nyc_output

From e419479bb838c520ae8ab39c4cdff942ed8f306d Mon Sep 17 00:00:00 2001
From: Chris Fritz <chrisvfritz@gmail.com>
Date: Sun, 8 Oct 2017 19:16:22 -0400
Subject: [PATCH 04/10] fix tests to match style guide recommendations

---
 tests/lib/rules/html-self-closing.js       |  8 +++---
 tests/lib/rules/max-attributes-per-line.js | 30 ++++++++++++++--------
 tests/lib/rules/order-in-components.js     | 17 +++---------
 3 files changed, 27 insertions(+), 28 deletions(-)

diff --git a/tests/lib/rules/html-self-closing.js b/tests/lib/rules/html-self-closing.js
index 49ee3c43f..3623745c6 100644
--- a/tests/lib/rules/html-self-closing.js
+++ b/tests/lib/rules/html-self-closing.js
@@ -54,7 +54,7 @@ const anyWith = (opts) => Object.assign(
 tester.run('html-self-closing', rule, {
   valid: [
     // default
-    '<template><div></div></template>',
+    '<template><div/></template>',
     '<template><img></template>',
     '<template><x-test/></template>',
     '<template><svg><path/></svg></template>',
@@ -72,9 +72,9 @@ tester.run('html-self-closing', rule, {
   invalid: [
     // default
     {
-      code: '<template><div/></template>',
-      output: '<template><div></div></template>',
-      errors: ['Disallow self-closing on HTML elements (<div/>).']
+      code: '<template><div></div></template>',
+      output: '<template><div/></template>',
+      errors: ['Require self-closing on HTML elements (<div>).']
     },
     {
       code: '<template><img/></template>',
diff --git a/tests/lib/rules/max-attributes-per-line.js b/tests/lib/rules/max-attributes-per-line.js
index 07d24197c..773f1b661 100644
--- a/tests/lib/rules/max-attributes-per-line.js
+++ b/tests/lib/rules/max-attributes-per-line.js
@@ -26,24 +26,32 @@ ruleTester.run('max-attributes-per-line', rule, {
       code: `<template><component></component></template>`
     },
     {
-      code: `<template><component name="John Doe" age="30" job="Vet"></component></template>`
+      code: `<template><component
+        name="John Doe"
+        age="30"
+        job="Vet"
+      ></component></template>`
     },
     {
-      code: `<template><component name="John Doe" age="30" job="Vet"></component></template>`,
+      code: `<template><component
+        name="John Doe"
+        age="30"
+        job="Vet"
+      ></component></template>`,
       options: [{ multiline: { allowFirstLine: true }}]
     },
     {
       code: `<template><component
         name="John Doe"
-        age="30">
-        </component>
-      </template>`
+        age="30"
+      >
+      </component></template>`
     },
     {
       code: `<template><component
         name="John Doe"
         age="30">
-        </component>
+      </component>
       </template>`,
       options: [{ singleline: 1 }]
     },
@@ -82,8 +90,8 @@ ruleTester.run('max-attributes-per-line', rule, {
 
   invalid: [
     {
-      code: `<template><component name="John Doe" age="30" job="Vet" petname="Snoopy"></component></template>`,
-      errors: ['Attribute "petname" should be on a new line.']
+      code: `<template><component name="John Doe" age="30"></component></template>`,
+      errors: ['Attribute "age" should be on a new line.']
     },
     {
       code: `<template><component job="Vet"
@@ -98,10 +106,10 @@ ruleTester.run('max-attributes-per-line', rule, {
       }]
     },
     {
-      code: `<template><component name="John Doe" age="30"></component></template>`,
-      options: [{ singleline: { max: 1 }}],
+      code: `<template><component name="John Doe" age="30" job="Vet"></component></template>`,
+      options: [{ singleline: { max: 2 }}],
       errors: [{
-        message: 'Attribute "age" should be on a new line.',
+        message: 'Attribute "job" should be on a new line.',
         type: 'VAttribute',
         line: 1
       }]
diff --git a/tests/lib/rules/order-in-components.js b/tests/lib/rules/order-in-components.js
index 4886e88bf..485015411 100644
--- a/tests/lib/rules/order-in-components.js
+++ b/tests/lib/rules/order-in-components.js
@@ -106,9 +106,9 @@ ruleTester.run('order-in-components', rule, {
       filename: 'test.js',
       code: `
         new Vue({
+          el: '#app',
           name: 'app',
           components: {},
-          el: '#app',
           data () {
             return {
               msg: 'Welcome to Your Vue.js App'
@@ -199,9 +199,6 @@ ruleTester.run('order-in-components', rule, {
       errors: [{
         message: 'The "components" property should be above the "data" property on line 4.',
         line: 9
-      }, {
-        message: 'The "template" property should be above the "data" property on line 4.',
-        line: 10
       }]
     },
     {
@@ -223,17 +220,14 @@ ruleTester.run('order-in-components', rule, {
       errors: [{
         message: 'The "components" property should be above the "data" property on line 5.',
         line: 10
-      }, {
-        message: 'The "template" property should be above the "data" property on line 5.',
-        line: 11
       }]
     },
     {
       filename: 'test.js',
       code: `
         new Vue({
-          el: '#app',
           name: 'app',
+          el: '#app',
           data () {
             return {
               msg: 'Welcome to Your Vue.js App'
@@ -245,14 +239,11 @@ ruleTester.run('order-in-components', rule, {
       `,
       parserOptions: { ecmaVersion: 6 },
       errors: [{
-        message: 'The "name" property should be above the "el" property on line 3.',
+        message: 'The "el" property should be above the "name" property on line 3.',
         line: 4
       }, {
-        message: 'The "components" property should be above the "el" property on line 3.',
+        message: 'The "components" property should be above the "data" property on line 5.',
         line: 10
-      }, {
-        message: 'The "template" property should be above the "data" property on line 5.',
-        line: 11
       }]
     },
     {

From 978ddd376476197d041f82cffcedba65e72f28ef Mon Sep 17 00:00:00 2001
From: Chris Fritz <chrisvfritz@gmail.com>
Date: Sun, 8 Oct 2017 23:22:24 -0400
Subject: [PATCH 05/10] update documentation examples to match style guide

---
 docs/rules/attribute-hyphenation.md           | 24 +-----
 docs/rules/html-end-tags.md                   | 29 +++----
 docs/rules/html-quotes.md                     | 28 ++----
 docs/rules/html-self-closing.md               | 49 +++++------
 docs/rules/jsx-uses-vars.md                   |  4 +-
 docs/rules/max-attributes-per-line.md         | 79 +++++++++--------
 docs/rules/mustache-interpolation-spacing.md  | 34 +++-----
 docs/rules/name-property-casing.md            | 12 +--
 docs/rules/no-async-in-computed-properties.md | 59 ++++++-------
 docs/rules/no-confusing-v-for-v-if.md         | 37 ++++----
 docs/rules/no-dupe-keys.md                    | 26 +++---
 docs/rules/no-duplicate-attributes.md         | 19 ++--
 docs/rules/no-invalid-template-root.md        | 50 +++++++++--
 docs/rules/no-invalid-v-bind.md               | 22 ++---
 docs/rules/no-invalid-v-cloak.md              | 16 +---
 docs/rules/no-invalid-v-else-if.md            | 18 ++--
 docs/rules/no-invalid-v-else.md               | 18 ++--
 docs/rules/no-invalid-v-for.md                | 41 +++++----
 docs/rules/no-invalid-v-html.md               | 16 +---
 docs/rules/no-invalid-v-if.md                 | 30 +++----
 docs/rules/no-invalid-v-model.md              | 38 ++++----
 docs/rules/no-invalid-v-on.md                 | 26 +++---
 docs/rules/no-multi-spaces.md                 | 16 ++--
 docs/rules/no-parsing-error.md                | 86 +++++++++----------
 docs/rules/no-reserved-keys.md                | 24 +++---
 docs/rules/no-shared-component-data.md        | 18 ++++
 .../no-side-effects-in-computed-properties.md | 34 +++-----
 docs/rules/no-template-key.md                 | 18 ++--
 docs/rules/no-textarea-mustache.md            |  8 +-
 docs/rules/order-in-components.md             | 85 +++++++-----------
 docs/rules/require-component-is.md            | 10 +--
 docs/rules/require-default-prop.md            | 48 +++++------
 docs/rules/require-prop-types.md              | 25 +++---
 docs/rules/require-render-return.md           |  8 +-
 docs/rules/require-v-for-key.md               | 15 ++--
 docs/rules/require-valid-default-prop.md      | 78 ++++++++---------
 docs/rules/return-in-computed-property.md     |  6 +-
 docs/rules/this-in-template.md                | 56 ++++++------
 docs/rules/v-bind-style.md                    | 24 +-----
 docs/rules/v-on-style.md                      | 24 +-----
 docs/rules/valid-template-root.md             | 52 +++++++++--
 docs/rules/valid-v-bind.md                    | 24 ++----
 docs/rules/valid-v-cloak.md                   | 18 ++--
 docs/rules/valid-v-else-if.md                 | 18 ++--
 docs/rules/valid-v-else.md                    | 18 ++--
 docs/rules/valid-v-for.md                     | 41 +++++----
 docs/rules/valid-v-html.md                    | 16 +---
 docs/rules/valid-v-if.md                      | 32 +++----
 docs/rules/valid-v-model.md                   | 38 ++++----
 docs/rules/valid-v-on.md                      | 28 +++---
 docs/rules/valid-v-once.md                    | 16 +---
 docs/rules/valid-v-pre.md                     | 16 +---
 docs/rules/valid-v-show.md                    | 16 +---
 docs/rules/valid-v-text.md                    | 16 +---
 lib/rules/name-property-casing.js             |  5 +-
 lib/utils/casing.js                           |  6 +-
 tests/lib/rules/name-property-casing.js       | 27 +++---
 tests/lib/rules/no-invalid-v-on.js            | 13 +++
 58 files changed, 720 insertions(+), 938 deletions(-)

diff --git a/docs/rules/attribute-hyphenation.md b/docs/rules/attribute-hyphenation.md
index 0028c2a58..7decbecec 100644
--- a/docs/rules/attribute-hyphenation.md
+++ b/docs/rules/attribute-hyphenation.md
@@ -15,21 +15,13 @@ Default casing is set to `always`
 :+1: Examples of **correct** code`:
 
 ```html
-<template>
-  <foo my-prop="prop">
-    <a onClick="return false"></a>
-  </foo>
-</template>
+<MyComponent my-prop="prop"/>
 ```
 
 :-1: Examples of **incorrect** code`:
 
 ```html
-<template>
-  <foo myProp="prop">
-    <a onClick="return false"></a>
-  </foo>
-</template>
+<MyComponent myProp="prop"/>
 ```
 
 ### `"never"` - Don't use hyphenated name. (It errors on hyphens except `data-` and `aria-`.)
@@ -37,19 +29,11 @@ Default casing is set to `always`
 :+1: Examples of **correct** code`:
 
 ```html
-<template>
-  <foo myProp="prop">
-    <a onClick="return false"></a>
-  </foo>
-</template>
+<MyComponent myProp="prop"/>
 ```
 
 :-1: Examples of **incorrect** code`:
 
 ```html
-<template>
-  <foo my-prop="prop">
-    <a onClick="return false"></a>
-  </foo>
-</template>
+<MyComponent my-prop="prop"/>
 ```
diff --git a/docs/rules/html-end-tags.md b/docs/rules/html-end-tags.md
index 51acebeda..9ecd4d7e0 100644
--- a/docs/rules/html-end-tags.md
+++ b/docs/rules/html-end-tags.md
@@ -17,30 +17,21 @@ This rule reports the following elements:
 :-1: Examples of **incorrect** code for this rule:
 
 ```html
-<template>
-    <div>
-        <div>
-        <p>
-        <p>
-        <input></input>
-        <br></br>
-    </div>
-</template>
+<div>
+<p>
+<p>
+<input></input>
+<br></br>
 ```
 
 :+1: Examples of **correct** code for this rule:
 
 ```html
-<template>
-    <div>
-        <div></div>
-        <p></p>
-        <p></p>
-        <div />
-        <input>
-        <br>
-    </div>
-</template>
+<div></div>
+<p></p>
+<p></p>
+<input>
+<br>
 ```
 
 ## :wrench: Options
diff --git a/docs/rules/html-quotes.md b/docs/rules/html-quotes.md
index 89603e594..be81eca85 100644
--- a/docs/rules/html-quotes.md
+++ b/docs/rules/html-quotes.md
@@ -15,43 +15,27 @@ This rule reports the quotes of attributes if it is different to configured quot
 :-1: Examples of **incorrect** code for this rule:
 
 ```html
-<template>
-    <div>
-        <img src='./logo.png'>
-        <img src=./logo.png>
-    </div>
-</template>
+<img src='./logo.png'>
+<img src=./logo.png>
 ```
 
 :+1: Examples of **correct** code for this rule:
 
 ```html
-<template>
-    <div>
-        <img src="./logo.png">
-    </div>
-</template>
+<img src="./logo.png">
 ```
 
 :-1: Examples of **incorrect** code for this rule with `"single"` option:
 
 ```html
-<template>
-    <div>
-        <img src="./logo.png">
-        <img src=./logo.png>
-    </div>
-</template>
+<img src="./logo.png">
+<img src=./logo.png>
 ```
 
 :+1: Examples of **correct** code for this rule with `"single"` option:
 
 ```html
-<template>
-    <div>
-        <img src='./logo.png'>
-    </div>
-</template>
+<img src='./logo.png'>
 ```
 
 ## :wrench: Options
diff --git a/docs/rules/html-self-closing.md b/docs/rules/html-self-closing.md
index 760ebb0b1..00fb7b345 100644
--- a/docs/rules/html-self-closing.md
+++ b/docs/rules/html-self-closing.md
@@ -4,8 +4,8 @@
 
 In Vue.js template, we can use either two styles for elements which don't have their content.
 
-1. `<your-component></your-component>`
-2. `<your-component />` (self-closing)
+1. `<YourComponent></YourComponent>`
+2. `<YourComponent/>` (self-closing)
 
 Self-closing is simple and shorter, but it's not supported in raw HTML.
 This rule helps you to unify the self-closing style.
@@ -16,20 +16,20 @@ This rule has options which specify self-closing style for each context.
 
 ```json
 {
-    "html-self-closing": [2, {
-        "html": {
-            "normal": "never",
-            "void": "never",
-            "component": "always"
-        },
-        "svg": "always",
-        "math": "always"
-    }]
+  "html-self-closing": ["error", {
+    "html": {
+      "void": "never",
+      "normal": "always",
+      "component": "always"
+    },
+    "svg": "always",
+    "math": "always"
+  }]
 }
 ```
 
-- `html.normal` (`"never"` by default) ... The style of well-known HTML elements except void elements.
 - `html.void` (`"never"` by default) ... The style of well-known HTML void elements.
+- `html.normal` (`"always"` by default) ... The style of well-known HTML elements except void elements.
 - `html.component` (`"always"` by default) ... The style of Vue.js custom components.
 - `svg`(`"always"` by default) .... The style of well-known SVG elements.
 - `math`(`"always"` by default) .... The style of well-known MathML elements.
@@ -45,25 +45,18 @@ Every option can be set to one of the following values:
 :-1: Examples of **incorrect** code for this rule:
 
 ```html
-/*eslint html-self-closing: "error"*/
-
-<template>
-    <div />
-    <img />
-    <your-component></your-component>
-    <svg><path d=""></path></svg>
-</template>
+<div></div>
+<img/>
+<img></img>
+<MyComponent/></MyComponent>
+<svg><path d=""></path></svg>
 ```
 
 :+1: Examples of **correct** code for this rule:
 
 ```html
-/*eslint html-self-closing: "error"*/
-
-<template>
-    <div></div>
-    <img>
-    <your-component />
-    <svg><path d="" /></svg>
-</template>
+<div/>
+<img>
+<MyComponent/>
+<svg><path d=""/></svg>
 ```
diff --git a/docs/rules/jsx-uses-vars.md b/docs/rules/jsx-uses-vars.md
index af65b9f58..512f386d0 100644
--- a/docs/rules/jsx-uses-vars.md
+++ b/docs/rules/jsx-uses-vars.md
@@ -10,12 +10,12 @@ This rule only has an effect when the `no-unused-vars` rule is enabled.
 Without this rule this code triggers warning:
 
 ```js
-import Hello from './Hello';
+import HelloWorld from './HelloWorld';
 
 export default {
   render () {
     return (
-      <Hello msg="world"></Hello>
+      <HelloWorld msg="world"/>
     )
   },
 };
diff --git a/docs/rules/max-attributes-per-line.md b/docs/rules/max-attributes-per-line.md
index 8920a766b..827d297a9 100644
--- a/docs/rules/max-attributes-per-line.md
+++ b/docs/rules/max-attributes-per-line.md
@@ -14,30 +14,33 @@ There is a configurable number of attributes that are acceptable in one-line cas
 :-1: Examples of **incorrect** code for this rule:
 
 ```html
-<component lorem="1" ipsum="2" dolor="3" sit="4">
-</component>
+<MyComponent lorem="1" ipsum="2"/>
 
-<component
+<MyComponent
+  lorem="1" ipsum="2"
+/>
+
+<MyComponent
   lorem="1" ipsum="2"
   dolor="3"
-  sit="4"
->
-</component>
+/>
 ```
 
 :+1: Examples of **correct** code for this rule:
 
 ```html
-<component lorem="1" ipsum="2" dolor="3">
-</component>
+<MyComponent lorem="1"/>
+
+<MyComponent
+  lorem="1"
+  ipsum="2"
+/>
 
-<component
+<MyComponent
   lorem="1"
   ipsum="2"
   dolor="3"
-  sit="4"
->
-</component>
+/>
 ```
 
 ### :wrench:  Options
@@ -55,67 +58,67 @@ There is a configurable number of attributes that are acceptable in one-line cas
 ```
 
 #### `allowFirstLine`
+
 For multi-line declarations, defines if allows attributes to be put in the first line. (Default false)
 
 :-1: Example of **incorrect** code for this setting:
+
 ```html
-// [{ "multiline": { "allowFirstLine": false }}]
-<component foo="John" bar="Smith"
-  foobar={5555555}>
-</component>;
+<!-- [{ "multiline": { "allowFirstLine": false }}] -->
+<MyComponent foo="John"
+  bar="Smith"
+/>
 ```
 
 :+1: Example of **correct** code for this setting:
+
 ```html
-// [{ "multiline": { "allowFirstLine": false }}]
-<component
+<!-- [{ "multiline": { "allowFirstLine": false }}] -->
+<MyComponent
   foo="John"
   bar="Smith"
-  foobar={5555555}
-  >
-</component>;
+/>
 ```
 
-
 #### `singleline`
-Number of maximum attributes per line when the opening tag is in a single line. (Default is 3)
+
+Number of maximum attributes per line when the opening tag is in a single line. (Default is 1)
 
 :-1: Example of **incorrect** code for this setting:
 ```html
-// [{"singleline": 2,}]
-<component foo="John" bar="Smith" foobar={5555555}></component>;
+<!-- [{"singleline": 1}] -->
+<MyComponent foo="John" bar="Smith"/>
 ```
 
 :+1: Example of **correct** code for this setting:
 ```html
-// [{"singleline": 3,}]
-<component foo="John" bar="Smith" foobar={5555555}></component>;
+<!-- [{"singleline": 1}] -->
+<MyComponent foo="John"/>
 ```
 
-
 #### `multiline`
+
 Number of maximum attributes per line when a tag is in multiple lines. (Default is 1)
 
 :-1: Example of **incorrect** code for this setting:
+
 ```html
-// [{"multiline": 1}]
-<component foo="John" bar="Smith"
-  foobar={5555555}>
-</component>;
+<!-- [{"multiline": 1}] -->
+<MyComponent
+  foo="John" bar="Smith"
+/>
 ```
 
 :+1: Example of **correct** code for this setting:
+
 ```html
-// [{"multiline": 1}]
-<component
+<!-- [{"multiline": 1}] -->
+<MyComponent
   foo="John"
   bar="Smith"
-  foobar={5555555}
-  >
-</component>;
+/>
 ```
 
 ## When Not To Use It
 
 If you do not want to check the number of attributes declared per line you can disable this rule.
-
diff --git a/docs/rules/mustache-interpolation-spacing.md b/docs/rules/mustache-interpolation-spacing.md
index fcb385891..1ad2bdc57 100644
--- a/docs/rules/mustache-interpolation-spacing.md
+++ b/docs/rules/mustache-interpolation-spacing.md
@@ -9,17 +9,14 @@ This rule aims to enforce unified spacing in mustache interpolations.
 :-1: Examples of **incorrect** code for this rule:
 
 ```html
-<template>
-  <div>{{   text   }}</div>
-</template>
+<div>{{   text   }}</div>
+<div>{{text}}</div>
 ```
 
 :+1: Examples of **correct** code for this rule:
 
 ```html
-<template>
-  <div>{{ text }}</div>
-</template>
+<div>{{ text }}</div>
 ```
 
 ## :wrench: Options
@@ -32,36 +29,29 @@ Default spacing is set to `always`
 
 ### `"always"` - Expect one space between expression and curly brackets.
 
-:+1: Examples of **correct** code`:
+:-1: Examples of **incorrect** code for this rule:
 
 ```html
-<template>
-  <div>{{ text }}</div>
-</template>
+<div>{{   text   }}</div>
+<div>{{text}}</div>
 ```
 
-:-1: Examples of **incorrect** code`:
+:+1: Examples of **correct** code for this rule:
 
 ```html
-<template>
-  <div>{{text}}</div>
-</template>
+<div>{{ text }}</div>
 ```
 
 ### `"never"` - Expect no spaces between expression and curly brackets.
 
-:+1: Examples of **correct** code`:
+:-1: Examples of **incorrect** code for this rule:
 
 ```html
-<template>
-  <div>{{text}}</div>
-</template>
+<div>{{ text }}</div>
 ```
 
-:-1: Examples of **incorrect** code`:
+:+1: Examples of **correct** code for this rule:
 
 ```html
-<template>
-  <div>{{ text }}</div>
-</template>
+<div>{{text}}</div>
 ```
diff --git a/docs/rules/name-property-casing.md b/docs/rules/name-property-casing.md
index 648935b58..1d0e25982 100644
--- a/docs/rules/name-property-casing.md
+++ b/docs/rules/name-property-casing.md
@@ -22,18 +22,10 @@ export default {
 }
 ```
 
-:+1: Examples of **correct** code for `camelCase`:
-
-```js
-export default {
-  name: 'myComponent'
-}
-```
-
 ## :wrench: Options
 
-Default casing is set to `PascalCase`
+Default casing is set to `PascalCase`.
 
 ```
-'vue/name-property-casing': [2, 'camelCase|kebab-case|PascalCase']
+"vue/name-property-casing": ["error", "PascalCase|kebab-case"]
 ```
diff --git a/docs/rules/no-async-in-computed-properties.md b/docs/rules/no-async-in-computed-properties.md
index 4fd8790a3..a4b32c5f0 100644
--- a/docs/rules/no-async-in-computed-properties.md
+++ b/docs/rules/no-async-in-computed-properties.md
@@ -10,26 +10,24 @@ This rule is aimed at preventing asynchronous methods from being called in compu
 :-1: Examples of **incorrect** code for this rule:
 
 ```js
-export default {
-  computed: {
-    pro () {
-      return Promise.all([new Promise((resolve, reject) => {})])
-    },
-    foo: async function () {
-      return await someFunc()
-    },
-    bar () {
-      return fetch(url).then(response => {})
-    },
-    tim () {
-      setTimeout(() => { }, 0)
-    },
-    inter () {
-      setInterval(() => { }, 0)
-    },
-    anim () {
-      requestAnimationFrame(() => {})
-    }
+computed: {
+  pro () {
+    return Promise.all([new Promise((resolve, reject) => {})])
+  },
+  foo: async function () {
+    return await someFunc()
+  },
+  bar () {
+    return fetch(url).then(response => {})
+  },
+  tim () {
+    setTimeout(() => { }, 0)
+  },
+  inter () {
+    setInterval(() => { }, 0)
+  },
+  anim () {
+    requestAnimationFrame(() => {})
   }
 }
 ```
@@ -37,17 +35,15 @@ export default {
 :+1: Examples of **correct** code for this rule:
 
 ```js
-export default {
-  computed: {
-    foo () {
-      var bar = 0
-      try {
-        bar = bar / this.a
-      } catch (e) {
-        return 0
-      } finally {
-        return bar
-      }
+computed: {
+  foo () {
+    var bar = 0
+    try {
+      bar = bar / this.a
+    } catch (e) {
+      return 0
+    } finally {
+      return bar
     }
   }
 }
@@ -57,4 +53,5 @@ export default {
 
 Nothing.
 
+
 [vue-async-computed]: https://github.com/foxbenjaminfox/vue-async-computed
diff --git a/docs/rules/no-confusing-v-for-v-if.md b/docs/rules/no-confusing-v-for-v-if.md
index ed730ebd9..55ab658ef 100644
--- a/docs/rules/no-confusing-v-for-v-if.md
+++ b/docs/rules/no-confusing-v-for-v-if.md
@@ -17,35 +17,30 @@ In that case, the `v-if` should be written on the wrapper element.
 :-1: Examples of **incorrect** code for this rule:
 
 ```html
-<template>
-    <div>
-        <ol>
-            <li v-if="shown" v-for="item in items">{{item.message}}</li>
-        </ol>
-    </div>
-</template>
+<TodoItem
+  v-if="complete"
+  v-for="todo in todos"
+  :todo="todo"
+/>
 ```
 
 :+1: Examples of **correct** code for this rule:
 
 ```html
-<template>
-    <div>
-        <ol>
-            <li v-for="item in items" v-if="item.shown">{{item.message}}</li>
-        </ol>
-    </div>
-</template>
+<TodoItem
+  v-for="todo in todos"
+  v-if="todo.shown"
+  :todo="todo"
+/>
 ```
 
 ```html
-<template>
-    <div>
-        <ol v-if="shown">
-            <li v-for="item in items">{{item.message}}</li>
-        </ol>
-    </div>
-</template>
+<ul v-if="shown">
+  <TodoItem
+    v-for="todo in todos"
+    :todo="todo"
+  />
+</ul>
 ```
 
 ## :wrench: Options
diff --git a/docs/rules/no-dupe-keys.md b/docs/rules/no-dupe-keys.md
index 6f3bb547a..e2d839ebf 100644
--- a/docs/rules/no-dupe-keys.md
+++ b/docs/rules/no-dupe-keys.md
@@ -15,16 +15,14 @@ export default {
   },
   computed: {
     foo: {
-      get () {
-      }
+      get () {}
     }
   },
   data: {
     foo: null
   },
   methods: {
-    foo () {
-    }
+    foo () {}
   }
 }
 ```
@@ -35,17 +33,15 @@ export default {
 export default {
   props: ['foo'],
   computed: {
-    bar () {
-    }
+    bar () {}
   },
   data () {
     return {
-      dat: null
+      baz: null
     }
   },
   methods: {
-    test () {
-    }
+    boo () {}
   }
 }
 ```
@@ -58,12 +54,10 @@ This rule has an object option:
 
 ### Example:
 
-```json
-{
-  "vue/no-dupe-keys": [2, {
-    "groups": ["asyncComputed"]
-  }]
-}
+``` json
+"vue/no-dupe-keys": [2, {
+  groups: ["firebase"]
+}]
 ```
 
 :-1: Examples of **incorrect** code for this configuration
@@ -73,7 +67,7 @@ export default {
   computed: {
     foo () {}
   },
-  asyncComputed: {
+  firebase: {
     foo () {}
   }
 }
diff --git a/docs/rules/no-duplicate-attributes.md b/docs/rules/no-duplicate-attributes.md
index 3b4f7ae13..989bbe7af 100644
--- a/docs/rules/no-duplicate-attributes.md
+++ b/docs/rules/no-duplicate-attributes.md
@@ -11,18 +11,20 @@ This rule reports duplicate attributes.
 :-1: Examples of **incorrect** code for this rule:
 
 ```html
-<template>
-    <div foo="abc" :foo="def"></div>
-</template>
+<MyComponent
+  :foo="def"
+  foo="abc"
+/>
 ```
 
 :+1: Examples of **correct** code for this rule:
 
 ```html
-<template>
-    <div foo="abc"></div>
-    <div :foo="def"></div>
-</template>
+<MyComponent :foo="abc"/>
+```
+
+```html
+<MyComponent foo="abc"/>
 ```
 
 ## :wrench: Options
@@ -33,7 +35,7 @@ This rule reports duplicate attributes.
 ```
 'vue/no-duplicate-attributes': [2, {
   allowCoexistClass: Boolean // default: true
-  allowCoexistStyle: Boolean, // default: false
+  allowCoexistStyle: Boolean, // default: true
 }]
 ```
 
@@ -42,5 +44,6 @@ This rule reports duplicate attributes.
 `parse5` remove duplicate attributes on the tokenization phase.
 Needs investigation to check.
 
+
 [`v-bind:class`]: https://vuejs.org/v2/guide/class-and-style.html
 [`v-bind:style`]: https://vuejs.org/v2/guide/class-and-style.html
diff --git a/docs/rules/no-invalid-template-root.md b/docs/rules/no-invalid-template-root.md
index d154097ea..1e6bf84d5 100644
--- a/docs/rules/no-invalid-template-root.md
+++ b/docs/rules/no-invalid-template-root.md
@@ -16,48 +16,82 @@ This rule reports the template root in the following cases:
 
 :-1: Examples of **incorrect** code for this rule:
 
+```js
+template: ''
+```
+
 ```html
 <template>
 </template>
 ```
 
+```js
+template: `
+  <div>hello</div>
+  <div>hello</div>
+`
+```
+
 ```html
 <template>
-    <div>hello</div>
-    <div>hello</div>
+  <div>hello</div>
+  <div>hello</div>
 </template>
 ```
 
+```js
+template: 'abc'
+```
+
 ```html
 <template>
-    abc
+  abc
 </template>
 ```
 
+```js
+template: '<div v-for="item in items"/>'
+```
+
 ```html
 <template>
-    <div v-for="x in list"></div>
+  <div v-for="item in items"/>
 </template>
 ```
 
 :+1: Examples of **correct** code for this rule:
 
+```js
+template: '<div>abc</div>'
+```
+
 ```html
 <template>
-    <div>abc</div>
+  <div>abc</div>
 </template>
 ```
 
+```js
+template: '<div v-if="foo">abc</div>'
+```
+
 ```html
 <template>
-    <div v-if="foo"></div>
+  <div v-if="foo">abc</div>
 </template>
 ```
 
+```js
+template: `
+  <div v-if="foo">abc</div>
+  <div v-else>def</div>
+`
+```
+
 ```html
 <template>
-    <div v-if="foo">abc</div>
-    <div v-else>def</div>
+  <div v-if="foo">abc</div>
+  <div v-else>def</div>
 </template>
 ```
 
diff --git a/docs/rules/no-invalid-v-bind.md b/docs/rules/no-invalid-v-bind.md
index c820e14fe..4908424fa 100644
--- a/docs/rules/no-invalid-v-bind.md
+++ b/docs/rules/no-invalid-v-bind.md
@@ -18,26 +18,18 @@ This rule does not check syntax errors in directives because it's checked by [no
 :-1: Examples of **incorrect** code for this rule:
 
 ```html
-<template>
-    <div>
-        <div v-bind></div>
-        <div :aaa></div>
-        <div v-bind:aaa.bbb="foo"></div>
-    </div>
-</template>
+<div v-bind/>
+<div :aaa/>
+<div v-bind:aaa.bbb="foo"/>
 ```
 
 :+1: Examples of **correct** code for this rule:
 
 ```html
-<template>
-    <div>
-        <div v-bind="foo"></div>
-        <div v-bind:aaa="foo"></div>
-        <div :aaa="foo"></div>
-        <div :aaa.prop="foo"></div>
-    </div>
-</template>
+<div v-bind="foo"/>
+<div v-bind:aaa="foo"/>
+<div :aaa="foo"/>
+<div :aaa.prop="foo"/>
 ```
 
 ## :wrench: Options
diff --git a/docs/rules/no-invalid-v-cloak.md b/docs/rules/no-invalid-v-cloak.md
index 931b8eeec..3f5dc8134 100644
--- a/docs/rules/no-invalid-v-cloak.md
+++ b/docs/rules/no-invalid-v-cloak.md
@@ -15,23 +15,15 @@ This rule reports `v-cloak` directives in the following cases:
 :-1: Examples of **incorrect** code for this rule:
 
 ```html
-<template>
-    <div>
-        <div v-cloak:aaa></div>
-        <div v-cloak.bbb></div>
-        <div v-cloak="ccc"></div>
-    </div>
-</template>
+<div v-cloak:aaa/>
+<div v-cloak.bbb/>
+<div v-cloak="ccc"/>
 ```
 
 :+1: Examples of **correct** code for this rule:
 
 ```html
-<template>
-    <div>
-        <div v-cloak></div>
-    </div>
-</template>
+<div v-cloak/>
 ```
 
 ## :wrench: Options
diff --git a/docs/rules/no-invalid-v-else-if.md b/docs/rules/no-invalid-v-else-if.md
index e724f7fec..085fed94c 100644
--- a/docs/rules/no-invalid-v-else-if.md
+++ b/docs/rules/no-invalid-v-else-if.md
@@ -19,24 +19,16 @@ This rule does not check syntax errors in directives because it's checked by [no
 :-1: Examples of **incorrect** code for this rule:
 
 ```html
-<template>
-    <div>
-        <div v-else-if></div>
-        <div v-else-if:aaa="foo"></div>
-        <div v-else-if.bbb="foo"></div>
-    </div>
-</template>
+<div v-else-if/>
+<div v-else-if:aaa="foo"/>
+<div v-else-if.bbb="foo"/>
 ```
 
 :+1: Examples of **correct** code for this rule:
 
 ```html
-<template>
-    <div>
-        <div v-if="foo"></div>
-        <div v-else-if="bar"></div>
-    </div>
-</template>
+<div v-if="foo"/>
+<div v-else-if="bar"/>
 ```
 
 ## :wrench: Options
diff --git a/docs/rules/no-invalid-v-else.md b/docs/rules/no-invalid-v-else.md
index 82c2cc17d..bdafa603b 100644
--- a/docs/rules/no-invalid-v-else.md
+++ b/docs/rules/no-invalid-v-else.md
@@ -17,24 +17,16 @@ This rule reports `v-else` directives in the following cases:
 :-1: Examples of **incorrect** code for this rule:
 
 ```html
-<template>
-    <div>
-        <div v-else="foo"></div>
-        <div v-else:aaa></div>
-        <div v-else.bbb></div>
-    </div>
-</template>
+<div v-else="foo"/>
+<div v-else:aaa/>
+<div v-else.bbb/>
 ```
 
 :+1: Examples of **correct** code for this rule:
 
 ```html
-<template>
-    <div>
-        <div v-if="foo"></div>
-        <div v-else></div>
-    </div>
-</template>
+<div v-if="foo"/>
+<div v-else/>
 ```
 
 ## :wrench: Options
diff --git a/docs/rules/no-invalid-v-for.md b/docs/rules/no-invalid-v-for.md
index 4953d3b3e..d98409313 100644
--- a/docs/rules/no-invalid-v-for.md
+++ b/docs/rules/no-invalid-v-for.md
@@ -25,28 +25,33 @@ The following cases are syntax errors:
 :-1: Examples of **incorrect** code for this rule:
 
 ```html
-<template>
-    <div v-for="x in list">
-        <div v-for></div>
-        <div v-for:aaa="x in list"></div>
-        <div v-for.bbb="x in list"></div>
-        <your-component v-for="x in list"></your-component>
-        <div is="your-component" v-for="x in list"></div>
-        <your-component  v-for="x in list" :key="foo"></your-component>
-    </div>
-</template>
+<div v-for/>
+<div v-for:aaa="todo in todos"/>
+<div v-for.bbb="todo in todos"/>
+<div
+  v-for="todo in todos"
+  is="MyComponent"
+/>
+<MyComponent v-for="todo in todos"/>
+<MyComponent
+  v-for="todo in todos"
+  :key="foo"
+/>
 ```
 
 :+1: Examples of **correct** code for this rule:
 
 ```html
-<template>
-    <div>
-        <div v-for="x in list"></div>
-        <your-component v-for="x in list" :key="x.id"></your-component>
-        <div is="your-component" v-for="x in list" :key="x.id"></div>
-    </div>
-</template>
+<div v-for="todo in todos"/>
+<MyComponent
+  v-for="todo in todos"
+  :key="todo.id"
+/>
+<div
+  v-for="todo in todos"
+  :is="MyComponent"
+  :key="todo.id"
+/>
 ```
 
 ## :wrench: Options
@@ -60,4 +65,4 @@ Nothing.
 
 
 [require-v-for-key]: require-v-for-key.md
-[no-parsing-error]: no-parsing-error.md
\ No newline at end of file
+[no-parsing-error]: no-parsing-error.md
diff --git a/docs/rules/no-invalid-v-html.md b/docs/rules/no-invalid-v-html.md
index 370ad818f..30a459cfa 100644
--- a/docs/rules/no-invalid-v-html.md
+++ b/docs/rules/no-invalid-v-html.md
@@ -17,23 +17,15 @@ This rule does not check syntax errors in directives because it's checked by [no
 :-1: Examples of **incorrect** code for this rule:
 
 ```html
-<template>
-    <div>
-        <div v-html></div>
-        <div v-html:aaa="foo"></div>
-        <div v-html.bbb="foo"></div>
-    </div>
-</template>
+<div v-html/>
+<div v-html:aaa="foo"/>
+<div v-html.bbb="foo"/>
 ```
 
 :+1: Examples of **correct** code for this rule:
 
 ```html
-<template>
-    <div>
-        <div v-html="foo"></div>
-    </div>
-</template>
+<div v-html="foo"/>
 ```
 
 ## :wrench: Options
diff --git a/docs/rules/no-invalid-v-if.md b/docs/rules/no-invalid-v-if.md
index 99cabc5a2..443a88976 100644
--- a/docs/rules/no-invalid-v-if.md
+++ b/docs/rules/no-invalid-v-if.md
@@ -18,27 +18,25 @@ This rule does not check syntax errors in directives because it's checked by [no
 :-1: Examples of **incorrect** code for this rule:
 
 ```html
-<template>
-    <div v-if="foo">
-        <div v-if></div>
-        <div v-if:aaa="foo"></div>
-        <div v-if.bbb="foo"></div>
-        <div v-if="foo" v-else></div>
-        <div v-if="foo" v-else-if="bar"></div>
-    </div>
-</template>
+<div v-if/>
+<div v-if:aaa="foo"/>
+<div v-if.bbb="foo"/>
+<div
+  v-if="foo"
+  v-else
+/>
+<div
+  v-if="foo"
+  v-else-if="bar"
+/>
 ```
 
 :+1: Examples of **correct** code for this rule:
 
 ```html
-<template>
-    <div>
-        <div v-if="foo"></div>
-        <div v-else-if="bar"></div>
-        <div v-else></div>
-    </div>
-</template>
+<div v-if="foo"/>
+<div v-else-if="bar"/>
+<div v-else/>
 ```
 
 ## :wrench: Options
diff --git a/docs/rules/no-invalid-v-model.md b/docs/rules/no-invalid-v-model.md
index 281cdfaf9..38d306e8b 100644
--- a/docs/rules/no-invalid-v-model.md
+++ b/docs/rules/no-invalid-v-model.md
@@ -22,34 +22,26 @@ This rule does not check syntax errors in directives because it's checked by [no
 :-1: Examples of **incorrect** code for this rule:
 
 ```html
-<template>
-    <div>
-        <input v-model>
-        <input v-model:aaa="foo">
-        <input v-model.bbb="foo">
-        <input v-model="foo + bar">
-        <div v-model="foo"></div>
-        <div v-for="x in list">
-            <input v-model="x">
-        </div>
-    </div>
-</template>
+<input v-model>
+<input v-model:aaa="foo">
+<input v-model.bbb="foo">
+<input v-model="foo + bar">
+<div v-model="foo"/>
+<div v-for="todo in todos">
+  <input v-model="todo">
+</div>
 ```
 
 :+1: Examples of **correct** code for this rule:
 
 ```html
-<template>
-    <div>
-        <input v-model="foo">
-        <input v-model.lazy="foo">
-        <textarea v-model="foo"></textarea>
-        <your-component v-model="foo"></your-component>
-        <div v-for="x in list">
-            <input v-model="x.name">
-        </div>
-    </div>
-</template>
+<input v-model="foo">
+<input v-model.lazy="foo">
+<textarea v-model="foo"/>
+<MyComponent v-model="foo"/>
+<div v-for="todo in todos">
+  <input v-model="todo.name">
+</div>
 ```
 
 ## :wrench: Options
diff --git a/docs/rules/no-invalid-v-on.md b/docs/rules/no-invalid-v-on.md
index 85aff4d0e..c961bf76f 100644
--- a/docs/rules/no-invalid-v-on.md
+++ b/docs/rules/no-invalid-v-on.md
@@ -17,27 +17,21 @@ This rule does not check syntax errors in directives because it's checked by [no
 :-1: Examples of **incorrect** code for this rule:
 
 ```html
-<template>
-    <div>
-        <div v-on="foo"></div>
-        <div v-on:click="foo"></div>
-        <div v-on:click.bbb="foo"></div>
-    </div>
-</template>
+<div v-on/>
+<div v-on:click/>
+<div v-on:click.aaa="foo"/>
+<div @click/>
 ```
 
 :+1: Examples of **correct** code for this rule:
 
 ```html
-<template>
-    <div>
-        <div v-on:click="foo"></div>
-        <div @click="foo"></div>
-        <div @click.left="foo"></div>
-        <div @click.prevent></div>
-        <div @click.stop></div>
-    </div>
-</template>
+<div v-on="foo"/>
+<div v-on:click="foo"/>
+<div @click="foo"/>
+<div @click.left="foo"/>
+<div @click.prevent/>
+<div @click.stop/>
 ```
 
 ## :wrench: Options
diff --git a/docs/rules/no-multi-spaces.md b/docs/rules/no-multi-spaces.md
index c098248d5..30ba8e14e 100644
--- a/docs/rules/no-multi-spaces.md
+++ b/docs/rules/no-multi-spaces.md
@@ -11,21 +11,17 @@ This rule aims to remove multiple spaces in a row between attributes witch are n
 Examples of **incorrect** code for this rule:
 
 ```html
-<template>
-  <div class="foo"      :style="foo"
-    :foo="bar"         >
-  </div>
-</template>
+<div     class="foo"
+      :style="bar"         />
 ```
 
 Examples of **correct** code for this rule:
 
 ```html
-<template>
-  <div class="foo"
-    :style="foo">
-  </div>
-</template>
+<div
+  class="foo"
+  :style="bar"
+/>
 ```
 
 ### Options
diff --git a/docs/rules/no-parsing-error.md b/docs/rules/no-parsing-error.md
index a68e6afc9..0315af509 100644
--- a/docs/rules/no-parsing-error.md
+++ b/docs/rules/no-parsing-error.md
@@ -18,61 +18,59 @@ Then reports syntax errors if exist.
 :-1: Examples of **incorrect** code for this rule:
 
 ```html
-<template>
-    <div>{{message.}}</div>
-</template>
+{{ . }}
+{{ foo. }}
 ```
 
 :+1: Examples of **correct** code for this rule:
 
 ```html
-<template>
-    <div>{{message}}</div>
-</template>
+{{ foo }}
+{{ foo.bar }}
 ```
 
 ## :wrench: Options
 
 ```json
 {
-    "vue/no-parsing-error": [2, {
-        "abrupt-closing-of-empty-comment": false,
-        "absence-of-digits-in-numeric-character-reference": false,
-        "cdata-in-html-content": false,
-        "character-reference-outside-unicode-range": false,
-        "control-character-in-input-stream": false,
-        "control-character-reference": false,
-        "eof-before-tag-name": false,
-        "eof-in-cdata": false,
-        "eof-in-comment": false,
-        "eof-in-tag": false,
-        "incorrectly-closed-comment": false,
-        "incorrectly-opened-comment": false,
-        "invalid-first-character-of-tag-name": false,
-        "missing-attribute-value": false,
-        "missing-end-tag-name": false,
-        "missing-semicolon-after-character-reference": false,
-        "missing-whitespace-between-attributes": false,
-        "nested-comment": false,
-        "noncharacter-character-reference": false,
-        "noncharacter-in-input-stream": false,
-        "null-character-reference": false,
-        "surrogate-character-reference": false,
-        "surrogate-in-input-stream": false,
-        "unexpected-character-in-attribute-name": false,
-        "unexpected-character-in-unquoted-attribute-value": false,
-        "unexpected-equals-sign-before-attribute-name": false,
-        "unexpected-null-character": false,
-        "unexpected-question-mark-instead-of-tag-name": false,
-        "unexpected-solidus-in-tag": false,
-        "unknown-named-character-reference": false,
-        "end-tag-with-attributes": false,
-        "duplicate-attribute": false,
-        "end-tag-with-trailing-solidus": false,
-        "non-void-html-element-start-tag-with-trailing-solidus": false,
-        "x-invalid-end-tag": false,
-        "x-invalid-namespace": false
-    }]
+  "vue/no-parsing-error": [2, {
+    "abrupt-closing-of-empty-comment": false,
+    "absence-of-digits-in-numeric-character-reference": false,
+    "cdata-in-html-content": false,
+    "character-reference-outside-unicode-range": false,
+    "control-character-in-input-stream": false,
+    "control-character-reference": false,
+    "eof-before-tag-name": false,
+    "eof-in-cdata": false,
+    "eof-in-comment": false,
+    "eof-in-tag": false,
+    "incorrectly-closed-comment": false,
+    "incorrectly-opened-comment": false,
+    "invalid-first-character-of-tag-name": false,
+    "missing-attribute-value": false,
+    "missing-end-tag-name": false,
+    "missing-semicolon-after-character-reference": false,
+    "missing-whitespace-between-attributes": false,
+    "nested-comment": false,
+    "noncharacter-character-reference": false,
+    "noncharacter-in-input-stream": false,
+    "null-character-reference": false,
+    "surrogate-character-reference": false,
+    "surrogate-in-input-stream": false,
+    "unexpected-character-in-attribute-name": false,
+    "unexpected-character-in-unquoted-attribute-value": false,
+    "unexpected-equals-sign-before-attribute-name": false,
+    "unexpected-null-character": false,
+    "unexpected-question-mark-instead-of-tag-name": false,
+    "unexpected-solidus-in-tag": false,
+    "unknown-named-character-reference": false,
+    "end-tag-with-attributes": false,
+    "duplicate-attribute": false,
+    "end-tag-with-trailing-solidus": false,
+    "non-void-html-element-start-tag-with-trailing-solidus": false,
+    "x-invalid-end-tag": false,
+    "x-invalid-namespace": false
+  }]
 }
 ```
 
diff --git a/docs/rules/no-reserved-keys.md b/docs/rules/no-reserved-keys.md
index 6bf480c15..f6aefd7c2 100644
--- a/docs/rules/no-reserved-keys.md
+++ b/docs/rules/no-reserved-keys.md
@@ -13,16 +13,14 @@ export default {
   },
   computed: {
     $on: {
-      get () {
-      }
+      get () {}
     }
   },
   data: {
     _foo: null
   },
   methods: {
-    $nextTick () {
-    }
+    $nextTick () {}
   }
 }
 ```
@@ -37,24 +35,22 @@ This rule has an object option:
 
 ### Example:
 
-```json
-{
-  "vue/no-reserved-keys": [2, {
-    "reserved": ["foo", "foo2"],
-    "groups": ["asyncComputed"]
-  }]
-}
+``` json
+"vue/no-reserved-keys": [2, {
+  reserved: ['foo', 'foo2'],
+  groups: ['firebase']
+}]
 ```
 
 :-1: Examples of **incorrect** code for this configuration
 
 ```js
 export default {
-  asyncComputed: {
-    foo2 () {}
-  },
   computed: {
     foo () {}
+  },
+  firebase: {
+    foo2 () {}
   }
 }
 ```
diff --git a/docs/rules/no-shared-component-data.md b/docs/rules/no-shared-component-data.md
index 836eea109..7b023f1ee 100644
--- a/docs/rules/no-shared-component-data.md
+++ b/docs/rules/no-shared-component-data.md
@@ -16,6 +16,14 @@ Vue.component('some-comp', {
 })
 ```
 
+```js
+export default {
+  data: {
+    foo: 'bar'
+  }
+})
+```
+
 :+1: Examples of **correct** code for this rule:
 
 ```js
@@ -28,6 +36,16 @@ Vue.component('some-comp', {
 })
 ```
 
+```js
+export default {
+  data () {
+    return {
+      foo: 'bar'
+    }
+  }
+}
+```
+
 ## :wrench: Options
 
 Nothing.
diff --git a/docs/rules/no-side-effects-in-computed-properties.md b/docs/rules/no-side-effects-in-computed-properties.md
index 5a7ff8aec..954e8d460 100644
--- a/docs/rules/no-side-effects-in-computed-properties.md
+++ b/docs/rules/no-side-effects-in-computed-properties.md
@@ -8,34 +8,26 @@ It is considered a very bad practice to introduce side effects inside computed p
 Examples of **incorrect** code for this rule:
 
 ```js
-
-export default {
-  computed: {
-    fullName() {
-      this.firstName = 'lorem' // <- side effect
-      return `${this.firstName} ${this.lastName}`
-    },
-    somethingReversed() {
-      return this.something.reverse() // <- side effect
-    }
+computed: {
+  fullName () {
+    this.firstName = 'lorem' // <- side effect
+    return `${this.firstName} ${this.lastName}`
+  },
+  reversedArray () {
+    return this.array.reverse() // <- side effect
   }
 }
-
 ```
 
 Examples of **correct** code for this rule:
 
 ```js
-
-export default {
-  computed: {
-    fullName() {
-      return `${this.firstName} ${this.lastName}`
-    },
-    somethingReversed() {
-      return this.something.slice(0).reverse()
-    }
+computed: {
+  fullName () {
+    return `${this.firstName} ${this.lastName}`
+  },
+  reversedArray () {
+    return this.array.slice(0).reverse()
   }
 }
-
 ```
diff --git a/docs/rules/no-template-key.md b/docs/rules/no-template-key.md
index d0d1eca8d..217efbc67 100644
--- a/docs/rules/no-template-key.md
+++ b/docs/rules/no-template-key.md
@@ -9,24 +9,16 @@ This rule reports the `<template>` elements which have `key` attribute.
 :-1: Examples of **incorrect** code for this rule:
 
 ```html
-<template>
-    <div>
-        <template key="x"></template>
-        <template v-bind:key="y"></template>
-        <template :key="z"></template>
-    </div>
-</template>
+<template key="foo"> ... </template>
+<template v-bind:key="bar"> ... </template>
+<template :key="baz"> ... </template>
 ```
 
 :+1: Examples of **correct** code for this rule:
 
 ```html
-<template>
-    <div>
-        <div key="x"></div>
-        <template></template>
-    </div>
-</template>
+<div key="foo"> ... </div>
+<template> ... </template>
 ```
 
 ## :wrench: Options
diff --git a/docs/rules/no-textarea-mustache.md b/docs/rules/no-textarea-mustache.md
index c5251eff8..d204c1fdf 100644
--- a/docs/rules/no-textarea-mustache.md
+++ b/docs/rules/no-textarea-mustache.md
@@ -11,17 +11,13 @@ This rule reports mustaches in `<textarea>`.
 :-1: Examples of **incorrect** code for this rule:
 
 ```html
-<template>
-    <textarea>{{message}}</textarea>
-</template>
+<textarea>{{ message }}</textarea>
 ```
 
 :+1: Examples of **correct** code for this rule:
 
 ```html
-<template>
-    <textarea v-model="message"></textarea>
-</template>
+<textarea v-model="message"/>
 ```
 
 ## :wrench: Options
diff --git a/docs/rules/order-in-components.md b/docs/rules/order-in-components.md
index 97032823c..674140d7f 100644
--- a/docs/rules/order-in-components.md
+++ b/docs/rules/order-in-components.md
@@ -4,41 +4,20 @@ This rule makes sure you keep declared order of properties in components.
 
 ## :book: Rule Details
 
-Recommended order of properties is as follows:
-
-1. Options / Misc (`name`, `delimiters`, `functional`, `model`)
-2. Options / Assets (`components`, `directives`, `filters`)
-3. Options / Composition (`parent`, `mixins`, `extends`, `provide`, `inject`)
-4. `el`
-5. `template`
-6. `props`
-7. `propsData`
-8. `data`
-9. `computed`
-10. `watch`
-11. `lifecycleHooks`
-12. `methods`
-13. `render`
-14. `renderError`
-
-Note that `lifecycleHooks` is not a regular property - it indicates the group of all lifecycle hooks just to simplify the configuration.
+Recommended order of properties can be [found here](https://vuejs.org/v2/style-guide/#Component-instance-options-order-recommended).
 
 Examples of **incorrect** code for this rule:
 
 ```js
-
-export default {
-  name: 'app',
-  data () {
-    return {
-      msg: 'Welcome to Your Vue.js App'
-    }
-  },
-  props: {
-    propA: Number,
-  },
+name: 'app',
+data () {
+  return {
+    msg: 'Welcome to Your Vue.js App'
+  }
+},
+props: {
+  propA: Number,
 }
-
 ```
 
 Examples of **correct** code for this rule:
@@ -63,27 +42,29 @@ export default {
 
 If you want you can change the order providing the optional configuration in your `.eslintrc` file. Setting responsible for the above order looks like this:
 
-```json
-{
-  "vue/order-in-components": [2, {
-    "order": [
-      ["name", "delimiters", "functional", "model"],
-      ["components", "directives", "filters"],
-      ["parent", "mixins", "extends", "provide", "inject"],
-      "el",
-      "template",
-      "props",
-      "propsData",
-      "data",
-      "computed",
-      "watch",
-      "LIFECYCLE_HOOKS",
-      "methods",
-      "render",
-      "renderError"
-    ]
-  }]
-}
+``` json
+"vue/order-in-components": ["error", {
+  order: [
+    "el",
+    "name",
+    "parent",
+    "functional",
+    ["delimiters", "comments"],
+    ["components", "directives", "filters"],
+    "extends",
+    "mixins",
+    "inheritAttrs",
+    "model",
+    ["props", "propsData"],
+    "data",
+    "computed",
+    "watch",
+    "LIFECYCLE_HOOKS",
+    "methods",
+    ["template", "render"],
+    "renderError"
+  ]
+}]
 ```
 
-If you want some of properties to be treated equally in order you can group them into arrays, like we did with `name`, `delimiters`, `funcitonal` and `model`.
+If you want some of properties to be treated equally in order you can group them into arrays, like we did with `delimiters` and `comments`.
diff --git a/docs/rules/require-component-is.md b/docs/rules/require-component-is.md
index c15a3c905..0d929676a 100644
--- a/docs/rules/require-component-is.md
+++ b/docs/rules/require-component-is.md
@@ -11,17 +11,15 @@ This rule reports the `<component>` elements which do not have `v-bind:is` attri
 :-1: Examples of **incorrect** code for this rule:
 
 ```html
-<template>
-    <component></component>
-</template>
+<component/>
+<component is="type"/>
 ```
 
 :+1: Examples of **correct** code for this rule:
 
 ```html
-<template>
-    <component :is="type"></component>
-</template>
+<component :is="type"/>
+<component v-bind:is="type"/>
 ```
 
 ## :wrench: Options
diff --git a/docs/rules/require-default-prop.md b/docs/rules/require-default-prop.md
index 08fb9db09..1071d4f9c 100644
--- a/docs/rules/require-default-prop.md
+++ b/docs/rules/require-default-prop.md
@@ -7,17 +7,15 @@ This rule requires default value to be set for each props that are not marked as
 Examples of **incorrect** code for this rule:
 
 ```js
-export default {
-  props: {
-    a: Number,
-    b: [Number, String],
-    c: {
-      type: Number
-    },
-    d: {
-      type: Number,
-      required: false
-    }
+props: {
+  a: Number,
+  b: [Number, String],
+  c: {
+    type: Number
+  },
+  d: {
+    type: Number,
+    required: false
   }
 }
 ```
@@ -25,21 +23,19 @@ export default {
 Examples of **correct** code for this rule:
 
 ```js
-export default {
-  props: {
-    a: {
-      type: Number,
-      required: true
-    },
-    b: {
-      type: Number,
-      default: 0
-    },
-    c: {
-      type: Number,
-      default: 0,
-      required: false
-    }
+props: {
+  a: {
+    type: Number,
+    required: true
+  },
+  b: {
+    type: Number,
+    default: 0
+  },
+  c: {
+    type: Number,
+    default: 0,
+    required: false
   }
 }
 ```
diff --git a/docs/rules/require-prop-types.md b/docs/rules/require-prop-types.md
index 3236d74a2..a1b396e11 100644
--- a/docs/rules/require-prop-types.md
+++ b/docs/rules/require-prop-types.md
@@ -9,34 +9,29 @@ This rule enforces that a `props` statement contains type definition.
 :-1: Examples of **incorrect** code for this rule:
 
 ```js
-export default {
-  props: ['status']
-}
+props: ['status']
 ```
 
 :+1: Examples of **correct** code for this rule:
 
 ```js
-export default {
-  props: {
-    status: String
-  }
+props: {
+  status: String
 }
 ```
 
 ```js
-export default {
-  props: {
-    status: {
-      type: String,
-      required: true,
-      validate: function (value) {
-        return ['syncing', 'synced', 'version-conflict', 'error'].indexOf(value) !== -1
-      }
+props: {
+  status: {
+    type: String,
+    required: true,
+    validate: function (value) {
+      return ['syncing', 'synced', 'version-conflict', 'error'].indexOf(value) !== -1
     }
   }
 }
 ```
+
 ## :wrench: Options
 
 Nothing.
diff --git a/docs/rules/require-render-return.md b/docs/rules/require-render-return.md
index ffbb374d0..b4780b17c 100644
--- a/docs/rules/require-render-return.md
+++ b/docs/rules/require-render-return.md
@@ -8,15 +8,15 @@ This rule aims to enforce render function to always return value
 
 ```js
 export default {
-  render () {
-  }
+  render () {}
 }
 ```
+
 ```js
 export default {
   render (h) {
     if (foo) {
-      return
+      return h('div', 'hello')
     }
   }
 }
@@ -27,7 +27,7 @@ export default {
 ```js
 export default {
   render (h) {
-    return
+    return h('div', 'hello')
   }
 }
 ```
diff --git a/docs/rules/require-v-for-key.md b/docs/rules/require-v-for-key.md
index 783f5f6ac..c48f5ea90 100644
--- a/docs/rules/require-v-for-key.md
+++ b/docs/rules/require-v-for-key.md
@@ -13,21 +13,16 @@ It will be reported by [no-invalid-v-for] rule.
 :-1: Examples of **incorrect** code for this rule:
 
 ```html
-<template>
-    <div>
-        <div v-for="x in list"></div>
-    </div>
-</template>
+<div v-for="todo in todos"/>
 ```
 
 :+1: Examples of **correct** code for this rule:
 
 ```html
-<template>
-    <div>
-        <div v-for="x in list" :key="x.id"></div>
-    </div>
-</template>
+<div
+  v-for="todo in todos"
+  :key="todo.id"
+/>
 ```
 
 ## :wrench: Options
diff --git a/docs/rules/require-valid-default-prop.md b/docs/rules/require-valid-default-prop.md
index 81b3aac8a..fad89c09f 100644
--- a/docs/rules/require-valid-default-prop.md
+++ b/docs/rules/require-valid-default-prop.md
@@ -7,55 +7,51 @@ This rule checks whether the default value of each prop is valid for the given t
 :-1: Examples of **incorrect** code for this rule:
 
 ```js
-Vue.component('example', {
-  props: {
-    propA: {
-      type: String,
-      default: {}
-    },
-    propB: {
-      type: String,
-      default: []
-    },
-    propC: {
-      type: Object,
-      default: []
-    },
-    propD: {
-      type: Array,
-      default: []
-    },
-    propE: {
-      type: Object,
-      default: { message: 'hello' }
-    }
+props: {
+  propA: {
+    type: String,
+    default: {}
+  },
+  propB: {
+    type: String,
+    default: []
+  },
+  propC: {
+    type: Object,
+    default: []
+  },
+  propD: {
+    type: Array,
+    default: []
+  },
+  propE: {
+    type: Object,
+    default: { message: 'hello' }
   }
-})
+}
 ```
 
 :+1: Examples of **correct** code for this rule:
 
 ```js
-Vue.component('example', {
-  props: {
-    // basic type check (`null` means accept any type)
-    propA: Number,
-    // multiple possible types
-    propB: [String, Number],
-    // a number with default value
-    propD: {
-      type: Number,
-      default: 100
-    },
-    // object/array defaults should be returned from a factory function
-    propE: {
-      type: Object,
-      default: function () {
-        return { message: 'hello' }
-      }
+props: {
+  // basic type check (`null` means accept any type)
+  propA: Number,
+  // multiple possible types
+  propB: [String, Number],
+  // a number with default value
+  propD: {
+    type: Number,
+    default: 100
+  },
+  // object/array defaults should be returned from a factory function
+  propE: {
+    type: Object,
+    default: function () {
+      return { message: 'hello' }
     }
   }
-})
+}
 ```
 
 ## :wrench: Options
diff --git a/docs/rules/return-in-computed-property.md b/docs/rules/return-in-computed-property.md
index 83c1adae1..87fdb26fe 100644
--- a/docs/rules/return-in-computed-property.md
+++ b/docs/rules/return-in-computed-property.md
@@ -9,10 +9,8 @@ This rule enforces that a `return` statement is present in `computed` properties
 ```js
 export default {
   computed: {
-    foo () {
-    },
-    bar: function () {
-    }
+    foo () {},
+    bar: function () {}
   }
 }
 ```
diff --git a/docs/rules/this-in-template.md b/docs/rules/this-in-template.md
index 037bbe0ed..270f9389a 100644
--- a/docs/rules/this-in-template.md
+++ b/docs/rules/this-in-template.md
@@ -5,17 +5,17 @@
 :-1: Examples of **incorrect** code for this rule:
 
 ```html
-<template>
-     <a :href="this.link">{{this.text}}</a>
-</template>
+<a :href="this.url">
+  {{ this.text }}
+</a>
 ```
 
 :+1: Examples of **correct** code for this rule:
 
 ```html
-<template>
-     <a :href="link">{{text}}</a>
-</template>
+<a :href="url">
+  {{ text }}
+</a>
 ```
 
 ## :wrench: Options
@@ -26,46 +26,38 @@ Default is set to `never`.
 'vue/this-in-template': [2, 'always'|'never']
 ```
 
-### `"always"` - Always use `this` while accessing properties from vue
+### `"always"` - Always use `this` while accessing properties from Vue
 
-:+1: Examples of **correct** code`:
+:-1: Examples of **incorrect** code:
 
 ```html
-<template>
-  <div :class="{'show': this.showFoo}">
-    {{ this.foo }}
-  </div>
-</template>
+<a :href="url">
+  {{ text }}
+</a>
 ```
 
-:-1: Examples of **incorrect** code:
+:+1: Examples of **correct** code`:
 
 ```html
-<template>
-  <div :class="{'show': showFoo}">
-    {{ foo }}
-  </div>
-</template>
+<a :href="this.url">
+  {{ this.text }}
+</a>
 ```
 
-### `"never"` - Never use expresions that contain `this` keyword in expressions
+### `"never"` - Never use `this` keyword in expressions
 
-:+1: Examples of **correct** code:
+:-1: Examples of **incorrect** code:
 
 ```html
-<template>
-  <div :class="{'show': showFoo}">
-    {{ foo }}
-  </div>
-</template>
+<a :href="this.url">
+  {{ this.text }}
+</a>
 ```
 
-:-1: Examples of **incorrect** code:
+:+1: Examples of **correct** code:
 
 ```html
-<template>
-  <div :class="{'show': this.showFoo}">
-    {{ this.foo }}
-  </div>
-</template>
+<a :href="url">
+  {{ text }}
+</a>
 ```
diff --git a/docs/rules/v-bind-style.md b/docs/rules/v-bind-style.md
index 1375306bc..351c7e4b5 100644
--- a/docs/rules/v-bind-style.md
+++ b/docs/rules/v-bind-style.md
@@ -9,41 +9,25 @@ This rule enforces `v-bind` directive style which you should use shorthand or lo
 :-1: Examples of **incorrect** code for this rule:
 
 ```html
-<template>
-    <div>
-        <div v-bind:foo="foo"></div>
-    </div>
-</template>
+<div v-bind:foo="bar"/>
 ```
 
 :+1: Examples of **correct** code for this rule:
 
 ```html
-<template>
-    <div>
-        <div :foo="foo"></div>
-    </div>
-</template>
+<div :foo="bar"/>
 ```
 
 :-1: Examples of **incorrect** code for this rule with `"longform"` option:
 
 ```html
-<template>
-    <div>
-        <div :foo="foo"></div>
-    </div>
-</template>
+<div :foo="bar"/>
 ```
 
 :+1: Examples of **correct** code for this rule with `"longform"` option:
 
 ```html
-<template>
-    <div>
-        <div v-bind:foo="foo"></div>
-    </div>
-</template>
+<div v-bind:foo="bar"/>
 ```
 
 ## :wrench: Options
diff --git a/docs/rules/v-on-style.md b/docs/rules/v-on-style.md
index 144ee12b7..4dab8bc49 100644
--- a/docs/rules/v-on-style.md
+++ b/docs/rules/v-on-style.md
@@ -9,41 +9,25 @@ This rule enforces `v-on` directive style which you should use shorthand or long
 :-1: Examples of **incorrect** code for this rule:
 
 ```html
-<template>
-    <div>
-        <div v-on:click="foo"></div>
-    </div>
-</template>
+<div v-on:click="foo"/>
 ```
 
 :+1: Examples of **correct** code for this rule:
 
 ```html
-<template>
-    <div>
-        <div @click="foo"></div>
-    </div>
-</template>
+<div @click="foo"/>
 ```
 
 :-1: Examples of **incorrect** code for this rule with `"longform"` option:
 
 ```html
-<template>
-    <div>
-        <div @click="foo"></div>
-    </div>
-</template>
+<div @click="foo"/>
 ```
 
 :+1: Examples of **correct** code for this rule with `"longform"` option:
 
 ```html
-<template>
-    <div>
-        <div v-on:click="foo"></div>
-    </div>
-</template>
+<div v-on:click="foo"/>
 ```
 
 ## :wrench: Options
diff --git a/docs/rules/valid-template-root.md b/docs/rules/valid-template-root.md
index 762eadee3..271ea935c 100644
--- a/docs/rules/valid-template-root.md
+++ b/docs/rules/valid-template-root.md
@@ -14,48 +14,84 @@ This rule reports the template root in the following cases:
 
 :-1: Examples of **incorrect** code for this rule:
 
+:-1: Examples of **incorrect** code for this rule:
+
+```js
+template: ''
+```
+
 ```html
 <template>
 </template>
 ```
 
+```js
+template: `
+  <div>hello</div>
+  <div>hello</div>
+`
+```
+
 ```html
 <template>
-    <div>hello</div>
-    <div>hello</div>
+  <div>hello</div>
+  <div>hello</div>
 </template>
 ```
 
+```js
+template: 'abc'
+```
+
 ```html
 <template>
-    abc
+  abc
 </template>
 ```
 
+```js
+template: '<div v-for="item in items"/>'
+```
+
 ```html
 <template>
-    <div v-for="x in list"></div>
+  <div v-for="item in items"/>
 </template>
 ```
 
 :+1: Examples of **correct** code for this rule:
 
+```js
+template: '<div>abc</div>'
+```
+
 ```html
 <template>
-    <div>abc</div>
+  <div>abc</div>
 </template>
 ```
 
+```js
+template: '<div v-if="foo">abc</div>'
+```
+
 ```html
 <template>
-    <div v-if="foo"></div>
+  <div v-if="foo">abc</div>
 </template>
 ```
 
+```js
+template: `
+  <div v-if="foo">abc</div>
+  <div v-else>def</div>
+`
+```
+
 ```html
 <template>
-    <div v-if="foo">abc</div>
-    <div v-else>def</div>
+  <div v-if="foo">abc</div>
+  <div v-else>def</div>
 </template>
 ```
 
diff --git a/docs/rules/valid-v-bind.md b/docs/rules/valid-v-bind.md
index 11b3431fe..0d9445042 100644
--- a/docs/rules/valid-v-bind.md
+++ b/docs/rules/valid-v-bind.md
@@ -13,29 +13,19 @@ This rule does not report `v-bind` directives which do not have their argument (
 
 This rule does not check syntax errors in directives because it's checked by [no-parsing-error] rule.
 
-:-1: Examples of **incorrect** code for this rule:
-
 ```html
-<template>
-    <div>
-        <div v-bind></div>
-        <div :aaa></div>
-        <div v-bind:aaa.bbb="foo"></div>
-    </div>
-</template>
+<div v-bind/>
+<div :aaa/>
+<div v-bind:aaa.bbb="foo"/>
 ```
 
 :+1: Examples of **correct** code for this rule:
 
 ```html
-<template>
-    <div>
-        <div v-bind="foo"></div>
-        <div v-bind:aaa="foo"></div>
-        <div :aaa="foo"></div>
-        <div :aaa.prop="foo"></div>
-    </div>
-</template>
+<div v-bind="foo"/>
+<div v-bind:aaa="foo"/>
+<div :aaa="foo"/>
+<div :aaa.prop="foo"/>
 ```
 
 ## :wrench: Options
diff --git a/docs/rules/valid-v-cloak.md b/docs/rules/valid-v-cloak.md
index 52c249fcb..175067f8b 100644
--- a/docs/rules/valid-v-cloak.md
+++ b/docs/rules/valid-v-cloak.md
@@ -12,24 +12,18 @@ This rule reports `v-cloak` directives in the following cases:
 
 :-1: Examples of **incorrect** code for this rule:
 
+:-1: Examples of **incorrect** code for this rule:
+
 ```html
-<template>
-    <div>
-        <div v-cloak:aaa></div>
-        <div v-cloak.bbb></div>
-        <div v-cloak="ccc"></div>
-    </div>
-</template>
+<div v-cloak:aaa/>
+<div v-cloak.bbb/>
+<div v-cloak="ccc"/>
 ```
 
 :+1: Examples of **correct** code for this rule:
 
 ```html
-<template>
-    <div>
-        <div v-cloak></div>
-    </div>
-</template>
+<div v-cloak/>
 ```
 
 ## :wrench: Options
diff --git a/docs/rules/valid-v-else-if.md b/docs/rules/valid-v-else-if.md
index a26a08a92..a04347a78 100644
--- a/docs/rules/valid-v-else-if.md
+++ b/docs/rules/valid-v-else-if.md
@@ -17,24 +17,16 @@ This rule does not check syntax errors in directives because it's checked by [no
 :-1: Examples of **incorrect** code for this rule:
 
 ```html
-<template>
-    <div>
-        <div v-else-if></div>
-        <div v-else-if:aaa="foo"></div>
-        <div v-else-if.bbb="foo"></div>
-    </div>
-</template>
+<div v-else-if/>
+<div v-else-if:aaa="foo"/>
+<div v-else-if.bbb="foo"/>
 ```
 
 :+1: Examples of **correct** code for this rule:
 
 ```html
-<template>
-    <div>
-        <div v-if="foo"></div>
-        <div v-else-if="bar"></div>
-    </div>
-</template>
+<div v-if="foo"/>
+<div v-else-if="bar"/>
 ```
 
 ## :wrench: Options
diff --git a/docs/rules/valid-v-else.md b/docs/rules/valid-v-else.md
index 8f4304415..25f39f788 100644
--- a/docs/rules/valid-v-else.md
+++ b/docs/rules/valid-v-else.md
@@ -15,24 +15,16 @@ This rule reports `v-else` directives in the following cases:
 :-1: Examples of **incorrect** code for this rule:
 
 ```html
-<template>
-    <div>
-        <div v-else="foo"></div>
-        <div v-else:aaa></div>
-        <div v-else.bbb></div>
-    </div>
-</template>
+<div v-else="foo"/>
+<div v-else:aaa/>
+<div v-else.bbb/>
 ```
 
 :+1: Examples of **correct** code for this rule:
 
 ```html
-<template>
-    <div>
-        <div v-if="foo"></div>
-        <div v-else></div>
-    </div>
-</template>
+<div v-if="foo"/>
+<div v-else/>
 ```
 
 ## :wrench: Options
diff --git a/docs/rules/valid-v-for.md b/docs/rules/valid-v-for.md
index 03720b6a6..f799c804d 100644
--- a/docs/rules/valid-v-for.md
+++ b/docs/rules/valid-v-for.md
@@ -23,28 +23,33 @@ The following cases are syntax errors:
 :-1: Examples of **incorrect** code for this rule:
 
 ```html
-<template>
-    <div v-for="x in list">
-        <div v-for></div>
-        <div v-for:aaa="x in list"></div>
-        <div v-for.bbb="x in list"></div>
-        <your-component v-for="x in list"></your-component>
-        <div is="your-component" v-for="x in list"></div>
-        <your-component  v-for="x in list" :key="foo"></your-component>
-    </div>
-</template>
+<div v-for/>
+<div v-for:aaa="todo in todos"/>
+<div v-for.bbb="todo in todos"/>
+<div
+  v-for="todo in todos"
+  is="MyComponent"
+/>
+<MyComponent v-for="todo in todos"/>
+<MyComponent
+  v-for="todo in todos"
+  :key="foo"
+/>
 ```
 
 :+1: Examples of **correct** code for this rule:
 
 ```html
-<template>
-    <div>
-        <div v-for="x in list"></div>
-        <your-component v-for="x in list" :key="x.id"></your-component>
-        <div is="your-component" v-for="x in list" :key="x.id"></div>
-    </div>
-</template>
+<div v-for="todo in todos"/>
+<MyComponent
+  v-for="todo in todos"
+  :key="todo.id"
+/>
+<div
+  v-for="todo in todos"
+  :is="MyComponent"
+  :key="todo.id"
+/>
 ```
 
 ## :wrench: Options
@@ -58,4 +63,4 @@ Nothing.
 
 
 [require-v-for-key]: require-v-for-key.md
-[no-parsing-error]: no-parsing-error.md
\ No newline at end of file
+[no-parsing-error]: no-parsing-error.md
diff --git a/docs/rules/valid-v-html.md b/docs/rules/valid-v-html.md
index 1269cb850..3c46bcbe4 100644
--- a/docs/rules/valid-v-html.md
+++ b/docs/rules/valid-v-html.md
@@ -15,23 +15,15 @@ This rule does not check syntax errors in directives because it's checked by [no
 :-1: Examples of **incorrect** code for this rule:
 
 ```html
-<template>
-    <div>
-        <div v-html></div>
-        <div v-html:aaa="foo"></div>
-        <div v-html.bbb="foo"></div>
-    </div>
-</template>
+<div v-html/>
+<div v-html:aaa="foo"/>
+<div v-html.bbb="foo"/>
 ```
 
 :+1: Examples of **correct** code for this rule:
 
 ```html
-<template>
-    <div>
-        <div v-html="foo"></div>
-    </div>
-</template>
+<div v-html="foo"/>
 ```
 
 ## :wrench: Options
diff --git a/docs/rules/valid-v-if.md b/docs/rules/valid-v-if.md
index 4955b9439..e57f022de 100644
--- a/docs/rules/valid-v-if.md
+++ b/docs/rules/valid-v-if.md
@@ -15,28 +15,28 @@ This rule does not check syntax errors in directives because it's checked by [no
 
 :-1: Examples of **incorrect** code for this rule:
 
+:-1: Examples of **incorrect** code for this rule:
+
 ```html
-<template>
-    <div v-if="foo">
-        <div v-if></div>
-        <div v-if:aaa="foo"></div>
-        <div v-if.bbb="foo"></div>
-        <div v-if="foo" v-else></div>
-        <div v-if="foo" v-else-if="bar"></div>
-    </div>
-</template>
+<div v-if/>
+<div v-if:aaa="foo"/>
+<div v-if.bbb="foo"/>
+<div
+  v-if="foo"
+  v-else
+/>
+<div
+  v-if="foo"
+  v-else-if="bar"
+/>
 ```
 
 :+1: Examples of **correct** code for this rule:
 
 ```html
-<template>
-    <div>
-        <div v-if="foo"></div>
-        <div v-else-if="bar"></div>
-        <div v-else></div>
-    </div>
-</template>
+<div v-if="foo"/>
+<div v-else-if="bar"/>
+<div v-else/>
 ```
 
 ## :wrench: Options
diff --git a/docs/rules/valid-v-model.md b/docs/rules/valid-v-model.md
index 35a986144..62f3e4545 100644
--- a/docs/rules/valid-v-model.md
+++ b/docs/rules/valid-v-model.md
@@ -20,34 +20,26 @@ This rule does not check syntax errors in directives because it's checked by [no
 :-1: Examples of **incorrect** code for this rule:
 
 ```html
-<template>
-    <div>
-        <input v-model>
-        <input v-model:aaa="foo">
-        <input v-model.bbb="foo">
-        <input v-model="foo + bar">
-        <div v-model="foo"></div>
-        <div v-for="x in list">
-            <input v-model="x">
-        </div>
-    </div>
-</template>
+<input v-model>
+<input v-model:aaa="foo">
+<input v-model.bbb="foo">
+<input v-model="foo + bar">
+<div v-model="foo"/>
+<div v-for="todo in todos">
+  <input v-model="todo">
+</div>
 ```
 
 :+1: Examples of **correct** code for this rule:
 
 ```html
-<template>
-    <div>
-        <input v-model="foo">
-        <input v-model.lazy="foo">
-        <textarea v-model="foo"></textarea>
-        <your-component v-model="foo"></your-component>
-        <div v-for="x in list">
-            <input v-model="x.name">
-        </div>
-    </div>
-</template>
+<input v-model="foo">
+<input v-model.lazy="foo">
+<textarea v-model="foo"/>
+<MyComponent v-model="foo"/>
+<div v-for="todo in todos">
+  <input v-model="todo.name">
+</div>
 ```
 
 ## :wrench: Options
diff --git a/docs/rules/valid-v-on.md b/docs/rules/valid-v-on.md
index 26d71c032..20ab1184c 100644
--- a/docs/rules/valid-v-on.md
+++ b/docs/rules/valid-v-on.md
@@ -14,28 +14,24 @@ This rule does not check syntax errors in directives because it's checked by [no
 
 :-1: Examples of **incorrect** code for this rule:
 
+:-1: Examples of **incorrect** code for this rule:
+
 ```html
-<template>
-    <div>
-        <div v-on="foo"></div>
-        <div v-on:click="foo"></div>
-        <div v-on:click.bbb="foo"></div>
-    </div>
-</template>
+<div v-on/>
+<div v-on:click/>
+<div v-on:click.aaa="foo"/>
+<div @click/>
 ```
 
 :+1: Examples of **correct** code for this rule:
 
 ```html
-<template>
-    <div>
-        <div v-on:click="foo"></div>
-        <div @click="foo"></div>
-        <div @click.left="foo"></div>
-        <div @click.prevent></div>
-        <div @click.stop></div>
-    </div>
-</template>
+<div v-on="foo"/>
+<div v-on:click="foo"/>
+<div @click="foo"/>
+<div @click.left="foo"/>
+<div @click.prevent/>
+<div @click.stop/>
 ```
 
 ## :wrench: Options
diff --git a/docs/rules/valid-v-once.md b/docs/rules/valid-v-once.md
index 3df04f844..168af299a 100644
--- a/docs/rules/valid-v-once.md
+++ b/docs/rules/valid-v-once.md
@@ -13,23 +13,15 @@ This rule reports `v-once` directives in the following cases:
 :-1: Examples of **incorrect** code for this rule:
 
 ```html
-<template>
-    <div>
-        <div v-once:aaa></div>
-        <div v-once.bbb></div>
-        <div v-once="ccc"></div>
-    </div>
-</template>
+<div v-once:aaa/>
+<div v-once.bbb/>
+<div v-once="ccc"/>
 ```
 
 :+1: Examples of **correct** code for this rule:
 
 ```html
-<template>
-    <div>
-        <div v-once></div>
-    </div>
-</template>
+<div v-once/>
 ```
 
 ## :wrench: Options
diff --git a/docs/rules/valid-v-pre.md b/docs/rules/valid-v-pre.md
index 6855363c4..4d177682f 100644
--- a/docs/rules/valid-v-pre.md
+++ b/docs/rules/valid-v-pre.md
@@ -13,23 +13,15 @@ This rule reports `v-pre` directives in the following cases:
 :-1: Examples of **incorrect** code for this rule:
 
 ```html
-<template>
-    <div>
-        <div v-pre:aaa></div>
-        <div v-pre.bbb></div>
-        <div v-pre="ccc"></div>
-    </div>
-</template>
+<div v-pre:aaa/>
+<div v-pre.bbb/>
+<div v-pre="ccc"/>
 ```
 
 :+1: Examples of **correct** code for this rule:
 
 ```html
-<template>
-    <div>
-        <div v-pre></div>
-    </div>
-</template>
+<div v-pre/>
 ```
 
 ## :wrench: Options
diff --git a/docs/rules/valid-v-show.md b/docs/rules/valid-v-show.md
index 746a1d01c..7fb00cfdb 100644
--- a/docs/rules/valid-v-show.md
+++ b/docs/rules/valid-v-show.md
@@ -15,23 +15,15 @@ This rule does not check syntax errors in directives because it's checked by [no
 :-1: Examples of **incorrect** code for this rule:
 
 ```html
-<template>
-    <div>
-        <div v-show></div>
-        <div v-show:aaa="foo"></div>
-        <div v-show.bbb="foo"></div>
-    </div>
-</template>
+<div v-show/>
+<div v-show:aaa="foo"/>
+<div v-show.bbb="foo"/>
 ```
 
 :+1: Examples of **correct** code for this rule:
 
 ```html
-<template>
-    <div>
-        <div v-show="foo"></div>
-    </div>
-</template>
+<div v-show="foo"/>
 ```
 
 ## :wrench: Options
diff --git a/docs/rules/valid-v-text.md b/docs/rules/valid-v-text.md
index 055d0e50f..8fbf42a22 100644
--- a/docs/rules/valid-v-text.md
+++ b/docs/rules/valid-v-text.md
@@ -15,23 +15,15 @@ This rule does not check syntax errors in directives because it's checked by [no
 :-1: Examples of **incorrect** code for this rule:
 
 ```html
-<template>
-    <div>
-        <div v-text></div>
-        <div v-text:aaa="foo"></div>
-        <div v-text.bbb="foo"></div>
-    </div>
-</template>
+<div v-text/>
+<div v-text:aaa="foo"/>
+<div v-text.bbb="foo"/>
 ```
 
 :+1: Examples of **correct** code for this rule:
 
 ```html
-<template>
-    <div>
-        <div v-text="foo"></div>
-    </div>
-</template>
+<div v-text="foo"/>
 ```
 
 ## :wrench: Options
diff --git a/lib/rules/name-property-casing.js b/lib/rules/name-property-casing.js
index 4b3d482c5..2d85484ec 100644
--- a/lib/rules/name-property-casing.js
+++ b/lib/rules/name-property-casing.js
@@ -6,6 +6,7 @@
 
 const utils = require('../utils')
 const casing = require('../utils/casing')
+const allowedCaseOptions = ['PascalCase', 'kebab-case']
 
 // ------------------------------------------------------------------------------
 // Rule Definition
@@ -13,7 +14,7 @@ const casing = require('../utils/casing')
 
 function create (context) {
   const options = context.options[0]
-  const caseType = casing.allowedCaseOptions.indexOf(options) !== -1 ? options : 'PascalCase'
+  const caseType = allowedCaseOptions.indexOf(options) !== -1 ? options : 'PascalCase'
 
   // ----------------------------------------------------------------------
   // Public
@@ -53,7 +54,7 @@ module.exports = {
     fixable: 'code',  // or "code" or "whitespace"
     schema: [
       {
-        enum: casing.allowedCaseOptions
+        enum: allowedCaseOptions
       }
     ]
   },
diff --git a/lib/utils/casing.js b/lib/utils/casing.js
index 4069216f4..2baca2356 100644
--- a/lib/utils/casing.js
+++ b/lib/utils/casing.js
@@ -21,8 +21,9 @@ function kebabCase (str) {
  */
 function camelCase (str) {
   return str
-    .replace(/(?:^\w|[A-Z]|\b\w)/g, (letter, index) => (
-      index === 0 ? letter.toLowerCase() : letter.toUpperCase())
+    .replace(/_/g, (_, index) => index === 0 ? _ : '-')
+    .replace(/(?:^\w|[A-Z]|\b\w)/g, (letter, index) =>
+      index === 0 ? letter.toLowerCase() : letter.toUpperCase()
     )
     .replace(invalidChars, '')
 }
@@ -34,6 +35,7 @@ function camelCase (str) {
  */
 function pascalCase (str) {
   return str
+    .replace(/_/g, (_, index) => index === 0 ? _ : '-')
     .replace(/(?:^\w|[A-Z]|\b\w)/g, (letter, index) => letter.toUpperCase())
     .replace(invalidChars, '')
 }
diff --git a/tests/lib/rules/name-property-casing.js b/tests/lib/rules/name-property-casing.js
index 3c09f23f0..d5d833352 100644
--- a/tests/lib/rules/name-property-casing.js
+++ b/tests/lib/rules/name-property-casing.js
@@ -31,7 +31,6 @@ ruleTester.run('name-property-casing', rule, {
         export default {
         }
       `,
-      options: ['camelCase'],
       parserOptions
     },
     {
@@ -41,17 +40,15 @@ ruleTester.run('name-property-casing', rule, {
           ...name
         }
       `,
-      options: ['camelCase'],
       parserOptions
     },
     {
       filename: 'test.vue',
       code: `
         export default {
-          name: 'fooBar'
+          name: 'FooBar'
         }
       `,
-      options: ['camelCase'],
       parserOptions
     },
     {
@@ -86,13 +83,12 @@ ruleTester.run('name-property-casing', rule, {
       `,
       output: `
         export default {
-          name: 'fooBar'
+          name: 'FooBar'
         }
       `,
-      options: ['camelCase'],
       parserOptions,
       errors: [{
-        message: 'Property name "foo-bar" is not camelCase.',
+        message: 'Property name "foo-bar" is not PascalCase.',
         type: 'Literal',
         line: 3
       }]
@@ -125,13 +121,12 @@ ruleTester.run('name-property-casing', rule, {
       `,
       output: `
         export default {
-          name: 'fooBar'
+          name: 'FooBar'
         }
       `,
-      options: ['camelCase'],
       parserOptions,
       errors: [{
-        message: 'Property name "foo!bar" is not camelCase.',
+        message: 'Property name "foo!bar" is not PascalCase.',
         type: 'Literal',
         line: 3
       }]
@@ -145,13 +140,12 @@ ruleTester.run('name-property-casing', rule, {
       `,
       output: `
         new Vue({
-          name: 'fooBar'
+          name: 'FooBar'
         })
       `,
-      options: ['camelCase'],
       parserOptions: { ecmaVersion: 6 },
       errors: [{
-        message: 'Property name "foo!bar" is not camelCase.',
+        message: 'Property name "foo!bar" is not PascalCase.',
         type: 'Literal',
         line: 3
       }]
@@ -165,13 +159,12 @@ ruleTester.run('name-property-casing', rule, {
       `,
       output: `
         export default {
-          name: 'foobar'
+          name: 'FooBar'
         }
       `,
-      options: ['camelCase'],
       parserOptions,
       errors: [{
-        message: 'Property name "foo_bar" is not camelCase.',
+        message: 'Property name "foo_bar" is not PascalCase.',
         type: 'Literal',
         line: 3
       }]
@@ -185,7 +178,7 @@ ruleTester.run('name-property-casing', rule, {
       `,
       output: `
         export default {
-          name: 'Foobar'
+          name: 'FooBar'
         }
       `,
       options: ['PascalCase'],
diff --git a/tests/lib/rules/no-invalid-v-on.js b/tests/lib/rules/no-invalid-v-on.js
index 06ba18b45..45594645e 100644
--- a/tests/lib/rules/no-invalid-v-on.js
+++ b/tests/lib/rules/no-invalid-v-on.js
@@ -27,6 +27,14 @@ tester.run('no-invalid-v-on', rule, {
       filename: 'test.vue',
       code: ''
     },
+    {
+      filename: 'test.vue',
+      code: '<template><div v-on="foo"></div></template>'
+    },
+    {
+      filename: 'test.vue',
+      code: '<template><div v-on="{ click: foo }"></div></template>'
+    },
     {
       filename: 'test.vue',
       code: '<template><div v-on:click="foo"></div></template>'
@@ -66,6 +74,11 @@ tester.run('no-invalid-v-on', rule, {
       code: '<template><div v-on:click.aaa="foo"></div></template>',
       errors: ["'v-on' directives don't support the modifier 'aaa'."]
     },
+    {
+      filename: 'test.vue',
+      code: '<template><div v-on></div></template>',
+      errors: ["'v-on' directives require that attribute value or verb modifiers."]
+    },
     {
       filename: 'test.vue',
       code: '<template><div v-on:click></div></template>',

From 180b2d45e32ebc5c4b0f3ae48ca1f4ceb9244b99 Mon Sep 17 00:00:00 2001
From: Chris Fritz <chrisvfritz@gmail.com>
Date: Mon, 9 Oct 2017 00:30:28 -0400
Subject: [PATCH 06/10] update config descriptions in readme

---
 README.md | 12 +++++-------
 1 file changed, 5 insertions(+), 7 deletions(-)

diff --git a/README.md b/README.md
index 803a1f42b..1803aff7b 100644
--- a/README.md
+++ b/README.md
@@ -75,16 +75,14 @@ Vue.component('AsyncComponent', (resolve, reject) => {
 ## :gear: 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)
+- `plugin:vue/base` - Settings and rules to enable correct ESLint parsing
+- `plugin:vue/essential` - Above, plus rules to prevent errors or unintended behavior
+- `plugin:vue/strongly-recommended` - Above, plus rules to considerably improve code readability and/or dev experience
+- `plugin:vue/recommended` - Above, plus rules to enforce subjective community defaults to ensure consistency
 
 ## :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 are grouped by priority to help you understand their purpose. The `--fix` option on the command line automatically fixes problems reported by rules which have a wrench :wrench: below.
 
 <!--RULES_TABLE_START-->
 

From 6f4515f971eda8e1e2eb2fc5b4f0fd78198571b6 Mon Sep 17 00:00:00 2001
From: Chris Fritz <chrisvfritz@gmail.com>
Date: Tue, 10 Oct 2017 20:23:08 -0400
Subject: [PATCH 07/10] remove all-rules config

---
 lib/all-rules.js  | 51 -----------------------------------------------
 lib/config/all.js |  4 ----
 2 files changed, 55 deletions(-)
 delete mode 100644 lib/all-rules.js
 delete mode 100644 lib/config/all.js

diff --git a/lib/all-rules.js b/lib/all-rules.js
deleted file mode 100644
index b2ff227f5..000000000
--- a/lib/all-rules.js
+++ /dev/null
@@ -1,51 +0,0 @@
-/*
-* IMPORTANT!
-* This file has been automatically generated,
-* in order to update it's content execute "npm run update"
-*/
-module.exports = {
-  "vue/attribute-hyphenation": "error",
-  "vue/html-end-tags": "error",
-  "vue/html-quotes": "error",
-  "vue/html-self-closing": "error",
-  "vue/jsx-uses-vars": "error",
-  "vue/max-attributes-per-line": "error",
-  "vue/mustache-interpolation-spacing": "error",
-  "vue/name-property-casing": "error",
-  "vue/no-async-in-computed-properties": "error",
-  "vue/no-confusing-v-for-v-if": "error",
-  "vue/no-dupe-keys": "error",
-  "vue/no-duplicate-attributes": "error",
-  "vue/no-multi-spaces": "error",
-  "vue/no-parsing-error": "error",
-  "vue/no-reserved-keys": "error",
-  "vue/no-shared-component-data": "error",
-  "vue/no-side-effects-in-computed-properties": "error",
-  "vue/no-template-key": "error",
-  "vue/no-textarea-mustache": "error",
-  "vue/order-in-components": "error",
-  "vue/require-component-is": "error",
-  "vue/require-default-prop": "error",
-  "vue/require-prop-types": "error",
-  "vue/require-render-return": "error",
-  "vue/require-v-for-key": "error",
-  "vue/require-valid-default-prop": "error",
-  "vue/return-in-computed-property": "error",
-  "vue/this-in-template": "error",
-  "vue/v-bind-style": "error",
-  "vue/v-on-style": "error",
-  "vue/valid-template-root": "error",
-  "vue/valid-v-bind": "error",
-  "vue/valid-v-cloak": "error",
-  "vue/valid-v-else-if": "error",
-  "vue/valid-v-else": "error",
-  "vue/valid-v-for": "error",
-  "vue/valid-v-html": "error",
-  "vue/valid-v-if": "error",
-  "vue/valid-v-model": "error",
-  "vue/valid-v-on": "error",
-  "vue/valid-v-once": "error",
-  "vue/valid-v-pre": "error",
-  "vue/valid-v-show": "error",
-  "vue/valid-v-text": "error"
-}
\ No newline at end of file
diff --git a/lib/config/all.js b/lib/config/all.js
deleted file mode 100644
index 5a52e9ca0..000000000
--- a/lib/config/all.js
+++ /dev/null
@@ -1,4 +0,0 @@
-module.exports = {
-  extends: require.resolve('./base.js'),
-  rules: require('../all-rules.js')
-}

From 18a3d8a7ccc8805a74dbed3090d4a2be0b69a96b Mon Sep 17 00:00:00 2001
From: Chris Fritz <chrisvfritz@gmail.com>
Date: Tue, 17 Oct 2017 15:56:50 -0400
Subject: [PATCH 08/10] fix html-end-tags failing on self-closing elements

---
 lib/rules/html-end-tags.js       | 4 ++--
 tests/lib/rules/html-end-tags.js | 6 +++++-
 2 files changed, 7 insertions(+), 3 deletions(-)

diff --git a/lib/rules/html-end-tags.js b/lib/rules/html-end-tags.js
index 8846fb636..a4c05eecd 100644
--- a/lib/rules/html-end-tags.js
+++ b/lib/rules/html-end-tags.js
@@ -26,8 +26,8 @@ function create (context) {
     VElement (node) {
       const name = node.name
       const isVoid = utils.isHtmlVoidElementName(name)
-      const hasEndTag = node.endTag != null
       const isSelfClosing = node.startTag.selfClosing
+      const hasEndTag = node.endTag != null
 
       if (isVoid && hasEndTag) {
         context.report({
@@ -38,7 +38,7 @@ function create (context) {
           fix: (fixer) => fixer.remove(node.endTag)
         })
       }
-      if (!isVoid && !(hasEndTag || isSelfClosing)) {
+      if (!isVoid && !hasEndTag && !isSelfClosing) {
         context.report({
           node: node.startTag,
           loc: node.startTag.loc,
diff --git a/tests/lib/rules/html-end-tags.js b/tests/lib/rules/html-end-tags.js
index 3884290df..16cb8fe2f 100644
--- a/tests/lib/rules/html-end-tags.js
+++ b/tests/lib/rules/html-end-tags.js
@@ -49,7 +49,11 @@ tester.run('html-end-tags', rule, {
     },
     {
       filename: 'test.vue',
-      code: '<template><div><div /></div></template>'
+      code: '<template><div><self-closing-custom-element/></div></template>'
+    },
+    {
+      filename: 'test.vue',
+      code: '<template><div><div/></div></template>'
     }
   ],
   invalid: [

From e64a4cb409c23939d27f09c69dadccc227d921e8 Mon Sep 17 00:00:00 2001
From: Chris Fritz <chrisvfritz@gmail.com>
Date: Tue, 14 Nov 2017 18:27:32 -0500
Subject: [PATCH 09/10] allow uncategorized rules

---
 tools/update-rules.js | 30 +++++++++++++++++++++++-------
 1 file changed, 23 insertions(+), 7 deletions(-)

diff --git a/tools/update-rules.js b/tools/update-rules.js
index 6e23d01de..67affeed8 100644
--- a/tools/update-rules.js
+++ b/tools/update-rules.js
@@ -44,13 +44,16 @@ const categories = [
     !entry[1].meta.deprecated &&
     entry[1].meta.docs.category === category
   )
-)
+  )
 
 // Throw if an invalid category has been used
 for (const entry of rules) {
   const category = entry[1].meta.docs.category
   if (!categories.includes(category)) {
-    throw new Error(`Rule category ${category} from ${entry[0]} is invalid`)
+    categories.push('uncategorized')
+    if (category) {
+      throw new Error(`Rule category ${category} from ${entry[0]} is invalid`)
+    }
   }
 }
 
@@ -59,7 +62,8 @@ const categoryTitles = {
   essential: 'Priority A: Essential (Error Prevention)',
   'strongly-recommended': 'Priority B: Strongly Recommended (Improving Readability)',
   recommended: 'Priority C: Recommended (Minimizing Arbitrary Choices and Cognitive Overhead)',
-  'use-with-caution': 'Priority D: Use with Caution (Potentially Dangerous Patterns)'
+  'use-with-caution': 'Priority D: Use with Caution (Potentially Dangerous Patterns)',
+  uncategorized: 'Uncategorized'
 }
 
 // Throw if no title is defined for a category
@@ -71,18 +75,29 @@ for (const category of categories) {
 
 const rulesTableContent = categories.map(category => `
 ### ${categoryTitles[category]}
-
+${
+category === 'uncategorized' ? '' : `
 Enforce all the rules in this category, as well as all higher priority rules, with:
 
 \`\`\` json
 "extends": "plugin:vue/${category}"
 \`\`\`
-
+`
+}
 |    | Rule ID | Description |
 |:---|:--------|:------------|
 ${
   rules
-    .filter(entry => entry[1].meta.docs.category === category && !entry[1].meta.deprecated)
+    .filter(entry =>
+      (
+        category === 'uncategorized' &&
+        !entry[1].meta.docs.category
+      ) ||
+      (
+        entry[1].meta.docs.category === category &&
+        !entry[1].meta.deprecated
+      )
+    )
     .map(entry => {
       const name = entry[0]
       const meta = entry[1].meta
@@ -112,10 +127,11 @@ ${
       return `| ${link} | ${replacedBy} |`
     })
     .join('\n')
-}
+  }
 `
 
 categories.forEach((category, categoryIndex) => {
+  if (category === 'uncategorized') return
   createRulesFile(category, categories.slice(0, categoryIndex + 1))
 })
 

From 43432b249ba969c89dab8f6c2b7b7d3b86a06300 Mon Sep 17 00:00:00 2001
From: Chris Fritz <chrisvfritz@gmail.com>
Date: Tue, 14 Nov 2017 20:38:35 -0500
Subject: [PATCH 10/10] fix html-indent tests

---
 tests/lib/rules/html-indent.js | 2113 ++++++++++++++++----------------
 1 file changed, 1072 insertions(+), 1041 deletions(-)

diff --git a/tests/lib/rules/html-indent.js b/tests/lib/rules/html-indent.js
index c5bff0c22..a426dbf97 100644
--- a/tests/lib/rules/html-indent.js
+++ b/tests/lib/rules/html-indent.js
@@ -49,1069 +49,1069 @@ tester.run('html-indent', rule, {
     // Examples in docs.
     unIndent`
       <template>
-          <div class="foo">
-              Hello.
-          </div>
-          <div
-              id="a"
-              class="b"
-              :other-attr="{
-                  aaa: 1,
-                  bbb: 2
-              }"
-              @other-attr2="
-                  foo();
-                  bar();
-              "
-          >
-              {{
-                  displayMessage
-              }}
-          </div>
+        <div class="foo">
+          Hello.
+        </div>
+        <div
+          id="a"
+          class="b"
+          :other-attr="{
+            aaa: 1,
+            bbb: 2
+          }"
+          @other-attr2="
+            foo()
+            bar()
+          "
+        >
+          {{
+            displayMessage
+          }}
+        </div>
       </template>
     `,
 
     // VAttribute
     unIndent`
       <template>
-          <div
-              a="a"
-              b="b"
-              c=
-                  "c"
-              d
-                  ="d"
-              e
-              f
-                  =
-          ></div>
+        <div
+          a="a"
+          b="b"
+          c=
+            "c"
+          d
+            ="d"
+          e
+          f
+            =
+        ></div>
       </template>
     `,
     unIndent`
       <template>
-          <div a="a"
-               b="b"
-               c=
-                   "c"
-               d
-                   ="d"
-               e
-               f
-                   =
-          ></div>
+        <div a="a"
+             b="b"
+             c=
+               "c"
+             d
+               ="d"
+             e
+             f
+               =
+        ></div>
       </template>
     `,
     unIndent`
       <template>
-          <div a="
-          a" b="b"></div>
+        <div a="
+        a" b="b"></div>
       </template>
     `,
 
     // VExpressionContainer
     unIndent`
       <template>
-          <div
-              :foo="
-                  value
-              "
-          ></div>
+        <div
+          :foo="
+            value
+          "
+        ></div>
       </template>
     `,
 
     // VForExpression
     unIndent`
       <template>
-          <div
-              v-for="
-                  x
-                      in
-                          xs
-              "
-          ></div>
-          <div
-              v-for="
-                  (
-                      x
-                      ,
-                      y
-                      ,
-                      z
-                  )
-                      of
-                          xs
-              "
-          ></div>
+        <div
+          v-for="
+            x
+              in
+                xs
+          "
+        ></div>
+        <div
+          v-for="
+            (
+              x
+              ,
+              y
+              ,
+              z
+            )
+              of
+                xs
+          "
+        ></div>
       </template>
     `,
 
     // VOnExpression
     unIndent`
       <template>
-          <div
-              v-on:a="
-                  foo(); bar();
-              "
-              v-on:b="
-                  foo()
-                  bar()
-              "
-              v-on:c="foo()
-                      bar()"
-          ></div>
+        <div
+          v-on:a="
+            foo(); bar();
+          "
+          v-on:b="
+            foo()
+            bar()
+          "
+          v-on:c="foo()
+                  bar()"
+        ></div>
       </template>
     `,
 
     // VStartTag
     unIndent`
       <template>
-          <div
-              aaa
-              bbb
+        <div
+          aaa
+          bbb
     `,
 
     // VText
     unIndent`
       <template>
-          aaa
-          bbb
-          ccc
+        aaa
+        bbb
+        ccc
       </template>
     `,
 
     // ArrayExpression
     unIndent`
       <template>
-          <div v-on:a="
-              [
-                  1
-                  ,
-                  2
-                  ,
-                  [
-                      3
-                  ],
-                  [ 4,
-                    5 ]
-              ]
-          "></div>
+        <div v-on:a="
+          [
+            1
+            ,
+            2
+            ,
+            [
+              3
+            ],
+            [ 4,
+              5 ]
+          ]
+        "></div>
       </template>
     `,
 
     // ArrowFunctionExpression
     unIndent`
       <template>
-          <div
-              v-bind:a="
-                  (
-                  ) =>
-                      1
-              "
-              v-bind:b="
-                  a =>
-                      1
-              "
-              v-bind:c="
-                  (
-                      a
-                  ) =>
-                      1
-              "
-              v-bind:d="
-                  (
-                      a
-                      ,
-                      b
-                  ) =>
-                      1
-              "
-              v-bind:e="
-                  a =>
-                  {
-                      a
-                  }
-              "
-          ></div>
+        <div
+          v-bind:a="
+            (
+            ) =>
+              1
+          "
+          v-bind:b="
+            a =>
+              1
+          "
+          v-bind:c="
+            (
+              a
+            ) =>
+              1
+          "
+          v-bind:d="
+            (
+              a
+              ,
+              b
+            ) =>
+              1
+          "
+          v-bind:e="
+            a =>
+            {
+              a
+            }
+          "
+        ></div>
       </template>
     `,
 
     // AssignmentExpression / BinaryExpression
     unIndent`
       <template>
-          <div
-              v-bind:a="
-                  a
-                      +
-                      b
-              "
-              v-bind:b="
-                  a
-                      +
-                      b
-                      +
-                      c
-              "
-              v-bind:c="
-                  a
-                      =
-                      b
-                          +
-                          c
-                          +
-                          d
-              "
-          ></div>
+        <div
+          v-bind:a="
+            a
+              +
+              b
+          "
+          v-bind:b="
+            a
+              +
+              b
+              +
+              c
+          "
+          v-bind:c="
+            a
+              =
+              b
+                +
+                c
+                +
+                d
+          "
+        ></div>
       </template>
     `,
 
     // AwaitExpression
     unIndent`
       <template>
-          <div
-              v-bind:a="
-                  async () =>
-                      await
-                          1
-              "
-          ></div>
+        <div
+          v-bind:a="
+            async () =>
+              await
+                1
+          "
+        ></div>
       </template>
     `,
 
     // BreakStatement, LabeledStatement
     unIndent`
       <template>
-          <div
-              v-on:a="
-                  while(1)
-                      break
-                      ;
-              "
-              v-on:b="
-                  A
-                      :
-                      break A
-                      ;
-              "
-          ></div>
+        <div
+          v-on:a="
+            while(1)
+              break
+              ;
+          "
+          v-on:b="
+            A
+              :
+              break A
+              ;
+          "
+        ></div>
       </template>
     `,
 
     // CallExpression
     unIndent`
       <template>
-          <div
-              v-bind:a="
-                  foo(
-                  )
-              "
-              v-bind:b="
-                  foo(
-                      1
-                  )
-              "
-              v-bind:c="
-                  foo(
-                      1
-                      ,
-                      2
-                      ,
-                      bar(
-                          3
-                      )
-                  )
-              "
-              v-bind:d="
-                  f(1, 2,
-                    3, 4)
-              "
-          ></div>
+        <div
+          v-bind:a="
+            foo(
+            )
+          "
+          v-bind:b="
+            foo(
+              1
+            )
+          "
+          v-bind:c="
+            foo(
+              1
+              ,
+              2
+              ,
+              bar(
+                3
+              )
+            )
+          "
+          v-bind:d="
+            f(1, 2,
+              3, 4)
+          "
+        ></div>
       </template>
     `,
 
     // ClassExpression / ClassDeclaration
     unIndent`
       <template>
-          <div
-              v-on:a="
-                  class
-                      A
-                  {
-                      foo(){}
-                      bar(){}
-                  }
-              "
-              v-on:b="
-                  class
-                      A
-                      extends
-                          B
-                  {
-                      ;
-                      foo(){}
-                      ;
-                      bar(){}
-                      ;
-                  }
-              "
-              v-on:b="
-                  !class
-                      extends
-                          B
-                  {
-                      ;
-                      foo(){}
-                      ;
-                      bar(){}
-                      ;
-                  }
-              "
-          ></div>
+        <div
+          v-on:a="
+            class
+              A
+            {
+              foo(){}
+              bar(){}
+            }
+          "
+          v-on:b="
+            class
+              A
+              extends
+                B
+            {
+              ;
+              foo(){}
+              ;
+              bar(){}
+              ;
+            }
+          "
+          v-on:b="
+            !class
+              extends
+                B
+            {
+              ;
+              foo(){}
+              ;
+              bar(){}
+              ;
+            }
+          "
+        ></div>
       </template>
     `,
 
     // ConditionalExpression
     unIndent`
       <template>
-          <div
-              v-bind:a="
-                  a
-                      ? b
-                      : c
-              "
-              v-bind:b="
-                  a ?
-                      b :
-                      c
-              "
-              v-bind:c="
-                  a
-                      ?
-                          b
-                      :
-                          c
-              "
-              v-bind:d="
-                  a
-                      ? b
-                      : c
-                          ? d
-                          : e
-              "
-              v-bind:e="
-                  a ? 1 :
-                  b ? 2 :
-                  /*else*/ 3
-              "
-          ></div>
+        <div
+          v-bind:a="
+            a
+              ? b
+              : c
+          "
+          v-bind:b="
+            a ?
+              b :
+              c
+          "
+          v-bind:c="
+            a
+              ?
+                b
+              :
+                c
+          "
+          v-bind:d="
+            a
+              ? b
+              : c
+                ? d
+                : e
+          "
+          v-bind:e="
+            a ? 1 :
+            b ? 2 :
+            /*else*/ 3
+          "
+        ></div>
       </template>
     `,
 
     // DoWhileStatement
     unIndent`
       <template>
-          <div
-              v-on:a="
-                  do
-                      ;
-                  while
-                      (
-                          a
-                      )
-              "
-              v-on:b="
-                  do
-                  {
-                      ;
-                  }
-                  while
-                      (
-                          a
-                      )
-              "
-              v-on:c="
-                  do {
-                      ;
-                  } while (
-                      a
-                  )
-              "
-          ></div>
+        <div
+          v-on:a="
+            do
+              ;
+            while
+              (
+                a
+              )
+          "
+          v-on:b="
+            do
+            {
+              ;
+            }
+            while
+              (
+                a
+              )
+          "
+          v-on:c="
+            do {
+              ;
+            } while (
+              a
+            )
+          "
+        ></div>
       </template>
     `,
 
     // ForInStatement, ForOfStatement
     unIndent`
       <template>
-          <div
-              v-on:a="
-                  for
-                      (
-                          a
-                              in
-                              b
-                      )
-                  {
-                      ;
-                  }
-              "
-              v-on:b="
-                  for (
-                      a
-                          of
-                          b
-                  )
-                  {
-                      ;
-                  }
-              "
-              v-on:c="
-                  for (
-                      a
-                          in
-                          b
-                  ) {
-                      ;
-                  }
-              "
-          ></div>
+        <div
+          v-on:a="
+            for
+              (
+                a
+                  in
+                  b
+              )
+            {
+              ;
+            }
+          "
+          v-on:b="
+            for (
+              a
+                of
+                b
+            )
+            {
+              ;
+            }
+          "
+          v-on:c="
+            for (
+              a
+                in
+                b
+            ) {
+              ;
+            }
+          "
+        ></div>
       </template>
     `,
 
     // ForStatement
     unIndent`
       <template>
-          <div
-              v-on:a="
-                  for
-                      (
-                          a
-                          ;
-                          b
-                          ;
-                          c
-                      )
-                  {
-                      ;
-                  }
-              "
-              v-on:b="
-                  for
-                      (
-                          ;
-                          b
-                          ;
-                          c
-                      )
-                  {
-                      ;
-                  }
-              "
-              v-on:c="
-                  for
-                      (
-                          a
-                          ;
-                          ;
-                          c
-                      )
-                  {
-                      ;
-                  }
-              "
-              v-on:d="
-                  for
-                      (
-                          a
-                          ;
-                          d
-                          ;
-                      )
-                  {
-                      ;
-                  }
-              "
-              v-on:e="
-                  for
-                      (
-                          ;
-                          ;
-                      )
-                  {
-                      ;
-                  }
-              "
-          ></div>
+        <div
+          v-on:a="
+            for
+              (
+                a
+                ;
+                b
+                ;
+                c
+              )
+            {
+              ;
+            }
+          "
+          v-on:b="
+            for
+              (
+                ;
+                b
+                ;
+                c
+              )
+            {
+              ;
+            }
+          "
+          v-on:c="
+            for
+              (
+                a
+                ;
+                ;
+                c
+              )
+            {
+              ;
+            }
+          "
+          v-on:d="
+            for
+              (
+                a
+                ;
+                d
+                ;
+              )
+            {
+              ;
+            }
+          "
+          v-on:e="
+            for
+              (
+                ;
+                ;
+              )
+            {
+              ;
+            }
+          "
+        ></div>
       </template>
     `,
 
     // FunctionDeclaration, FunctionExpression
     unIndent`
       <template>
-          <div
-              v-on:a="
-                  function
-                      foo
-                      (
-                          a
-                          ,
-                          b
-                      )
-                  {
-                      ;
-                  }
-              "
-              v-on:b="
-                  !function
-                      (
-                          a
-                          ,
-                          b
-                      )
-                  {
-                      ;
-                  }
-              "
-              v-on:c="
-                  function
-                      *
-                      foo
-                      (
-                          a
-                          ,
-                          b
-                      )
-                  {
-                      ;
-                  }
-              "
-              v-on:d="
-                  !function
-                      *
-                      (
-                          a
-                          ,
-                          b
-                      )
-                  {
-                      ;
-                  }
-              "
-              v-on:e="
-                  async function
-                      foo
-                      (
-                          a
-                          ,
-                          b
-                      )
-                  {
-                      ;
-                  }
-              "
-          ></div>
+        <div
+          v-on:a="
+            function
+              foo
+              (
+                a
+                ,
+                b
+              )
+            {
+              ;
+            }
+          "
+          v-on:b="
+            !function
+              (
+                a
+                ,
+                b
+              )
+            {
+              ;
+            }
+          "
+          v-on:c="
+            function
+              *
+              foo
+              (
+                a
+                ,
+                b
+              )
+            {
+              ;
+            }
+          "
+          v-on:d="
+            !function
+              *
+              (
+                a
+                ,
+                b
+              )
+            {
+              ;
+            }
+          "
+          v-on:e="
+            async function
+              foo
+              (
+                a
+                ,
+                b
+              )
+            {
+              ;
+            }
+          "
+        ></div>
       </template>
     `,
 
     // IfStatement
     unIndent`
       <template>
-          <div
-              v-on:a="
-                  if
-                      (
-                          a
-                      )
-                  {
-                      ;
-                  }
-              "
-              v-on:b="
-                  if
-                      (
-                          a
-                      )
-                  {
-                      ;
-                  }
-                  else
-                  {
-                      ;
-                  }
-              "
-              v-on:c="
-                  if (a)
-                      ;
-                  else if (b)
-                      ;
-                  else
-                      ;
-              "
-          ></div>
+        <div
+          v-on:a="
+            if
+              (
+                a
+              )
+            {
+              ;
+            }
+          "
+          v-on:b="
+            if
+              (
+                a
+              )
+            {
+              ;
+            }
+            else
+            {
+              ;
+            }
+          "
+          v-on:c="
+            if (a)
+              ;
+            else if (b)
+              ;
+            else
+              ;
+          "
+        ></div>
       </template>
     `,
 
     // MemberExpression, MetaProperty
     unIndent`
       <template>
-          <div
-              v-bind:a="
-                  obj
-                      .aaa
-                      .bbb
-                      .ccc
-              "
-              v-bind:b="
-                  obj.
-                      aaa.
-                      bbb.
-                      ccc
-              "
-              v-bind:c="
-                  obj
-                      [
-                          0
-                      ]
-                      [
-                          1
-                      ]
-                      [
-                          2
-                      ]
-              "
-              v-bind:d="
-                  function wrap() {
-                      new
-                          .
-                          target
-                  }
-              "
-          ></div>
+        <div
+          v-bind:a="
+            obj
+              .aaa
+              .bbb
+              .ccc
+          "
+          v-bind:b="
+            obj.
+              aaa.
+              bbb.
+              ccc
+          "
+          v-bind:c="
+            obj
+              [
+                0
+              ]
+              [
+                1
+              ]
+              [
+                2
+              ]
+          "
+          v-bind:d="
+            function wrap() {
+              new
+                .
+                target
+            }
+          "
+        ></div>
       </template>
     `,
 
     // MethodDefinition, Property
     unIndent`
       <template>
-          <div
-              v-bind:a="{
-                  aaa
-                      :
-                      1
-                  ,
-                  bbb
-                      (
-                          a
-                          ,
-                          b
-                      )
-                  {
-                      ;
-                  }
-                  ,
-                  get
-                  ccc
-                      (
-                      )
-                  {
-                      ;
-                  },
-                  [
-                      d
-                  ]
-                      :
-                      1,
-                  get
-                  [
-                      e
-                  ]
-                      (
-                      )
-                  {
-                      ;
-                  }
-              }"
-              v-bind:b="class {
-                  bbb
-                      (
-                          a
-                          ,
-                          b
-                      )
-                  {
-                      ;
-                  }
-                  static
-                  get
-                  ccc
-                      (
-                      )
-                  {
-                      ;
-                  }
-                  [
-                      d
-                  ]
-                      (
-                      )
-                  {
-                      ;
-                  }
-                  get
-                  [
-                      e
-                  ]
-                      (
-                      )
-                  {
-                      ;
-                  }
-              }"
-          ></div>
+        <div
+          v-bind:a="{
+            aaa
+              :
+              1
+            ,
+            bbb
+              (
+                a
+                ,
+                b
+              )
+            {
+              ;
+            }
+            ,
+            get
+            ccc
+              (
+              )
+            {
+              ;
+            },
+            [
+              d
+            ]
+              :
+              1,
+            get
+            [
+              e
+            ]
+              (
+              )
+            {
+              ;
+            }
+          }"
+          v-bind:b="class {
+            bbb
+              (
+                a
+                ,
+                b
+              )
+            {
+              ;
+            }
+            static
+            get
+            ccc
+              (
+              )
+            {
+              ;
+            }
+            [
+              d
+            ]
+              (
+              )
+            {
+              ;
+            }
+            get
+            [
+              e
+            ]
+              (
+              )
+            {
+              ;
+            }
+          }"
+        ></div>
       </template>
     `,
 
     // NewExpression
     unIndent`
       <template>
-          <div
-              v-bind:a="
-                  new
-                      foo
-                          (
-                              a,
-                              b
-                          )
-              "
-              v-bind:b="
-                  new (
-                      foo
-                  )
-              "
-              v-bind:c="
-                  new (
-                      foo
-                  )(
-                      a
-                  )
-              "
-              v-bind:d="
-                  new foo(
-                      a
-                  )
-              "
-              v-bind:d="
-                  new foo(a,
-                          b)
-              "
-          ></div>
+        <div
+          v-bind:a="
+            new
+              foo
+                (
+                  a,
+                  b
+                )
+          "
+          v-bind:b="
+            new (
+              foo
+            )
+          "
+          v-bind:c="
+            new (
+              foo
+            )(
+              a
+            )
+          "
+          v-bind:d="
+            new foo(
+              a
+            )
+          "
+          v-bind:d="
+            new foo(a,
+                    b)
+          "
+        ></div>
       </template>
     `,
 
     // ObjectExpression
     unIndent`
       <template>
-          <div v-bind:a="
-              {
-                  a: 1
-                  ,
-                  b: 2
-                  ,
-                  c: {
-                      ca: 3
-                  },
-                  d: { da: 4,
-                       db: 5 }
-              }
-          "></div>
+        <div v-bind:a="
+          {
+            a: 1
+            ,
+            b: 2
+            ,
+            c: {
+              ca: 3
+            },
+            d: { da: 4,
+                 db: 5 }
+          }
+        "></div>
       </template>
     `,
 
     // RestElement / SpreadElement
     unIndent`
       <template>
-          <div
-              v-bind:a="
-                  [
-                      a,
-                      ...
-                          b
-                  ] = [
-                      a,
-                      ...
-                          b
-                  ]
-              "
-          ></div>
+        <div
+          v-bind:a="
+            [
+              a,
+              ...
+                b
+            ] = [
+              a,
+              ...
+                b
+            ]
+          "
+        ></div>
       </template>
     `,
 
     // SequenceExpression
     unIndent`
       <template>
-          <div
-              v-bind:a="
-                  1
-                  ,
-                  2
-                  ,
-                  3
-              "
-              v-bind:b="
-                  1,
-                  2,
-                  3
-              "
-              v-bind:c="
-                  a +
-                      b,
-                  2
-              "
-          ></div>
+        <div
+          v-bind:a="
+            1
+            ,
+            2
+            ,
+            3
+          "
+          v-bind:b="
+            1,
+            2,
+            3
+          "
+          v-bind:c="
+            a +
+              b,
+            2
+          "
+        ></div>
       </template>
     `,
     unIndent`
       <template>
-          {{
-              a,
-              b,
-              c
-          }}
+        {{
+          a,
+          b,
+          c
+        }}
       </template>
     `,
 
     // SwitchStatement, SwitchCase
     unIndent`
       <template>
-          <div
-              v-on:a="
-                  switch
-                      (
-                          a
-                      )
-                  {
-                  case
-                      1
-                      :
-                      foo;
-                  case (
-                      2
-                  ):
-                      foo;
-                  case 3:
-                      foo;
-                  case 4:
-                  {
-                      foo;
-                  }
-                  default
-                      :
-                      foo;
-                  }
-              "
-              v-on:b="
-                  switch (a) {
-                  case 1:
-                      foo;
-                  }
-              "
-          ></div>
+        <div
+          v-on:a="
+            switch
+              (
+                a
+              )
+            {
+            case
+              1
+              :
+              foo;
+            case (
+              2
+            ):
+              foo;
+            case 3:
+              foo;
+            case 4:
+            {
+              foo;
+            }
+            default
+              :
+              foo;
+            }
+          "
+          v-on:b="
+            switch (a) {
+            case 1:
+              foo;
+            }
+          "
+        ></div>
       </template>
     `,
 
     // TaggedTemplateExpression
     unIndent`
       <template>
-          <div
-              v-bind:a="
-                  foo\`test\`
-              "
-              v-bind:b="
-                  foo
-                      \`test\`
-              "
-              v-bind:c="
-                  (
-                      foo
-                  )
-                      \`test\`
-              "
-          ></div>
+        <div
+          v-bind:a="
+            foo\`test\`
+          "
+          v-bind:b="
+            foo
+              \`test\`
+          "
+          v-bind:c="
+            (
+              foo
+            )
+              \`test\`
+          "
+        ></div>
       </template>
     `,
 
     // TemplateLiteral
     unIndent`
       <template>
-          <div
-              v-bind:a="
-                  \`hello, \${
-                      aaa
-                  }, \${
-                      (
-                          bbb
-                      )
-                  }\`
-              "
-              v-bind:b="
-                  \`
-                  test
-                test
-                    test
-                  \`
-              "
-          ></div>
-      </template>
-    `,
-
-    // ReturnStatement
-    unIndent`
-      <template>
-          <div
-              v-on:a="
-                  return
-                  ;
-              "
-              v-on:b="
-                  return a
-                  ;
-              "
-          ></div>
+        <div
+          v-bind:a="
+            \`hello, \${
+              aaa
+            }, \${
+              (
+                bbb
+              )
+            }\`
+          "
+          v-bind:b="
+            \`
+            test
+          test
+            test
+            \`
+          "
+        ></div>
       </template>
-    `,
-
-    // TryStatement / CatchClause
-    unIndent`
-      <template>
-          <div
-              v-on:a="
-                  try
-                  {
-                  }
-                  catch
-                      (
-                          err
-                      )
-                  {
-                  }
-              "
-              v-on:b="
-                  try
-                  {
-                  }
-                  finally
-                  {
-                  }
-              "
-              v-on:c="
-                  try
-                  {
-                  }
-                  catch
-                      (
-                          err
-                      )
-                  {
-                  }
-                  finally
-                  {
-                  }
-              "
-          ></div>
+    `,
+
+    // ReturnStatement
+    unIndent`
+      <template>
+        <div
+          v-on:a="
+            return
+            ;
+          "
+          v-on:b="
+            return a
+            ;
+          "
+        ></div>
+      </template>
+    `,
+
+    // TryStatement / CatchClause
+    unIndent`
+      <template>
+        <div
+          v-on:a="
+            try
+            {
+            }
+            catch
+              (
+                err
+              )
+            {
+            }
+          "
+          v-on:b="
+            try
+            {
+            }
+            finally
+            {
+            }
+          "
+          v-on:c="
+            try
+            {
+            }
+            catch
+              (
+                err
+              )
+            {
+            }
+            finally
+            {
+            }
+          "
+        ></div>
       </template>
     `,
 
     // UnaryExpression
     unIndent`
       <template>
-          <div
-              v-bind:a="
-                  +
-                      a
-              "
-          ></div>
+        <div
+          v-bind:a="
+            +
+              a
+          "
+        ></div>
       </template>
     `,
 
     // UpdateExpression
     unIndent`
       <template>
-          <div
-              v-bind:a="
-                  ++
-                      a
-              "
-          ></div>
+        <div
+          v-bind:a="
+            ++
+              a
+          "
+        ></div>
       </template>
     `,
 
     // VariableDeclaration, VariableDeclarator
     unIndent`
       <template>
-          <div
-              v-on:a="
-                  var aaa
-                  var bbb = 1,
-                      ccc = 2
-                  const ddd = 3,
-                        eee = 4
-              "
-              v-on:b="
-                  var aaa
-                          =
-                          1,
-                      ccc
-                          =
-                          2
-                  const ddd 
-                            =
-                            3,
-                        eee
-                            =
-                            4
-              "
-              v-on:c="
-                  var aaa = {
-                      test: 1
+        <div
+          v-on:a="
+            var aaa
+            var bbb = 1,
+                ccc = 2
+            const ddd = 3,
+                  eee = 4
+          "
+          v-on:b="
+            var aaa
+                  =
+                  1,
+                ccc
+                  =
+                  2
+            const ddd
+                    =
+                    3,
+                  eee
+                    =
+                    4
+          "
+          v-on:c="
+            var aaa = {
+              test: 1
+            }
+            var bbb = {
+                  test: 1
+                },
+                ccc = {
+                  test: 1
+                }
+            const ddd = {
+                    test: 1
+                  },
+                  eee = (a) => {
+                    foo(a)
                   }
-                  var bbb = {
-                          test: 1
-                      },
-                      ccc = {
-                          test: 1
-                      }
-                  const ddd = {
-                            test: 1
-                        },
-                        eee = (a) => {
-                            foo(a)
-                        }
-              "
-          ></div>
+          "
+        ></div>
       </template>
     `,
 
     // YieldExpression
     unIndent`
       <template>
-          <div
-              v-bind:a="
-                  function*(){
-                      yield
-                  }
-              "
-              v-bind:b="
-                  function*(){
-                      yield
-                      a
-                  }
-              "
-              v-bind:c="
-                  function*(){
-                      yield*
-                          a
-                  }
-              "
-          ></div>
+        <div
+          v-bind:a="
+            function*(){
+              yield
+            }
+          "
+          v-bind:b="
+            function*(){
+              yield
+              a
+            }
+          "
+          v-bind:c="
+            function*(){
+              yield*
+                a
+            }
+          "
+        ></div>
       </template>
     `,
 
@@ -1272,22 +1272,22 @@ tester.run('html-indent', rule, {
     // Comments
     unIndent`
       <template>
-          <!-- comment -->
-          {{
-              // comment
-              // comment
-              message
-          }}
+        <!-- comment -->
+        {{
+          // comment
+          // comment
+          message
+        }}
       </template>
     `,
     unIndent`
       <template>
-          {{
-              /*
-               * comment
-               */
-              message
-          }}
+        {{
+          /*
+           * comment
+           */
+          message
+        }}
       </template>
     `,
 
@@ -1347,6 +1347,7 @@ tester.run('html-indent', rule, {
             </div>
         </template>
       `,
+      options: [4],
       errors: [
         { message: 'Expected indentation of 8 spaces but found 6 spaces.', line: 3 },
         { message: 'Expected indentation of 8 spaces but found 6 spaces.', line: 4 },
@@ -1411,6 +1412,7 @@ tester.run('html-indent', rule, {
             </div>
         </template>
       `,
+      options: [4],
       errors: [
         { message: 'Expected indentation of 12 spaces but found 10 spaces.', line: 4 },
         { message: 'Expected indentation of 8 spaces but found 6 spaces.', line: 5 },
@@ -1471,6 +1473,7 @@ tester.run('html-indent', rule, {
             ></div>
         </template>
       `,
+      options: [4],
       errors: [
         { message: 'Expected indentation of 12 spaces but found 10 spaces.', line: 4 },
         { message: 'Expected indentation of 16 spaces but found 10 spaces.', line: 5 },
@@ -1519,6 +1522,7 @@ tester.run('html-indent', rule, {
             ></div>
         </template>
       `,
+      options: [4],
       errors: [
         { message: 'Expected indentation of 12 spaces but found 10 spaces.', line: 4 },
         { message: 'Expected indentation of 12 spaces but found 10 spaces.', line: 7 },
@@ -1543,6 +1547,7 @@ tester.run('html-indent', rule, {
             ccc
         </template>
       `,
+      options: [4],
       errors: [
         { message: 'Expected indentation of 4 spaces but found 2 spaces.', line: 2 },
         { message: 'Expected indentation of 4 spaces but found 2 spaces.', line: 3 }
@@ -1568,6 +1573,7 @@ tester.run('html-indent', rule, {
             }}
         </template>
       `,
+      options: [4],
       errors: [
         { message: 'Expected indentation of 4 spaces but found 2 spaces.', line: 2 },
         { message: 'Expected indentation of 4 spaces but found 2 spaces.', line: 3 },
@@ -1613,6 +1619,7 @@ tester.run('html-indent', rule, {
             "></div>
         </template>
       `,
+      options: [4],
       errors: [
         { message: 'Expected indentation of 8 spaces but found 6 spaces.', line: 3 },
         { message: 'Expected indentation of 12 spaces but found 6 spaces.', line: 4 },
@@ -1700,6 +1707,7 @@ tester.run('html-indent', rule, {
             ></div>
         </template>
       `,
+      options: [4],
       errors: [
         { message: 'Expected indentation of 12 spaces but found 10 spaces.', line: 4 },
         { message: 'Expected indentation of 12 spaces but found 10 spaces.', line: 5 },
@@ -1779,6 +1787,7 @@ tester.run('html-indent', rule, {
             ></div>
         </template>
       `,
+      options: [4],
       errors: [
         { message: 'Expected indentation of 12 spaces but found 10 spaces.', line: 4 },
         { message: 'Expected indentation of 16 spaces but found 10 spaces.', line: 5 },
@@ -1822,6 +1831,7 @@ tester.run('html-indent', rule, {
             ></div>
         </template>
       `,
+      options: [4],
       errors: [
         { message: 'Expected indentation of 16 spaces but found 14 spaces.', line: 5 },
         { message: 'Expected indentation of 20 spaces but found 14 spaces.', line: 6 }
@@ -1864,6 +1874,7 @@ tester.run('html-indent', rule, {
             ></div>
         </template>
       `,
+      options: [4],
       errors: [
         { message: 'Expected indentation of 16 spaces but found 10 spaces.', line: 5 },
         { message: 'Expected indentation of 16 spaces but found 10 spaces.', line: 6 },
@@ -1936,6 +1947,7 @@ tester.run('html-indent', rule, {
             ></div>
         </template>
       `,
+      options: [4],
       errors: [
         { message: 'Expected indentation of 12 spaces but found 10 spaces.', line: 4 },
         { message: 'Expected indentation of 12 spaces but found 10 spaces.', line: 5 },
@@ -2036,6 +2048,7 @@ tester.run('html-indent', rule, {
             ></div>
         </template>
       `,
+      options: [4],
       errors: [
         { message: 'Expected indentation of 12 spaces but found 10 spaces.', line: 4 },
         { message: 'Expected indentation of 16 spaces but found 10 spaces.', line: 5 },
@@ -2139,6 +2152,7 @@ tester.run('html-indent', rule, {
             ></div>
         </template>
       `,
+      options: [4],
       errors: [
         { message: 'Expected indentation of 12 spaces but found 10 spaces.', line: 4 },
         { message: 'Expected indentation of 16 spaces but found 10 spaces.', line: 5 },
@@ -2226,6 +2240,7 @@ tester.run('html-indent', rule, {
             ></div>
         </template>
       `,
+      options: [4],
       errors: [
         { message: 'Expected indentation of 12 spaces but found 10 spaces.', line: 4 },
         { message: 'Expected indentation of 16 spaces but found 10 spaces.', line: 5 },
@@ -2323,6 +2338,7 @@ tester.run('html-indent', rule, {
             ></div>
         </template>
       `,
+      options: [4],
       errors: [
         { message: 'Expected indentation of 12 spaces but found 10 spaces.', line: 4 },
         { message: 'Expected indentation of 16 spaces but found 10 spaces.', line: 5 },
@@ -2483,6 +2499,7 @@ tester.run('html-indent', rule, {
             ></div>
         </template>
       `,
+      options: [4],
       errors: [
         { message: 'Expected indentation of 12 spaces but found 10 spaces.', line: 4 },
         { message: 'Expected indentation of 16 spaces but found 10 spaces.', line: 5 },
@@ -2670,6 +2687,7 @@ tester.run('html-indent', rule, {
             ></div>
         </template>
       `,
+      options: [4],
       errors: [
         { message: 'Expected indentation of 12 spaces but found 10 spaces.', line: 4 },
         { message: 'Expected indentation of 16 spaces but found 10 spaces.', line: 5 },
@@ -2798,6 +2816,7 @@ tester.run('html-indent', rule, {
             ></div>
         </template>
       `,
+      options: [4],
       errors: [
         { message: 'Expected indentation of 12 spaces but found 10 spaces.', line: 4 },
         { message: 'Expected indentation of 16 spaces but found 10 spaces.', line: 5 },
@@ -2902,6 +2921,7 @@ tester.run('html-indent', rule, {
             ></div>
         </template>
       `,
+      options: [4],
       errors: [
         { message: 'Expected indentation of 12 spaces but found 10 spaces.', line: 4 },
         { message: 'Expected indentation of 16 spaces but found 10 spaces.', line: 5 },
@@ -3087,6 +3107,7 @@ tester.run('html-indent', rule, {
             ></div>
         </template>
       `,
+      options: [4],
       errors: [
         { message: 'Expected indentation of 12 spaces but found 10 spaces.', line: 4 },
         { message: 'Expected indentation of 16 spaces but found 10 spaces.', line: 5 },
@@ -3238,6 +3259,7 @@ tester.run('html-indent', rule, {
             ></div>
         </template>
       `,
+      options: [4],
       errors: [
         { message: 'Expected indentation of 12 spaces but found 10 spaces.', line: 4 },
         { message: 'Expected indentation of 16 spaces but found 10 spaces.', line: 5 },
@@ -3298,6 +3320,7 @@ tester.run('html-indent', rule, {
             "></div>
         </template>
       `,
+      options: [4],
       errors: [
         { message: 'Expected indentation of 8 spaces but found 6 spaces.', line: 3 },
         { message: 'Expected indentation of 12 spaces but found 6 spaces.', line: 4 },
@@ -3361,6 +3384,7 @@ tester.run('html-indent', rule, {
             ></div>
         </template>
       `,
+      options: [4],
       errors: [
         { message: 'Expected indentation of 12 spaces but found 10 spaces.', line: 4 },
         { message: 'Expected indentation of 12 spaces but found 10 spaces.', line: 5 },
@@ -3378,26 +3402,26 @@ tester.run('html-indent', rule, {
     {
       code: unIndent`
         <template>
-            {{
-            a,
-            b,
-            c
-            }}
+          {{
+          a,
+          b,
+          c
+          }}
         </template>
       `,
       output: unIndent`
         <template>
-            {{
-                a,
-                b,
-                c
-            }}
+          {{
+            a,
+            b,
+            c
+          }}
         </template>
       `,
       errors: [
-        { message: 'Expected indentation of 8 spaces but found 4 spaces.', line: 3 },
-        { message: 'Expected indentation of 8 spaces but found 4 spaces.', line: 4 },
-        { message: 'Expected indentation of 8 spaces but found 4 spaces.', line: 5 }
+        { message: 'Expected indentation of 4 spaces but found 2 spaces.', line: 3 },
+        { message: 'Expected indentation of 4 spaces but found 2 spaces.', line: 4 },
+        { message: 'Expected indentation of 4 spaces but found 2 spaces.', line: 5 }
       ]
     },
 
@@ -3477,6 +3501,7 @@ tester.run('html-indent', rule, {
             ></div>
         </template>
       `,
+      options: [4],
       errors: [
         { message: 'Expected indentation of 12 spaces but found 10 spaces.', line: 4 },
         { message: 'Expected indentation of 16 spaces but found 10 spaces.', line: 5 },
@@ -3548,6 +3573,7 @@ tester.run('html-indent', rule, {
             ></div>
         </template>
       `,
+      options: [4],
       errors: [
         { message: 'Expected indentation of 12 spaces but found 10 spaces.', line: 4 },
         { message: 'Expected indentation of 12 spaces but found 10 spaces.', line: 7 },
@@ -3605,6 +3631,7 @@ tester.run('html-indent', rule, {
             ></div>
         </template>
       `,
+      options: [4],
       errors: [
         { message: 'Expected indentation of 12 spaces but found 10 spaces.', line: 4 },
         { message: 'Expected indentation of 16 spaces but found 10 spaces.', line: 5 },
@@ -3653,6 +3680,7 @@ tester.run('html-indent', rule, {
             ></div>
         </template>
       `,
+      options: [4],
       errors: [
         { message: 'Expected indentation of 16 spaces but found 14 spaces.', line: 6 },
         { message: 'Expected indentation of 20 spaces but found 14 spaces.', line: 7 },
@@ -3691,6 +3719,7 @@ tester.run('html-indent', rule, {
             ></div>
         </template>
       `,
+      options: [4],
       errors: [
         { message: 'Expected indentation of 12 spaces but found 10 spaces.', line: 4 },
         { message: 'Expected indentation of 12 spaces but found 10 spaces.', line: 5 },
@@ -3705,37 +3734,37 @@ tester.run('html-indent', rule, {
         <template>
             <div
                 v-on:a="
-                  try
-                  {
-                  }
-                  catch
-                  (
-                  err
-                  )
-                  {
-                  }
+                try
+                {
+                }
+                catch
+                (
+                err
+                )
+                {
+                }
                 "
                 v-on:b="
-                  try
-                  {
-                  }
-                  finally
-                  {
-                  }
+                try
+                {
+                }
+                finally
+                {
+                }
                 "
                 v-on:c="
-                  try
-                  {
-                  }
-                  catch
-                  (
-                  err
-                  )
-                  {
-                  }
-                  finally
-                  {
-                  }
+                try
+                {
+                }
+                catch
+                (
+                err
+                )
+                {
+                }
+                finally
+                {
+                }
                 "
             ></div>
         </template>
@@ -3779,34 +3808,35 @@ tester.run('html-indent', rule, {
             ></div>
         </template>
       `,
+      options: [4],
       errors: [
-        { message: 'Expected indentation of 12 spaces but found 10 spaces.', line: 4 },
-        { message: 'Expected indentation of 12 spaces but found 10 spaces.', line: 5 },
-        { message: 'Expected indentation of 12 spaces but found 10 spaces.', line: 6 },
-        { message: 'Expected indentation of 12 spaces but found 10 spaces.', line: 7 },
-        { message: 'Expected indentation of 16 spaces but found 10 spaces.', line: 8 },
-        { message: 'Expected indentation of 20 spaces but found 10 spaces.', line: 9 },
-        { message: 'Expected indentation of 16 spaces but found 10 spaces.', line: 10 },
-        { message: 'Expected indentation of 12 spaces but found 10 spaces.', line: 11 },
-        { message: 'Expected indentation of 12 spaces but found 10 spaces.', line: 12 },
-        { message: 'Expected indentation of 12 spaces but found 10 spaces.', line: 15 },
-        { message: 'Expected indentation of 12 spaces but found 10 spaces.', line: 16 },
-        { message: 'Expected indentation of 12 spaces but found 10 spaces.', line: 17 },
-        { message: 'Expected indentation of 12 spaces but found 10 spaces.', line: 18 },
-        { message: 'Expected indentation of 12 spaces but found 10 spaces.', line: 19 },
-        { message: 'Expected indentation of 12 spaces but found 10 spaces.', line: 20 },
-        { message: 'Expected indentation of 12 spaces but found 10 spaces.', line: 23 },
-        { message: 'Expected indentation of 12 spaces but found 10 spaces.', line: 24 },
-        { message: 'Expected indentation of 12 spaces but found 10 spaces.', line: 25 },
-        { message: 'Expected indentation of 12 spaces but found 10 spaces.', line: 26 },
-        { message: 'Expected indentation of 16 spaces but found 10 spaces.', line: 27 },
-        { message: 'Expected indentation of 20 spaces but found 10 spaces.', line: 28 },
-        { message: 'Expected indentation of 16 spaces but found 10 spaces.', line: 29 },
-        { message: 'Expected indentation of 12 spaces but found 10 spaces.', line: 30 },
-        { message: 'Expected indentation of 12 spaces but found 10 spaces.', line: 31 },
-        { message: 'Expected indentation of 12 spaces but found 10 spaces.', line: 32 },
-        { message: 'Expected indentation of 12 spaces but found 10 spaces.', line: 33 },
-        { message: 'Expected indentation of 12 spaces but found 10 spaces.', line: 34 }
+        { message: 'Expected indentation of 12 spaces but found 8 spaces.', line: 4 },
+        { message: 'Expected indentation of 12 spaces but found 8 spaces.', line: 5 },
+        { message: 'Expected indentation of 12 spaces but found 8 spaces.', line: 6 },
+        { message: 'Expected indentation of 12 spaces but found 8 spaces.', line: 7 },
+        { message: 'Expected indentation of 16 spaces but found 8 spaces.', line: 8 },
+        { message: 'Expected indentation of 20 spaces but found 8 spaces.', line: 9 },
+        { message: 'Expected indentation of 16 spaces but found 8 spaces.', line: 10 },
+        { message: 'Expected indentation of 12 spaces but found 8 spaces.', line: 11 },
+        { message: 'Expected indentation of 12 spaces but found 8 spaces.', line: 12 },
+        { message: 'Expected indentation of 12 spaces but found 8 spaces.', line: 15 },
+        { message: 'Expected indentation of 12 spaces but found 8 spaces.', line: 16 },
+        { message: 'Expected indentation of 12 spaces but found 8 spaces.', line: 17 },
+        { message: 'Expected indentation of 12 spaces but found 8 spaces.', line: 18 },
+        { message: 'Expected indentation of 12 spaces but found 8 spaces.', line: 19 },
+        { message: 'Expected indentation of 12 spaces but found 8 spaces.', line: 20 },
+        { message: 'Expected indentation of 12 spaces but found 8 spaces.', line: 23 },
+        { message: 'Expected indentation of 12 spaces but found 8 spaces.', line: 24 },
+        { message: 'Expected indentation of 12 spaces but found 8 spaces.', line: 25 },
+        { message: 'Expected indentation of 12 spaces but found 8 spaces.', line: 26 },
+        { message: 'Expected indentation of 16 spaces but found 8 spaces.', line: 27 },
+        { message: 'Expected indentation of 20 spaces but found 8 spaces.', line: 28 },
+        { message: 'Expected indentation of 16 spaces but found 8 spaces.', line: 29 },
+        { message: 'Expected indentation of 12 spaces but found 8 spaces.', line: 30 },
+        { message: 'Expected indentation of 12 spaces but found 8 spaces.', line: 31 },
+        { message: 'Expected indentation of 12 spaces but found 8 spaces.', line: 32 },
+        { message: 'Expected indentation of 12 spaces but found 8 spaces.', line: 33 },
+        { message: 'Expected indentation of 12 spaces but found 8 spaces.', line: 34 }
       ]
     },
 
@@ -3814,27 +3844,27 @@ tester.run('html-indent', rule, {
     {
       code: unIndent`
         <template>
-            <div
-                v-bind:a="
-                  +
-                  a
-                "
-            ></div>
+          <div
+            v-bind:a="
+                +
+              a
+            "
+          ></div>
         </template>
       `,
       output: unIndent`
         <template>
-            <div
-                v-bind:a="
-                    +
-                        a
-                "
-            ></div>
+          <div
+            v-bind:a="
+              +
+                a
+            "
+          ></div>
         </template>
       `,
       errors: [
-        { message: 'Expected indentation of 12 spaces but found 10 spaces.', line: 4 },
-        { message: 'Expected indentation of 16 spaces but found 10 spaces.', line: 5 }
+        { message: 'Expected indentation of 6 spaces but found 8 spaces.', line: 4 },
+        { message: 'Expected indentation of 8 spaces but found 6 spaces.', line: 5 }
       ]
     },
 
@@ -3842,27 +3872,27 @@ tester.run('html-indent', rule, {
     {
       code: unIndent`
         <template>
-            <div
-                v-bind:a="
-                  ++
-                  a
-                "
-            ></div>
+          <div
+            v-bind:a="
+                ++
+              a
+            "
+          ></div>
         </template>
       `,
       output: unIndent`
         <template>
-            <div
-                v-bind:a="
-                    ++
-                        a
-                "
-            ></div>
+          <div
+            v-bind:a="
+              ++
+                a
+            "
+          ></div>
         </template>
       `,
       errors: [
-        { message: 'Expected indentation of 12 spaces but found 10 spaces.', line: 4 },
-        { message: 'Expected indentation of 16 spaces but found 10 spaces.', line: 5 }
+        { message: 'Expected indentation of 6 spaces but found 8 spaces.', line: 4 },
+        { message: 'Expected indentation of 8 spaces but found 6 spaces.', line: 5 }
       ]
     },
 
@@ -3885,7 +3915,7 @@ tester.run('html-indent', rule, {
                   ccc
                   =
                   2
-                  const ddd 
+                  const ddd
                   =
                   3,
                   eee
@@ -3929,7 +3959,7 @@ tester.run('html-indent', rule, {
                         ccc
                             =
                             2
-                    const ddd 
+                    const ddd
                               =
                               3,
                           eee
@@ -3956,6 +3986,7 @@ tester.run('html-indent', rule, {
             ></div>
         </template>
       `,
+      options: [4],
       errors: [
         { message: 'Expected indentation of 12 spaces but found 10 spaces.', line: 4 },
         { message: 'Expected indentation of 12 spaces but found 10 spaces.', line: 5 },
@@ -3996,56 +4027,56 @@ tester.run('html-indent', rule, {
     {
       code: unIndent`
         <template>
-            <div
-                v-bind:a="
-                    function*(){
-                      yield
-                    }
-                "
-                v-bind:b="
-                    function*(){
-                      yield
-                      a
-                    }
-                "
-                v-bind:c="
-                    function*(){
-                      yield*
+          <div
+            v-bind:a="
+              function*(){
+                  yield
+              }
+            "
+            v-bind:b="
+              function*(){
+                  yield
+                  a
+              }
+            "
+            v-bind:c="
+              function*(){
+                  yield*
                       a
-                    }
-                "
-            ></div>
+              }
+            "
+          ></div>
         </template>
       `,
       output: unIndent`
         <template>
-            <div
-                v-bind:a="
-                    function*(){
-                        yield
-                    }
-                "
-                v-bind:b="
-                    function*(){
-                        yield
-                        a
-                    }
-                "
-                v-bind:c="
-                    function*(){
-                        yield*
-                            a
-                    }
-                "
-            ></div>
+          <div
+            v-bind:a="
+              function*(){
+                yield
+              }
+            "
+            v-bind:b="
+              function*(){
+                yield
+                a
+              }
+            "
+            v-bind:c="
+              function*(){
+                yield*
+                  a
+              }
+            "
+          ></div>
         </template>
       `,
       errors: [
-        { message: 'Expected indentation of 16 spaces but found 14 spaces.', line: 5 },
-        { message: 'Expected indentation of 16 spaces but found 14 spaces.', line: 10 },
-        { message: 'Expected indentation of 16 spaces but found 14 spaces.', line: 11 },
-        { message: 'Expected indentation of 16 spaces but found 14 spaces.', line: 16 },
-        { message: 'Expected indentation of 20 spaces but found 14 spaces.', line: 17 }
+        { message: 'Expected indentation of 8 spaces but found 10 spaces.', line: 5 },
+        { message: 'Expected indentation of 8 spaces but found 10 spaces.', line: 10 },
+        { message: 'Expected indentation of 8 spaces but found 10 spaces.', line: 11 },
+        { message: 'Expected indentation of 8 spaces but found 10 spaces.', line: 16 },
+        { message: 'Expected indentation of 10 spaces but found 14 spaces.', line: 17 }
       ]
     },
 
@@ -4121,16 +4152,16 @@ tester.run('html-indent', rule, {
     {
       code: unIndent`
         <template>
-            <div>
-            \tHello
-            </div>
+          <div>
+          \tHello
+          </div>
         </template>
       `,
       output: unIndent`
         <template>
-            <div>
-                Hello
-            </div>
+          <div>
+            Hello
+          </div>
         </template>
       `,
       errors: [
@@ -4172,47 +4203,47 @@ tester.run('html-indent', rule, {
       `,
       output: unIndent`
         <template>
-            <!-- comment -->
-            {{
-                // comment
-                // comment
-                message
-            }}
+          <!-- comment -->
+          {{
+            // comment
+            // comment
+            message
+          }}
         </template>
       `,
       errors: [
-        { message: 'Expected indentation of 4 spaces but found 0 spaces.', line: 2 },
-        { message: 'Expected indentation of 4 spaces but found 0 spaces.', line: 3 },
-        { message: 'Expected indentation of 8 spaces but found 0 spaces.', line: 4 },
-        { message: 'Expected indentation of 8 spaces but found 0 spaces.', line: 5 },
-        { message: 'Expected indentation of 8 spaces but found 0 spaces.', line: 6 },
-        { message: 'Expected indentation of 4 spaces but found 0 spaces.', line: 7 }
+        { message: 'Expected indentation of 2 spaces but found 0 spaces.', line: 2 },
+        { message: 'Expected indentation of 2 spaces but found 0 spaces.', line: 3 },
+        { message: 'Expected indentation of 4 spaces but found 0 spaces.', line: 4 },
+        { message: 'Expected indentation of 4 spaces but found 0 spaces.', line: 5 },
+        { message: 'Expected indentation of 4 spaces but found 0 spaces.', line: 6 },
+        { message: 'Expected indentation of 2 spaces but found 0 spaces.', line: 7 }
       ]
     },
     {
       code: unIndent`
         <template>
-            {{
-            /*
-             * comment
-             */
-            message
-            }}
+          {{
+          /*
+           * comment
+           */
+          message
+          }}
         </template>
       `,
       output: unIndent`
         <template>
-            {{
-                /*
-                 * comment
-                 */
-                message
-            }}
+          {{
+            /*
+             * comment
+             */
+            message
+          }}
         </template>
       `,
       errors: [
-        { message: 'Expected indentation of 8 spaces but found 4 spaces.', line: 3 },
-        { message: 'Expected indentation of 8 spaces but found 4 spaces.', line: 6 }
+        { message: 'Expected indentation of 4 spaces but found 2 spaces.', line: 3 },
+        { message: 'Expected indentation of 4 spaces but found 2 spaces.', line: 6 }
       ]
     },