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
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..1803aff7b 100644
--- a/README.md
+++ b/README.md
@@ -75,87 +75,109 @@ 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.
+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.
 
-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.
+<!--RULES_TABLE_START-->
 
-The `--fix` option on the command line automatically fixes problems reported by rules which have a wrench :wrench: below.
+### Base Rules (Enabling Correct ESLint Parsing)
 
-<!--RULES_TABLE_START-->
+Enforce all the rules in this category, as well as all higher priority rules, with:
 
-### Possible Errors
+``` json
+"extends": "plugin:vue/base"
+```
 
 |    | Rule ID | Description |
 |:---|:--------|:------------|
+|  | [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 |
+|:---|:--------|:------------|
+|  | [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 |
-| :white_check_mark: | [no-parsing-error](./docs/rules/no-parsing-error.md) | disallow parsing errors in `<template>` |
+|  | [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 |
-| :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
-
-|    | 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: | [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-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: | [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-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 |
-
-
-### Stylistic Issues
+|  | [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 |
 |:---|:--------|:------------|
 | :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 |
 | :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 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-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-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 1d9a4df94..512f386d0 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.
 
@@ -12,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 929b1b446..55ab658ef 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
@@ -19,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 c5c929d15..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
@@ -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 ab6e7d029..0315af509 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.
@@ -20,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 14a2ee54c..d204c1fdf 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
@@ -13,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 41fe9b23d..0d929676a 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
@@ -13,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 9db96c330..c48f5ea90 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.
 
@@ -15,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 bde86b40a..271ea935c 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
@@ -16,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 bcb01ed2e..0d9445042 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
@@ -15,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 b0905c3d4..175067f8b 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
@@ -14,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 83916b7bd..a04347a78 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
@@ -19,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 f9e849a98..25f39f788 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
@@ -17,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 59d05bda5..f799c804d 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
@@ -25,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
@@ -60,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 1967bbe7a..3c46bcbe4 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
@@ -17,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 bee8ab638..e57f022de 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
@@ -17,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 1c71de3a8..62f3e4545 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
@@ -22,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 df9554444..20ab1184c 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
@@ -16,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 40972e39f..168af299a 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
@@ -15,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 26692301e..4d177682f 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
@@ -15,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 4a7589044..7fb00cfdb 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
@@ -17,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 b447705c7..8fbf42a22 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
@@ -17,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/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/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/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 64b59f930..b11f218a5 100644
--- a/lib/recommended-rules.js
+++ b/lib/recommended-rules.js
@@ -1,57 +1,41 @@
 /*
- * 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": "off",
-  "vue/html-end-tags": "off",
-  "vue/html-indent": "off",
-  "vue/html-no-self-closing": "off",
-  "vue/html-quotes": "off",
-  "vue/html-self-closing": "off",
+  "vue/attribute-hyphenation": "error",
+  "vue/html-end-tags": "error",
+  "vue/html-indent": "error",
+  "vue/html-quotes": "error",
+  "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-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": "off",
+  "vue/no-dupe-keys": "error",
+  "vue/no-duplicate-attributes": "error",
+  "vue/no-multi-spaces": "error",
   "vue/no-parsing-error": "error",
-  "vue/no-reserved-keys": "off",
-  "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-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": "off",
-  "vue/order-in-components": "off",
+  "vue/no-unused-vars": "error",
+  "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..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: false
+      category: 'strongly-recommended'
     },
     fixable: 'code',
     schema: [
diff --git a/lib/rules/html-end-tags.js b/lib/rules/html-end-tags.js
index 05ba6464e..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,
@@ -60,8 +60,7 @@ module.exports = {
   meta: {
     docs: {
       description: 'enforce end tag style',
-      category: 'Best Practices',
-      recommended: false
+      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 30673c82b..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: false,
+      category: 'strongly-recommended',
       replacedBy: ['html-self-closing']
     },
     deprecated: true,
diff --git a/lib/rules/html-quotes.js b/lib/rules/html-quotes.js
index b6739f905..9326420b9 100644
--- a/lib/rules/html-quotes.js
+++ b/lib/rules/html-quotes.js
@@ -52,12 +52,11 @@ module.exports = {
   meta: {
     docs: {
       description: 'enforce quotes style of HTML attributes',
-      category: 'Stylistic Issues',
-      recommended: false
+      category: 'recommended'
     },
     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..f311a63f9 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',
@@ -143,8 +143,7 @@ module.exports = {
   meta: {
     docs: {
       description: 'enforce self-closing style',
-      category: 'Stylistic Issues',
-      recommended: false
+      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 76f093415..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: false
+      category: 'strongly-recommended'
     },
     fixable: null,
     schema: [
@@ -98,7 +97,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..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: false
+      category: 'strongly-recommended'
     },
     fixable: 'whitespace',
     schema: [
diff --git a/lib/rules/name-property-casing.js b/lib/rules/name-property-casing.js
index 2bf2ca6a6..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
@@ -48,13 +49,12 @@ module.exports = {
   meta: {
     docs: {
       description: 'enforce specific casing for the name property in Vue components',
-      category: 'Stylistic Issues',
-      recommended: false
+      category: 'strongly-recommended'
     },
     fixable: 'code',  // or "code" or "whitespace"
     schema: [
       {
-        enum: casing.allowedCaseOptions
+        enum: allowedCaseOptions
       }
     ]
   },
diff --git a/lib/rules/no-async-in-computed-properties.js b/lib/rules/no-async-in-computed-properties.js
index e1aef33ef..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: false
+      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 4ae9766d1..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: false
+      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 92fce05d6..704858f6b 100644
--- a/lib/rules/no-duplicate-attributes.js
+++ b/lib/rules/no-duplicate-attributes.js
@@ -89,8 +89,7 @@ module.exports = {
   meta: {
     docs: {
       description: 'disallow duplication of attributes',
-      category: 'Best Practices',
-      recommended: false
+      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 844cdbc62..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: false
+      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 2489e4fec..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: false
+      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 cf942ef13..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: false
+      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 9ac247d17..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: false
+      category: 'essential'
     },
     fixable: null,
     schema: []
diff --git a/lib/rules/no-template-key.js b/lib/rules/no-template-key.js
index 41e4b8fd0..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: false
+      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 3ea350501..34edc1ffd 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'
 ]
 
@@ -96,8 +100,7 @@ module.exports = {
   meta: {
     docs: {
       description: 'enforce order of properties in components',
-      category: 'Best Practices',
-      recommended: false
+      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 1dbd266e6..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: false
+      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 16382aa6d..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: false
+      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 9ff268a93..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: false
+      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 d4c8ddca7..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: false
+      category: 'essential'
     },
     fixable: null,
     schema: []
diff --git a/lib/rules/return-in-computed-property.js b/lib/rules/return-in-computed-property.js
index a3a7858d3..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: false
+      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 9095988a6..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: false
+      category: 'recommended'
     },
     fixable: null,
     schema: [
diff --git a/lib/rules/v-bind-style.js b/lib/rules/v-bind-style.js
index 701be354f..16748bd47 100644
--- a/lib/rules/v-bind-style.js
+++ b/lib/rules/v-bind-style.js
@@ -53,12 +53,11 @@ module.exports = {
   meta: {
     docs: {
       description: 'enforce `v-bind` directive style',
-      category: 'Stylistic Issues',
-      recommended: false
+      category: 'strongly-recommended'
     },
     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..6ee91df07 100644
--- a/lib/rules/v-on-style.js
+++ b/lib/rules/v-on-style.js
@@ -54,12 +54,11 @@ module.exports = {
   meta: {
     docs: {
       description: 'enforce `v-on` directive style',
-      category: 'Stylistic Issues',
-      recommended: false
+      category: 'strongly-recommended'
     },
     fixable: 'code',
     schema: [
-            { enum: ['shorthand', 'longform'] }
+      { enum: ['shorthand', 'longform'] }
     ]
   }
 }
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/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/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: [
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 }
       ]
     },
 
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/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>',
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
       }]
     },
     {
diff --git a/tools/update-rules.js b/tools/update-rules.js
index 4980d6c0c..67affeed8 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,27 +32,76 @@ 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)
+// 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)) {
+    categories.push('uncategorized')
+    if (category) {
+      throw new Error(`Rule category ${category} from ${entry[0]} is invalid`)
     }
-    return arr
-  }, ['Possible Errors', 'Best Practices', 'Stylistic Issues'])
+  }
+}
+
+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)',
+  uncategorized: 'Uncategorized'
+}
+
+// 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]}
+${
+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
-      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} |`
@@ -80,59 +127,67 @@ ${
       return `| ${link} | ${replacedBy} |`
     })
     .join('\n')
-}
+  }
 `
 
-const recommendedRules = rules.reduce((obj, entry) => {
-  const name = `vue/${entry[0]}`
-  const recommended = entry[1].meta.docs.recommended
-  const status = recommended ? 'error' : '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) => {
+  if (category === 'uncategorized') return
+  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,