diff --git a/.circleci/config.yml b/.circleci/config.yml
index 7d8f4bcde..7ecc73606 100644
--- a/.circleci/config.yml
+++ b/.circleci/config.yml
@@ -62,9 +62,9 @@ jobs:
           command: npm version
       - checkout
       - run:
-          name: Install @typescript-eslint/parser@4
+          name: Install eslint@7 and @typescript-eslint/parser@4
           command: |
-            npm install @typescript-eslint/parser@^4
+            npm install eslint@7 @typescript-eslint/parser@^4
       - run:
           name: Install dependencies
           command: npm install
diff --git a/docs/.eslintrc.js b/docs/.eslintrc.js
new file mode 100644
index 000000000..1ec3b7eae
--- /dev/null
+++ b/docs/.eslintrc.js
@@ -0,0 +1,7 @@
+'use strict'
+
+module.exports = {
+  parserOptions: {
+    sourceType: 'module'
+  }
+}
diff --git a/docs/.vuepress/components/eslint-code-block.vue b/docs/.vuepress/components/eslint-code-block.vue
index 3c37c9234..2c6abd2cc 100644
--- a/docs/.vuepress/components/eslint-code-block.vue
+++ b/docs/.vuepress/components/eslint-code-block.vue
@@ -122,20 +122,16 @@ export default {
 
   async mounted() {
     // Load linter.
-    const [{ default: Linter }, { default: coreRules }, { parseForESLint }] =
-      await Promise.all([
-        import('eslint4b/dist/linter'),
-        import('eslint4b/dist/core-rules'),
-        import('espree').then(() => import('vue-eslint-parser'))
-      ])
+    const [{ Linter }, { parseForESLint }] = await Promise.all([
+      import('eslint/lib/linter'),
+      import('espree').then(() => import('vue-eslint-parser'))
+    ])
 
     const linter = (this.linter = new Linter())
 
     for (const ruleId of Object.keys(rules)) {
       linter.defineRule(`vue/${ruleId}`, rules[ruleId])
     }
-    linter.defineRule('no-undef', coreRules['no-undef'])
-    linter.defineRule('no-unused-vars', coreRules['no-unused-vars'])
 
     linter.defineParser('vue-eslint-parser', { parseForESLint })
   }
diff --git a/docs/.vuepress/config.js b/docs/.vuepress/config.js
index c0a406166..5bcb7913b 100644
--- a/docs/.vuepress/config.js
+++ b/docs/.vuepress/config.js
@@ -124,7 +124,15 @@ module.exports = {
       resolve: {
         alias: {
           module: require.resolve('./shim/module'),
-          eslint: path.resolve(__dirname, './shim/eslint')
+          eslint$: require.resolve('./shim/eslint'),
+          esquery: path.resolve(
+            __dirname,
+            '../../node_modules/esquery/dist/esquery.min.js'
+          ),
+          '@eslint/eslintrc/universal': path.resolve(
+            __dirname,
+            '../../node_modules/@eslint/eslintrc/dist/eslintrc-universal.cjs'
+          )
         }
       }
     }
diff --git a/docs/.vuepress/enhanceApp.js b/docs/.vuepress/enhanceApp.js
new file mode 100644
index 000000000..dc7e30771
--- /dev/null
+++ b/docs/.vuepress/enhanceApp.js
@@ -0,0 +1,28 @@
+/* globals window */
+export default (
+  // eslint-disable-next-line no-empty-pattern
+  {
+    //     Vue, // the version of Vue being used in the VuePress app
+    //     options, // the options for the root Vue instance
+    //     router, // the router instance for the app
+    //     siteData, // site metadata
+  }
+) => {
+  if (typeof window !== 'undefined') {
+    if (typeof window.process === 'undefined') {
+      window.process = new Proxy(
+        {
+          env: {},
+          cwd: () => undefined
+        },
+        {
+          get(target, name) {
+            // For debug
+            // console.log(name)
+            return target[name]
+          }
+        }
+      )
+    }
+  }
+}
diff --git a/docs/.vuepress/shim/eslint.js b/docs/.vuepress/shim/eslint.js
new file mode 100644
index 000000000..08af6dfcd
--- /dev/null
+++ b/docs/.vuepress/shim/eslint.js
@@ -0,0 +1,4 @@
+const { Linter } = require('eslint/lib/linter')
+module.exports = {
+  Linter
+}
diff --git a/docs/.vuepress/shim/eslint/index.js b/docs/.vuepress/shim/eslint/index.js
deleted file mode 100644
index e32cb598f..000000000
--- a/docs/.vuepress/shim/eslint/index.js
+++ /dev/null
@@ -1,2 +0,0 @@
-const Linter = require('eslint4b')
-module.exports = { Linter }
diff --git a/docs/.vuepress/shim/eslint/lib/rules/index.js b/docs/.vuepress/shim/eslint/lib/rules/index.js
deleted file mode 100644
index e69de29bb..000000000
diff --git a/docs/rules/README.md b/docs/rules/README.md
index 544d24db7..e17125ee8 100644
--- a/docs/rules/README.md
+++ b/docs/rules/README.md
@@ -296,10 +296,13 @@ For example:
 | [vue/html-comment-content-spacing](./html-comment-content-spacing.md) | enforce unified spacing in HTML comments | :wrench: |
 | [vue/html-comment-indent](./html-comment-indent.md) | enforce consistent indentation in HTML comments | :wrench: |
 | [vue/match-component-file-name](./match-component-file-name.md) | require component name property to match its file name |  |
+| [vue/multi-word-component-names](./multi-word-component-names.md) | require component names to be always multi-word |  |
 | [vue/new-line-between-multi-line-property](./new-line-between-multi-line-property.md) | enforce new lines between multi-line properties in Vue components | :wrench: |
 | [vue/next-tick-style](./next-tick-style.md) | enforce Promise or callback style in `nextTick` | :wrench: |
 | [vue/no-bare-strings-in-template](./no-bare-strings-in-template.md) | disallow the use of bare strings in `<template>` |  |
 | [vue/no-boolean-default](./no-boolean-default.md) | disallow boolean defaults | :wrench: |
+| [vue/no-computed-properties-in-data](./no-computed-properties-in-data.md) | disallow accessing computed properties in `data`. |  |
+| [vue/no-deprecated-router-link-tag-prop](./no-deprecated-router-link-tag-prop.md) | disallow using deprecated `tag` property on `RouterLink` (in Vue.js 3.0.0+) |  |
 | [vue/no-deprecated-v-is](./no-deprecated-v-is.md) | disallow deprecated `v-is` directive (in Vue.js 3.1.0+) | :wrench: |
 | [vue/no-duplicate-attr-inheritance](./no-duplicate-attr-inheritance.md) | enforce `inheritAttrs` to be set to `false` when using `v-bind="$attrs"` |  |
 | [vue/no-empty-component-block](./no-empty-component-block.md) | disallow the `<template>` `<script>` `<style>` block to be empty |  |
@@ -319,6 +322,7 @@ For example:
 | [vue/no-static-inline-styles](./no-static-inline-styles.md) | disallow static inline `style` attributes |  |
 | [vue/no-template-target-blank](./no-template-target-blank.md) | disallow target="_blank" attribute without rel="noopener noreferrer" |  |
 | [vue/no-this-in-before-route-enter](./no-this-in-before-route-enter.md) | disallow `this` usage in a `beforeRouteEnter` method |  |
+| [vue/no-undef-properties](./no-undef-properties.md) | disallow undefined properties |  |
 | [vue/no-unregistered-components](./no-unregistered-components.md) | disallow using components that are not registered inside templates |  |
 | [vue/no-unsupported-features](./no-unsupported-features.md) | disallow unsupported Vue.js syntax on the specified version | :wrench: |
 | [vue/no-unused-properties](./no-unused-properties.md) | disallow unused properties |  |
diff --git a/docs/rules/multi-word-component-names.md b/docs/rules/multi-word-component-names.md
new file mode 100644
index 000000000..46516a1fb
--- /dev/null
+++ b/docs/rules/multi-word-component-names.md
@@ -0,0 +1,91 @@
+---
+pageClass: rule-details
+sidebarDepth: 0
+title: vue/multi-word-component-names
+description: require component names to be always multi-word
+since: v7.20.0
+---
+# vue/multi-word-component-names
+
+> require component names to be always multi-word
+
+## :book: Rule Details
+
+This rule require component names to be always multi-word, except for root `App`
+components, and built-in components provided by Vue, such as `<transition>` or
+`<component>`. This prevents conflicts with existing and future HTML elements,
+since all HTML elements are a single word.
+
+<eslint-code-block filename="src/TodoItem.js" language="javascript" :rules="{'vue/multi-word-component-names': ['error']}">
+
+```js
+/* ✓ GOOD */
+Vue.component('todo-item', {
+  // ...
+})
+
+/* ✗ BAD */
+Vue.component('Todo', {
+  // ...
+})
+```
+
+</eslint-code-block>
+
+<eslint-code-block filename="src/TodoItem.js" :rules="{'vue/multi-word-component-names': ['error']}">
+
+```vue
+<script>
+/* ✓ GOOD */
+export default {
+  name: 'TodoItem',
+  // ...
+}
+</script>
+```
+
+</eslint-code-block>
+
+<eslint-code-block filename="src/Todo.vue" :rules="{'vue/multi-word-component-names': ['error']}">
+
+```vue
+<script>
+/* ✗ BAD */
+export default {
+  name: 'Todo',
+  // ...
+}
+</script>
+```
+
+</eslint-code-block>
+
+<eslint-code-block filename="src/Todo.vue" :rules="{'vue/multi-word-component-names': ['error']}">
+
+```vue
+<script>
+/* ✗ BAD */
+export default {
+  // ...
+}
+</script>
+```
+
+</eslint-code-block>
+
+## :wrench: Options
+
+Nothing.
+
+## :books: Further Reading
+
+- [Style guide - Multi-word component names](https://vuejs.org/v2/style-guide/#Multi-word-component-names-essential)
+
+## :rocket: Version
+
+This rule was introduced in eslint-plugin-vue v7.20.0
+
+## :mag: Implementation
+
+- [Rule source](https://github.com/vuejs/eslint-plugin-vue/blob/master/lib/rules/multi-word-component-names.js)
+- [Test source](https://github.com/vuejs/eslint-plugin-vue/blob/master/tests/lib/rules/multi-word-component-names.js)
diff --git a/docs/rules/no-computed-properties-in-data.md b/docs/rules/no-computed-properties-in-data.md
new file mode 100644
index 000000000..181fd231e
--- /dev/null
+++ b/docs/rules/no-computed-properties-in-data.md
@@ -0,0 +1,48 @@
+---
+pageClass: rule-details
+sidebarDepth: 0
+title: vue/no-computed-properties-in-data
+description: disallow accessing computed properties in `data`.
+since: v7.20.0
+---
+# vue/no-computed-properties-in-data
+
+> disallow accessing computed properties in `data`.
+
+## :book: Rule Details
+
+This rule disallow accessing computed properties in `data()`.  
+The computed property cannot be accessed in `data()` because is before initialization.
+
+<eslint-code-block :rules="{'vue/no-computed-properties-in-data': ['error']}">
+
+```vue
+<script>
+export default {
+  data() {
+    return  {
+      /* ✗ BAD */
+      bar: this.foo
+    }
+  },
+  computed: {
+    foo () {}
+  }
+}
+</script>
+```
+
+</eslint-code-block>
+
+## :wrench: Options
+
+Nothing.
+
+## :rocket: Version
+
+This rule was introduced in eslint-plugin-vue v7.20.0
+
+## :mag: Implementation
+
+- [Rule source](https://github.com/vuejs/eslint-plugin-vue/blob/master/lib/rules/no-computed-properties-in-data.js)
+- [Test source](https://github.com/vuejs/eslint-plugin-vue/blob/master/tests/lib/rules/no-computed-properties-in-data.js)
diff --git a/docs/rules/no-deprecated-router-link-tag-prop.md b/docs/rules/no-deprecated-router-link-tag-prop.md
new file mode 100644
index 000000000..7469ca9ad
--- /dev/null
+++ b/docs/rules/no-deprecated-router-link-tag-prop.md
@@ -0,0 +1,94 @@
+---
+pageClass: rule-details
+sidebarDepth: 0
+title: vue/no-deprecated-router-link-tag-prop
+description: disallow using deprecated `tag` property on `RouterLink` (in Vue.js 3.0.0+)
+since: v7.20.0
+---
+# vue/no-deprecated-router-link-tag-prop
+
+> disallow using deprecated `tag` property on `RouterLink` (in Vue.js 3.0.0+)
+
+## :book: Rule Details
+
+This rule reports deprecated the `tag` attribute on `RouterLink` elements (removed in Vue.js v3.0.0+).
+
+<eslint-code-block :rules="{'vue/no-deprecated-router-link-tag-prop': ['error']}">
+
+```vue
+<template>
+  <!-- ✓ GOOD -->
+  <RouterLink to="/">Home</RouterLink>
+  <router-link to="/">Home</router-link>
+
+  <RouterLink to="/">
+    <div>Home</div>
+  </RouterLink>
+
+  <router-link to="/">
+    <div>Home</div>
+  </router-link>
+
+  <NuxtLink tag="div" to="/">Home</NuxtLink>
+  <nuxt-link tag="div" to="/">Home</nuxt-link>
+
+  <!-- ✗ BAD -->
+  <RouterLink tag="div" to="/">Home</RouterLink>
+  <router-link tag="div" to="/">Home</router-link>
+  <RouterLink :tag="someVariable" to="/">Home</RouterLink>
+  <router-link :tag="someVariable" to="/">Home</router-link>
+</template>
+```
+
+</eslint-code-block>
+
+## :wrench: Options
+
+```json
+{
+  "vue/no-deprecated-router-link-tag-prop": ["error", {
+    "components": ['RouterLink']
+  }]
+}
+```
+
+- `components` (`string[]`) ... Component names which will be checked with the `tag` attribute. default `['RouterLink']`.
+
+Note: this rule will check both `kebab-case` and `PascalCase` versions of the
+given component names.
+
+### `{ "components": ['RouterLink', 'NuxtLink'] }`
+
+<eslint-code-block :rules="{'vue/no-deprecated-router-link-tag-prop': ['error', {'components': ['RouterLink', 'NuxtLink']}]}">
+
+```vue
+<template>
+  <!-- ✗ BAD -->
+  <RouterLink tag="div" to="/">Home</RouterLink>
+  <router-link tag="div" to="/">Home</router-link>
+
+  <RouterLink :tag="someVariable" to="/">Home</RouterLink>
+  <router-link :tag="someVariable" to="/">Home</router-link>
+
+  <NuxtLink tag="div" to="/">Home</NuxtLink>
+  <nuxt-link tag="div" to="/">Home</nuxt-link>
+
+  <NuxtLink :tag="someVariable" to="/">Home</NuxtLink>
+  <nuxt-link :tag="someVariable" to="/">Home</nuxt-link>
+</template>
+```
+
+</eslint-code-block>
+
+## :books: Further Reading
+
+- [Vue RFCs - 0021-router-link-scoped-slot](https://github.com/vuejs/rfcs/blob/master/active-rfcs/0021-router-link-scoped-slot.md)
+
+## :rocket: Version
+
+This rule was introduced in eslint-plugin-vue v7.20.0
+
+## :mag: Implementation
+
+- [Rule source](https://github.com/vuejs/eslint-plugin-vue/blob/master/lib/rules/no-deprecated-router-link-tag-prop.js)
+- [Test source](https://github.com/vuejs/eslint-plugin-vue/blob/master/tests/lib/rules/no-deprecated-router-link-tag-prop.js)
diff --git a/docs/rules/no-restricted-class.md b/docs/rules/no-restricted-class.md
index 267bfebaa..c4919ebd6 100644
--- a/docs/rules/no-restricted-class.md
+++ b/docs/rules/no-restricted-class.md
@@ -20,7 +20,7 @@ in the rule configuration.
 
 ```json
 {
-  "vue/no-restricted-props": ["error", "forbidden", "forbidden-two", "forbidden-three"]
+  "vue/no-restricted-class": ["error", "forbidden", "forbidden-two", "forbidden-three"]
 }
 ```
 
diff --git a/docs/rules/no-undef-properties.md b/docs/rules/no-undef-properties.md
new file mode 100644
index 000000000..9b5062a65
--- /dev/null
+++ b/docs/rules/no-undef-properties.md
@@ -0,0 +1,117 @@
+---
+pageClass: rule-details
+sidebarDepth: 0
+title: vue/no-undef-properties
+description: disallow undefined properties
+since: v7.20.0
+---
+# vue/no-undef-properties
+
+> disallow undefined properties
+
+## :book: Rule Details
+
+This rule warns of using undefined properties.  
+This rule can help you locate potential errors resulting from misspellings property names, and implicitly added properties.
+
+::: warning Note
+This rule cannot detect properties defined in other files or components.  
+Note that there are many false positives if you are using mixins.
+:::
+
+<eslint-code-block :rules="{'vue/no-undef-properties': ['error']}">
+
+```vue
+<template>
+  <!-- ✓ GOOD -->
+  <div>{{ name }}: {{ count }}</div>
+  <!-- ✗ BAD -->
+  <div>{{ label }}: {{ cnt }}</div>
+</template>
+<script setup>
+const prop = defineProps(['name', 'def'])
+let count = 0
+
+/* ✓ GOOD */
+watch(() => prop.def, () => console.log('Updated!'))
+
+/* ✗ BAD */
+watch(() => prop.undef, () => console.log('Updated!'))
+</script>
+```
+
+</eslint-code-block>
+
+<eslint-code-block :rules="{'vue/no-undef-properties': ['error']}">
+
+```vue
+<template>
+  <!-- ✓ GOOD -->
+  <div>{{ name }}: {{ count }}</div>
+  <!-- ✗ BAD -->
+  <div>{{ label }}: {{ cnt }}</div>
+</template>
+<script>
+  export default {
+    props: ['name'],
+    data () {
+      return {
+        count: 0
+      }
+    },
+    methods: {
+      click() {
+        /* ✓ GOOD */
+        this.count++
+
+        /* ✗ BAD */
+        this.cnt++
+      }
+    }
+  }
+</script>
+```
+
+</eslint-code-block>
+
+## :wrench: Options
+
+```json
+{
+  "vue/no-undef-properties": ["error", {
+    "ignores": ["/^\\$/"]
+  }]
+}
+```
+
+- `ignores` (`string[]`) ... An array of property names or patterns that have already been defined property, or property to ignore from the check. Default is `["/^\\$/"]`.
+
+### `"ignores": ["/^\\$/"]` (default)
+
+<eslint-code-block :rules="{'vue/no-undef-properties': ['error', {ignores: ['/^\\$/']}]}">
+
+```vue
+<template>
+  <!-- ✓ GOOD -->
+  <div>{{ $t('foo') }}</div>
+</template>
+<script>
+  export default {
+    mounted() {
+      /* ✓ GOOD */
+      const hash = this.$route.hash
+    }
+  }
+</script>
+```
+
+</eslint-code-block>
+
+## :rocket: Version
+
+This rule was introduced in eslint-plugin-vue v7.20.0
+
+## :mag: Implementation
+
+- [Rule source](https://github.com/vuejs/eslint-plugin-vue/blob/master/lib/rules/no-undef-properties.js)
+- [Test source](https://github.com/vuejs/eslint-plugin-vue/blob/master/tests/lib/rules/no-undef-properties.js)
diff --git a/docs/user-guide/README.md b/docs/user-guide/README.md
index 1a62fbf71..630e92893 100644
--- a/docs/user-guide/README.md
+++ b/docs/user-guide/README.md
@@ -25,8 +25,6 @@ yarn add -D eslint eslint-plugin-vue
 - ESLint v6.2.0 and above
 - Node.js v8.10.0 and above
 
-We have started supporting ESLint v8.0.0 beta, but note that beta support will be dropped once the stable version is released.
-
 :::
 
 ## :book: Usage
diff --git a/lib/index.js b/lib/index.js
index 9ddfe4cd7..d6e377add 100644
--- a/lib/index.js
+++ b/lib/index.js
@@ -47,6 +47,7 @@ module.exports = {
     'match-component-file-name': require('./rules/match-component-file-name'),
     'max-attributes-per-line': require('./rules/max-attributes-per-line'),
     'max-len': require('./rules/max-len'),
+    'multi-word-component-names': require('./rules/multi-word-component-names'),
     'multiline-html-element-content-newline': require('./rules/multiline-html-element-content-newline'),
     'mustache-interpolation-spacing': require('./rules/mustache-interpolation-spacing'),
     'name-property-casing': require('./rules/name-property-casing'),
@@ -56,6 +57,7 @@ module.exports = {
     'no-async-in-computed-properties': require('./rules/no-async-in-computed-properties'),
     'no-bare-strings-in-template': require('./rules/no-bare-strings-in-template'),
     'no-boolean-default': require('./rules/no-boolean-default'),
+    'no-computed-properties-in-data': require('./rules/no-computed-properties-in-data'),
     'no-confusing-v-for-v-if': require('./rules/no-confusing-v-for-v-if'),
     'no-constant-condition': require('./rules/no-constant-condition'),
     'no-custom-modifiers-on-v-model': require('./rules/no-custom-modifiers-on-v-model'),
@@ -69,6 +71,7 @@ module.exports = {
     'no-deprecated-html-element-is': require('./rules/no-deprecated-html-element-is'),
     'no-deprecated-inline-template': require('./rules/no-deprecated-inline-template'),
     'no-deprecated-props-default-this': require('./rules/no-deprecated-props-default-this'),
+    'no-deprecated-router-link-tag-prop': require('./rules/no-deprecated-router-link-tag-prop'),
     'no-deprecated-scope-attribute': require('./rules/no-deprecated-scope-attribute'),
     'no-deprecated-slot-attribute': require('./rules/no-deprecated-slot-attribute'),
     'no-deprecated-slot-scope-attribute': require('./rules/no-deprecated-slot-scope-attribute'),
@@ -119,6 +122,7 @@ module.exports = {
     'no-template-target-blank': require('./rules/no-template-target-blank'),
     'no-textarea-mustache': require('./rules/no-textarea-mustache'),
     'no-this-in-before-route-enter': require('./rules/no-this-in-before-route-enter'),
+    'no-undef-properties': require('./rules/no-undef-properties'),
     'no-unregistered-components': require('./rules/no-unregistered-components'),
     'no-unsupported-features': require('./rules/no-unsupported-features'),
     'no-unused-components': require('./rules/no-unused-components'),
diff --git a/lib/rules/multi-word-component-names.js b/lib/rules/multi-word-component-names.js
new file mode 100644
index 000000000..f47f85349
--- /dev/null
+++ b/lib/rules/multi-word-component-names.js
@@ -0,0 +1,115 @@
+/**
+ * @author Marton Csordas
+ * See LICENSE file in root directory for full license.
+ */
+'use strict'
+
+// ------------------------------------------------------------------------------
+// Requirements
+// ------------------------------------------------------------------------------
+
+const casing = require('../utils/casing')
+const utils = require('../utils')
+
+const RESERVED_NAMES_IN_VUE3 = new Set(
+  require('../utils/vue3-builtin-components')
+)
+
+// ------------------------------------------------------------------------------
+// Helpers
+// ------------------------------------------------------------------------------
+
+/**
+ * Returns true if the given component name is valid, otherwise false.
+ * @param {string} name
+ * */
+function isValidComponentName(name) {
+  if (name.toLowerCase() === 'app' || RESERVED_NAMES_IN_VUE3.has(name)) {
+    return true
+  } else {
+    const elements = casing.kebabCase(name).split('-')
+    return elements.length > 1
+  }
+}
+
+// ------------------------------------------------------------------------------
+// Rule Definition
+// ------------------------------------------------------------------------------
+
+module.exports = {
+  meta: {
+    type: 'suggestion',
+    docs: {
+      description: 'require component names to be always multi-word',
+      categories: undefined,
+      url: 'https://eslint.vuejs.org/rules/multi-word-component-names.html'
+    },
+    schema: [],
+    messages: {
+      unexpected: 'Component name "{{value}}" should always be multi-word.'
+    }
+  },
+  /** @param {RuleContext} context */
+  create(context) {
+    const fileName = context.getFilename()
+    let componentName = fileName.replace(/\.[^/.]+$/, '')
+
+    return utils.compositingVisitors(
+      {
+        /** @param {Program} node */
+        Program(node) {
+          if (
+            !node.body.length &&
+            utils.isVueFile(fileName) &&
+            !isValidComponentName(componentName)
+          ) {
+            context.report({
+              messageId: 'unexpected',
+              data: {
+                value: componentName
+              },
+              loc: { line: 1, column: 0 }
+            })
+          }
+        }
+      },
+
+      utils.executeOnVue(context, (obj) => {
+        const node = utils.findProperty(obj, 'name')
+
+        /** @type {SourceLocation | null} */
+        let loc = null
+
+        // Check if the component has a name property.
+        if (node) {
+          const valueNode = node.value
+          if (valueNode.type !== 'Literal') return
+
+          componentName = `${valueNode.value}`
+          loc = node.loc
+        } else if (
+          obj.parent.type === 'CallExpression' &&
+          obj.parent.arguments.length === 2
+        ) {
+          // The component is registered globally with 'Vue.component', where
+          // the first paremter is the component name.
+          const argument = obj.parent.arguments[0]
+          if (argument.type !== 'Literal') return
+
+          componentName = `${argument.value}`
+          loc = argument.loc
+        }
+
+        if (!isValidComponentName(componentName)) {
+          context.report({
+            messageId: 'unexpected',
+            data: {
+              value: componentName
+            },
+            loc: loc || { line: 1, column: 0 }
+          })
+        }
+      })
+    )
+  }
+}
diff --git a/lib/rules/no-computed-properties-in-data.js b/lib/rules/no-computed-properties-in-data.js
new file mode 100644
index 000000000..b2f52031f
--- /dev/null
+++ b/lib/rules/no-computed-properties-in-data.js
@@ -0,0 +1,108 @@
+/**
+ * @author  Yosuke Ota
+ * See LICENSE file in root directory for full license.
+ */
+'use strict'
+
+// ------------------------------------------------------------------------------
+// Requirements
+// ------------------------------------------------------------------------------
+
+const utils = require('../utils')
+
+/**
+ * @typedef {import('../utils').VueObjectData} VueObjectData
+ */
+
+// ------------------------------------------------------------------------------
+// Rule Definition
+// ------------------------------------------------------------------------------
+
+module.exports = {
+  meta: {
+    type: 'problem',
+    docs: {
+      description: 'disallow accessing computed properties in `data`.',
+      categories: undefined,
+      url: 'https://eslint.vuejs.org/rules/no-computed-properties-in-data.html'
+    },
+    fixable: null,
+    schema: [],
+    messages: {
+      cannotBeUsed:
+        'The computed property cannot be used in `data()` because it is before initialization.'
+    }
+  },
+  /** @param {RuleContext} context */
+  create(context) {
+    /** @type {Map<ObjectExpression, {data: FunctionExpression | ArrowFunctionExpression, computedNames:Set<string>}>} */
+    const contextMap = new Map()
+
+    /**
+     * @typedef {object} ScopeStack
+     * @property {ScopeStack | null} upper
+     * @property {FunctionExpression | FunctionDeclaration | ArrowFunctionExpression} node
+     */
+    /** @type {ScopeStack | null} */
+    let scopeStack = null
+
+    return utils.compositingVisitors(
+      {
+        /**
+         * @param {FunctionExpression | FunctionDeclaration | ArrowFunctionExpression} node
+         */
+        ':function'(node) {
+          scopeStack = {
+            upper: scopeStack,
+            node
+          }
+        },
+        ':function:exit'() {
+          scopeStack = scopeStack && scopeStack.upper
+        }
+      },
+      utils.defineVueVisitor(context, {
+        onVueObjectEnter(node) {
+          const dataProperty = utils.findProperty(node, 'data')
+          if (
+            !dataProperty ||
+            (dataProperty.value.type !== 'FunctionExpression' &&
+              dataProperty.value.type !== 'ArrowFunctionExpression')
+          ) {
+            return
+          }
+          const computedNames = new Set()
+          for (const computed of utils.iterateProperties(
+            node,
+            new Set(['computed'])
+          )) {
+            computedNames.add(computed.name)
+          }
+
+          contextMap.set(node, { data: dataProperty.value, computedNames })
+        },
+        /**
+         * @param {MemberExpression} node
+         * @param {VueObjectData} vueData
+         */
+        MemberExpression(node, vueData) {
+          if (!scopeStack || !utils.isThis(node.object, context)) {
+            return
+          }
+          const ctx = contextMap.get(vueData.node)
+          if (!ctx || ctx.data !== scopeStack.node) {
+            return
+          }
+          const name = utils.getStaticPropertyName(node)
+          if (!name || !ctx.computedNames.has(name)) {
+            return
+          }
+          context.report({
+            node,
+            messageId: 'cannotBeUsed'
+          })
+        }
+      })
+    )
+  }
+}
diff --git a/lib/rules/no-deprecated-router-link-tag-prop.js b/lib/rules/no-deprecated-router-link-tag-prop.js
new file mode 100644
index 000000000..d73cf0ceb
--- /dev/null
+++ b/lib/rules/no-deprecated-router-link-tag-prop.js
@@ -0,0 +1,103 @@
+/**
+ * @author Marton Csordas
+ * See LICENSE file in root directory for full license.
+ */
+'use strict'
+
+// ------------------------------------------------------------------------------
+// Requirements
+// ------------------------------------------------------------------------------
+
+const utils = require('../utils')
+const casing = require('../utils/casing')
+
+// --------------------------------------------------------------------------
+// Helpers
+// --------------------------------------------------------------------------
+
+/** @param {RuleContext} context */
+function getComponentNames(context) {
+  let components = ['RouterLink']
+
+  if (context.options[0] && context.options[0].components) {
+    components = context.options[0].components
+  }
+
+  return components.reduce((prev, curr) => {
+    prev.add(casing.kebabCase(curr))
+    prev.add(casing.pascalCase(curr))
+    return prev
+  }, new Set())
+}
+
+// ------------------------------------------------------------------------------
+// Rule Definition
+// ------------------------------------------------------------------------------
+
+module.exports = {
+  meta: {
+    type: 'problem',
+    docs: {
+      description:
+        'disallow using deprecated `tag` property on `RouterLink` (in Vue.js 3.0.0+)',
+      categories: undefined,
+      url: 'https://eslint.vuejs.org/rules/no-deprecated-router-link-tag-prop.html'
+    },
+    fixable: null,
+    schema: [
+      {
+        type: 'object',
+        properties: {
+          components: {
+            type: 'array',
+            items: {
+              type: 'string'
+            },
+            uniqueItems: true,
+            minItems: 1
+          }
+        }
+      }
+    ],
+    messages: {
+      deprecated:
+        "'tag' property on '{{element}}' component is deprecated. Use scoped slots instead."
+    }
+  },
+  /** @param {RuleContext} context */
+  create(context) {
+    const components = getComponentNames(context)
+
+    return utils.defineTemplateBodyVisitor(context, {
+      VElement(node) {
+        if (!components.has(node.rawName)) return
+
+        /** @type VIdentifier | null */
+        let tagKey = null
+
+        const tagAttr = utils.getAttribute(node, 'tag')
+        if (tagAttr) {
+          tagKey = tagAttr.key
+        } else {
+          const directive = utils.getDirective(node, 'bind', 'tag')
+          if (directive) {
+            const arg = directive.key.argument
+            if (arg && arg.type === 'VIdentifier') {
+              tagKey = arg
+            }
+          }
+        }
+
+        if (tagKey) {
+          context.report({
+            node: tagKey,
+            messageId: 'deprecated',
+            data: {
+              element: node.rawName
+            }
+          })
+        }
+      }
+    })
+  }
+}
diff --git a/lib/rules/no-undef-properties.js b/lib/rules/no-undef-properties.js
new file mode 100644
index 000000000..fdd506cc5
--- /dev/null
+++ b/lib/rules/no-undef-properties.js
@@ -0,0 +1,535 @@
+/**
+ * @fileoverview Disallow undefined properties.
+ * @author Yosuke Ota
+ */
+'use strict'
+
+// ------------------------------------------------------------------------------
+// Requirements
+// ------------------------------------------------------------------------------
+
+const utils = require('../utils')
+const reserved = require('../utils/vue-reserved.json')
+const { toRegExp } = require('../utils/regexp')
+const { getStyleVariablesContext } = require('../utils/style-variables')
+const {
+  definePropertyReferenceExtractor
+} = require('../utils/property-references')
+
+/**
+ * @typedef {import('../utils').VueObjectData} VueObjectData
+ * @typedef {import('../utils/property-references').IPropertyReferences} IPropertyReferences
+ */
+/**
+ * @typedef {object} PropertyData
+ * @property {boolean} [hasNestProperty]
+ * @property { (name: string) => PropertyData | null } [get]
+ * @property {boolean} [isProps]
+ */
+
+// ------------------------------------------------------------------------------
+// Helpers
+// ------------------------------------------------------------------------------
+
+const GROUP_PROPERTY = 'props'
+const GROUP_DATA = 'data'
+const GROUP_COMPUTED_PROPERTY = 'computed'
+const GROUP_METHODS = 'methods'
+const GROUP_SETUP = 'setup'
+const GROUP_WATCHER = 'watch'
+const GROUP_EXPOSE = 'expose'
+const GROUP_INJECT = 'inject'
+
+/**
+ * @param {ObjectExpression} object
+ * @returns {Map<string, Property> | null}
+ */
+function getObjectPropertyMap(object) {
+  /** @type {Map<string, Property>} */
+  const props = new Map()
+  for (const p of object.properties) {
+    if (p.type !== 'Property') {
+      return null
+    }
+    const name = utils.getStaticPropertyName(p)
+    if (name == null) {
+      return null
+    }
+    props.set(name, p)
+  }
+  return props
+}
+
+/**
+ * @param {Property | undefined} property
+ * @returns {PropertyData | null}
+ */
+function getPropertyDataFromObjectProperty(property) {
+  if (property == null) {
+    return null
+  }
+  const propertyMap =
+    property.value.type === 'ObjectExpression'
+      ? getObjectPropertyMap(property.value)
+      : null
+  return {
+    hasNestProperty: Boolean(propertyMap),
+    get(name) {
+      if (!propertyMap) {
+        return null
+      }
+      return getPropertyDataFromObjectProperty(propertyMap.get(name))
+    }
+  }
+}
+
+// ------------------------------------------------------------------------------
+// Rule Definition
+// ------------------------------------------------------------------------------
+
+module.exports = {
+  meta: {
+    type: 'suggestion',
+    docs: {
+      description: 'disallow undefined properties',
+      categories: undefined,
+      url: 'https://eslint.vuejs.org/rules/no-undef-properties.html'
+    },
+    fixable: null,
+    schema: [
+      {
+        type: 'object',
+        properties: {
+          ignores: {
+            type: 'array',
+            items: { type: 'string' },
+            uniqueItems: true
+          }
+        },
+        additionalProperties: false
+      }
+    ],
+    messages: {
+      undef: "'{{name}}' is not defined.",
+      undefProps: "'{{name}}' is not defined in props."
+    }
+  },
+  /** @param {RuleContext} context */
+  create(context) {
+    const options = context.options[0] || {}
+    const ignores = /** @type {string[]} */ (options.ignores || ['/^\\$/']).map(
+      toRegExp
+    )
+    const propertyReferenceExtractor = definePropertyReferenceExtractor(context)
+    const programNode = context.getSourceCode().ast
+
+    /** Vue component context */
+    class VueComponentContext {
+      constructor() {
+        /** @type { Map<string, PropertyData> } */
+        this.defineProperties = new Map()
+
+        /** @type { Set<string | ASTNode> } */
+        this.reported = new Set()
+      }
+      /**
+       * Report
+       * @param {IPropertyReferences} references
+       * @param {object} [options]
+       * @param {boolean} [options.props]
+       */
+      verifyReferences(references, options) {
+        const that = this
+        verifyUndefProperties(this.defineProperties, references, null)
+
+        /**
+         * @param { { get?: (name: string) => PropertyData | null | undefined } } defineProperties
+         * @param {IPropertyReferences|null} references
+         * @param {string|null} pathName
+         */
+        function verifyUndefProperties(defineProperties, references, pathName) {
+          if (!references) {
+            return
+          }
+          for (const [refName, { nodes }] of references.allProperties()) {
+            const referencePathName = pathName
+              ? `${pathName}.${refName}`
+              : refName
+
+            const prop = defineProperties.get && defineProperties.get(refName)
+            if (prop) {
+              if (options && options.props) {
+                if (!prop.isProps) {
+                  that.report(nodes[0], referencePathName, 'undefProps')
+                  continue
+                }
+              }
+            } else {
+              that.report(nodes[0], referencePathName, 'undef')
+              continue
+            }
+
+            if (prop.hasNestProperty) {
+              verifyUndefProperties(
+                prop,
+                references.getNest(refName),
+                referencePathName
+              )
+            }
+          }
+        }
+      }
+      /**
+       * Report
+       * @param {ASTNode} node
+       * @param {string} name
+       * @param {'undef' | 'undefProps'} messageId
+       */
+      report(node, name, messageId = 'undef') {
+        if (
+          reserved.includes(name) ||
+          ignores.some((ignore) => ignore.test(name))
+        ) {
+          return
+        }
+        if (
+          // Prevents reporting to the same node.
+          this.reported.has(node) ||
+          // Prevents reports with the same name.
+          // This is so that intentional undefined properties can be resolved with
+          // a single warning suppression comment (`// eslint-disable-line`).
+          this.reported.has(name)
+        ) {
+          return
+        }
+        this.reported.add(node)
+        this.reported.add(name)
+        context.report({
+          node,
+          messageId,
+          data: {
+            name
+          }
+        })
+      }
+    }
+
+    /** @type {Map<ASTNode, VueComponentContext>} */
+    const vueComponentContextMap = new Map()
+
+    /**
+     * @param {ASTNode} node
+     * @returns {VueComponentContext}
+     */
+    function getVueComponentContext(node) {
+      let ctx = vueComponentContextMap.get(node)
+      if (!ctx) {
+        ctx = new VueComponentContext()
+        vueComponentContextMap.set(node, ctx)
+      }
+      return ctx
+    }
+    /**
+     * @returns {VueComponentContext|void}
+     */
+    function getVueComponentContextForTemplate() {
+      const keys = [...vueComponentContextMap.keys()]
+      const exported =
+        keys.find(isScriptSetupProgram) || keys.find(utils.isInExportDefault)
+      return exported && vueComponentContextMap.get(exported)
+
+      /**
+       * @param {ASTNode} node
+       */
+      function isScriptSetupProgram(node) {
+        return node === programNode
+      }
+    }
+
+    /**
+     * @param {Expression} node
+     * @returns {Property|null}
+     */
+    function getParentProperty(node) {
+      if (
+        !node.parent ||
+        node.parent.type !== 'Property' ||
+        node.parent.value !== node
+      ) {
+        return null
+      }
+      const property = node.parent
+      if (!utils.isProperty(property)) {
+        return null
+      }
+      return property
+    }
+
+    const scriptVisitor = utils.compositingVisitors(
+      {
+        /** @param {Program} node */
+        Program() {
+          if (!utils.isScriptSetup(context)) {
+            return
+          }
+
+          const ctx = getVueComponentContext(programNode)
+          const globalScope = context.getSourceCode().scopeManager.globalScope
+          if (globalScope) {
+            for (const variable of globalScope.variables) {
+              ctx.defineProperties.set(variable.name, {})
+            }
+            const moduleScope = globalScope.childScopes.find(
+              (scope) => scope.type === 'module'
+            )
+            for (const variable of (moduleScope && moduleScope.variables) ||
+              []) {
+              ctx.defineProperties.set(variable.name, {})
+            }
+          }
+        }
+      },
+      utils.defineScriptSetupVisitor(context, {
+        onDefinePropsEnter(node, props) {
+          const ctx = getVueComponentContext(programNode)
+
+          for (const prop of props) {
+            if (!prop.propName) {
+              continue
+            }
+            ctx.defineProperties.set(prop.propName, {
+              isProps: true
+            })
+          }
+          let target = node
+          if (
+            target.parent &&
+            target.parent.type === 'CallExpression' &&
+            target.parent.arguments[0] === target &&
+            target.parent.callee.type === 'Identifier' &&
+            target.parent.callee.name === 'withDefaults'
+          ) {
+            target = target.parent
+          }
+
+          if (
+            !target.parent ||
+            target.parent.type !== 'VariableDeclarator' ||
+            target.parent.init !== target
+          ) {
+            return
+          }
+
+          const pattern = target.parent.id
+          const propertyReferences =
+            propertyReferenceExtractor.extractFromPattern(pattern)
+          ctx.verifyReferences(propertyReferences)
+        }
+      }),
+      utils.defineVueVisitor(context, {
+        onVueObjectEnter(node) {
+          const ctx = getVueComponentContext(node)
+
+          for (const prop of utils.iterateProperties(
+            node,
+            new Set([
+              GROUP_PROPERTY,
+              GROUP_DATA,
+              GROUP_COMPUTED_PROPERTY,
+              GROUP_SETUP,
+              GROUP_METHODS,
+              GROUP_INJECT
+            ])
+          )) {
+            const propertyMap =
+              prop.groupName === GROUP_DATA &&
+              prop.type === 'object' &&
+              prop.property.value.type === 'ObjectExpression'
+                ? getObjectPropertyMap(prop.property.value)
+                : null
+            ctx.defineProperties.set(prop.name, {
+              hasNestProperty: Boolean(propertyMap),
+              isProps: prop.groupName === GROUP_PROPERTY,
+              get(name) {
+                if (!propertyMap) {
+                  return null
+                }
+                return getPropertyDataFromObjectProperty(propertyMap.get(name))
+              }
+            })
+          }
+
+          for (const watcherOrExpose of utils.iterateProperties(
+            node,
+            new Set([GROUP_WATCHER, GROUP_EXPOSE])
+          )) {
+            if (watcherOrExpose.groupName === GROUP_WATCHER) {
+              const watcher = watcherOrExpose
+              // Process `watch: { foo /* <- this */ () {} }`
+              ctx.verifyReferences(
+                propertyReferenceExtractor.extractFromPath(
+                  watcher.name,
+                  watcher.node
+                )
+              )
+              // Process `watch: { x: 'foo' /* <- this */  }`
+              if (watcher.type === 'object') {
+                const property = watcher.property
+                if (property.kind === 'init') {
+                  for (const handlerValueNode of utils.iterateWatchHandlerValues(
+                    property
+                  )) {
+                    ctx.verifyReferences(
+                      propertyReferenceExtractor.extractFromNameLiteral(
+                        handlerValueNode
+                      )
+                    )
+                  }
+                }
+              }
+            } else if (watcherOrExpose.groupName === GROUP_EXPOSE) {
+              const expose = watcherOrExpose
+              ctx.verifyReferences(
+                propertyReferenceExtractor.extractFromName(
+                  expose.name,
+                  expose.node
+                )
+              )
+            }
+          }
+        },
+        /** @param { (FunctionExpression | ArrowFunctionExpression) & { parent: Property }} node */
+        'ObjectExpression > Property > :function[params.length>0]'(
+          node,
+          vueData
+        ) {
+          let props = false
+          const property = getParentProperty(node)
+          if (!property) {
+            return
+          }
+          if (property.parent === vueData.node) {
+            if (utils.getStaticPropertyName(property) !== 'data') {
+              return
+            }
+            // check { data: (vm) => vm.prop }
+            props = true
+          } else {
+            const parentProperty = getParentProperty(property.parent)
+            if (!parentProperty) {
+              return
+            }
+            if (parentProperty.parent === vueData.node) {
+              if (utils.getStaticPropertyName(parentProperty) !== 'computed') {
+                return
+              }
+              // check { computed: { foo: (vm) => vm.prop } }
+            } else {
+              const parentParentProperty = getParentProperty(
+                parentProperty.parent
+              )
+              if (!parentParentProperty) {
+                return
+              }
+              if (parentParentProperty.parent === vueData.node) {
+                if (
+                  utils.getStaticPropertyName(parentParentProperty) !==
+                    'computed' ||
+                  utils.getStaticPropertyName(property) !== 'get'
+                ) {
+                  return
+                }
+                // check { computed: { foo: { get: (vm) => vm.prop } } }
+              } else {
+                return
+              }
+            }
+          }
+
+          const propertyReferences =
+            propertyReferenceExtractor.extractFromFunctionParam(node, 0)
+          const ctx = getVueComponentContext(vueData.node)
+          ctx.verifyReferences(propertyReferences, { props })
+        },
+        onSetupFunctionEnter(node, vueData) {
+          const propertyReferences =
+            propertyReferenceExtractor.extractFromFunctionParam(node, 0)
+          const ctx = getVueComponentContext(vueData.node)
+          ctx.verifyReferences(propertyReferences, {
+            props: true
+          })
+        },
+        onRenderFunctionEnter(node, vueData) {
+          const ctx = getVueComponentContext(vueData.node)
+
+          // Check for Vue 3.x render
+          const propertyReferences =
+            propertyReferenceExtractor.extractFromFunctionParam(node, 0)
+          ctx.verifyReferences(propertyReferences)
+
+          if (vueData.functional) {
+            // Check for Vue 2.x render & functional
+            const propertyReferencesForV2 =
+              propertyReferenceExtractor.extractFromFunctionParam(node, 1)
+
+            ctx.verifyReferences(propertyReferencesForV2.getNest('props'), {
+              props: true
+            })
+          }
+        },
+        /**
+         * @param {ThisExpression | Identifier} node
+         * @param {VueObjectData} vueData
+         */
+        'ThisExpression, Identifier'(node, vueData) {
+          if (!utils.isThis(node, context)) {
+            return
+          }
+          const ctx = getVueComponentContext(vueData.node)
+          const propertyReferences =
+            propertyReferenceExtractor.extractFromExpression(node, false)
+          ctx.verifyReferences(propertyReferences)
+        }
+      }),
+      {
+        'Program:exit'() {
+          const ctx = getVueComponentContextForTemplate()
+          if (!ctx) {
+            return
+          }
+          const styleVars = getStyleVariablesContext(context)
+          if (styleVars) {
+            ctx.verifyReferences(
+              propertyReferenceExtractor.extractFromStyleVariablesContext(
+                styleVars
+              )
+            )
+          }
+        }
+      }
+    )
+
+    const templateVisitor = {
+      /**
+       * @param {VExpressionContainer} node
+       */
+      VExpressionContainer(node) {
+        const ctx = getVueComponentContextForTemplate()
+        if (!ctx) {
+          return
+        }
+        ctx.verifyReferences(
+          propertyReferenceExtractor.extractFromVExpressionContainer(node, {
+            ignoreGlobals: true
+          })
+        )
+      }
+    }
+
+    return utils.defineTemplateBodyVisitor(
+      context,
+      templateVisitor,
+      scriptVisitor
+    )
+  }
+}
diff --git a/lib/rules/no-unused-properties.js b/lib/rules/no-unused-properties.js
index 722e95c31..0a36c6579 100644
--- a/lib/rules/no-unused-properties.js
+++ b/lib/rules/no-unused-properties.js
@@ -79,57 +79,13 @@ const PROPERTY_LABEL = {
 // Helpers
 // ------------------------------------------------------------------------------
 
-/**
- * Find the variable of a given name.
- * @param {RuleContext} context The rule context
- * @param {Identifier} node The variable name to find.
- * @returns {Variable|null} The found variable or null.
- */
-function findVariable(context, node) {
-  return eslintUtils.findVariable(getScope(context, node), node)
-}
-/**
- * Gets the scope for the current node
- * @param {RuleContext} context The rule context
- * @param {ESNode} currentNode The node to get the scope of
- * @returns { import('eslint').Scope.Scope } The scope information for this node
- */
-function getScope(context, currentNode) {
-  // On Program node, get the outermost scope to avoid return Node.js special function scope or ES modules scope.
-  const inner = currentNode.type !== 'Program'
-  const scopeManager = context.getSourceCode().scopeManager
-
-  /** @type {ESNode | null} */
-  let node = currentNode
-  for (; node; node = /** @type {ESNode | null} */ (node.parent)) {
-    const scope = scopeManager.acquire(node, inner)
-
-    if (scope) {
-      if (scope.type === 'function-expression-name') {
-        return scope.childScopes[0]
-      }
-      return scope
-    }
-  }
-
-  return scopeManager.scopes[0]
-}
-
-/**
- * Extract names from references objects.
- * @param {VReference[]} references
- */
-function getReferences(references) {
-  return references.filter((ref) => ref.variable == null).map((ref) => ref.id)
-}
-
 /**
  * @param {RuleContext} context
  * @param {Identifier} id
  * @returns {Expression}
  */
 function findExpression(context, id) {
-  const variable = findVariable(context, id)
+  const variable = utils.findVariableByIdentifier(context, id)
   if (!variable) {
     return id
   }
@@ -503,7 +459,10 @@ module.exports = {
               const watcher = watcherOrExpose
               // Process `watch: { foo /* <- this */ () {} }`
               container.propertyReferences.push(
-                propertyReferenceExtractor.extractFromPath(watcher.name)
+                propertyReferenceExtractor.extractFromPath(
+                  watcher.name,
+                  watcher.node
+                )
               )
 
               // Process `watch: { x: 'foo' /* <- this */  }`
@@ -513,24 +472,21 @@ module.exports = {
                   for (const handlerValueNode of utils.iterateWatchHandlerValues(
                     property
                   )) {
-                    if (
-                      handlerValueNode.type === 'Literal' ||
-                      handlerValueNode.type === 'TemplateLiteral'
-                    ) {
-                      const name = utils.getStringLiteralValue(handlerValueNode)
-                      if (name != null) {
-                        container.propertyReferences.push(
-                          propertyReferenceExtractor.extractFromName(name)
-                        )
-                      }
-                    }
+                    container.propertyReferences.push(
+                      propertyReferenceExtractor.extractFromNameLiteral(
+                        handlerValueNode
+                      )
+                    )
                   }
                 }
               }
             } else if (watcherOrExpose.groupName === GROUP_EXPOSE) {
               const expose = watcherOrExpose
               container.propertyReferences.push(
-                propertyReferenceExtractor.extractFromName(expose.name)
+                propertyReferenceExtractor.extractFromName(
+                  expose.name,
+                  expose.node
+                )
               )
             }
           }
@@ -630,13 +586,11 @@ module.exports = {
         'Program:exit'(node) {
           const styleVars = getStyleVariablesContext(context)
           if (styleVars) {
-            for (const { id } of styleVars.references) {
-              templatePropertiesContainer.propertyReferences.push(
-                propertyReferenceExtractor.extractFromName(id.name, () =>
-                  propertyReferenceExtractor.extractFromExpression(id, true)
-                )
+            templatePropertiesContainer.propertyReferences.push(
+              propertyReferenceExtractor.extractFromStyleVariablesContext(
+                styleVars
               )
-            }
+            )
           }
           if (!node.templateBody) {
             reportUnusedProperties()
@@ -650,13 +604,9 @@ module.exports = {
        * @param {VExpressionContainer} node
        */
       VExpressionContainer(node) {
-        for (const id of getReferences(node.references)) {
-          templatePropertiesContainer.propertyReferences.push(
-            propertyReferenceExtractor.extractFromName(id.name, () =>
-              propertyReferenceExtractor.extractFromExpression(id, true)
-            )
-          )
-        }
+        templatePropertiesContainer.propertyReferences.push(
+          propertyReferenceExtractor.extractFromVExpressionContainer(node)
+        )
       },
       /**
        * @param {VAttribute} node
diff --git a/lib/rules/no-use-computed-property-like-method.js b/lib/rules/no-use-computed-property-like-method.js
index c1c8ca765..d5c4430d7 100644
--- a/lib/rules/no-use-computed-property-like-method.js
+++ b/lib/rules/no-use-computed-property-like-method.js
@@ -11,21 +11,99 @@ const eslintUtils = require('eslint-utils')
 const utils = require('../utils')
 
 /**
- * @typedef {import('../utils').ComponentPropertyData} ComponentPropertyData
+ * @typedef {import('eslint').Scope.Scope} Scope
  * @typedef {import('../utils').ComponentObjectPropertyData} ComponentObjectPropertyData
  * @typedef {import('../utils').GroupName} GroupName
- *
- * @typedef {{[key: string]: ComponentPropertyData & { valueType: { type: string | null } }}} PropertyMap
  */
+
+/**
+ * @typedef {object} CallMember
+ * @property {string} name
+ * @property {CallExpression} node
+ */
+
 // ------------------------------------------------------------------------------
 // Rule Definition
 // ------------------------------------------------------------------------------
 
+/** @type {Set<GroupName>} */
+const GROUPS = new Set(['data', 'props', 'computed', 'methods'])
+
+const NATIVE_NOT_FUNCTION_TYPES = new Set([
+  'String',
+  'Number',
+  'BigInt',
+  'Boolean',
+  'Object',
+  'Array',
+  'Symbol'
+])
+
+/**
+ * @param {RuleContext} context
+ * @param {Expression} node
+ * @returns {Set<Expression>}
+ */
+function resolvedExpressions(context, node) {
+  /** @type {Map<Expression, Set<Expression>>} */
+  const resolvedMap = new Map()
+
+  return resolvedExpressionsInternal(node)
+
+  /**
+   * @param {Expression} node
+   * @returns {Set<Expression>}
+   */
+  function resolvedExpressionsInternal(node) {
+    let resolvedSet = resolvedMap.get(node)
+    if (!resolvedSet) {
+      resolvedSet = new Set()
+      resolvedMap.set(node, resolvedSet)
+      for (const e of extractResolvedExpressions(node)) {
+        resolvedSet.add(e)
+      }
+    }
+
+    if (!resolvedSet.size) {
+      resolvedSet.add(node)
+    }
+
+    return resolvedSet
+  }
+  /**
+   * @param {Expression} node
+   * @returns {Iterable<Expression>}
+   */
+  function* extractResolvedExpressions(node) {
+    if (node.type === 'Identifier') {
+      const variable = utils.findVariableByIdentifier(context, node)
+      if (variable) {
+        for (const ref of variable.references) {
+          const id = ref.identifier
+          if (id.parent.type === 'VariableDeclarator') {
+            if (id.parent.id === id && id.parent.init) {
+              yield* resolvedExpressionsInternal(id.parent.init)
+            }
+          } else if (id.parent.type === 'AssignmentExpression') {
+            if (id.parent.left === id) {
+              yield* resolvedExpressionsInternal(id.parent.right)
+            }
+          }
+        }
+      }
+    } else if (node.type === 'ConditionalExpression') {
+      yield* resolvedExpressionsInternal(node.consequent)
+      yield* resolvedExpressionsInternal(node.alternate)
+    }
+  }
+}
+
 /**
  * Get type of props item.
  * Can't consider array props like: props: {propsA: [String, Number, Function]}
- * @param {ComponentObjectPropertyData} property
- * @return {string | null}
+ * @param {RuleContext} context
+ * @param {ComponentObjectPropertyData} prop
+ * @return {string[] | null}
  *
  * @example
  * props: {
@@ -35,150 +113,367 @@ const utils = require('../utils')
  *   },
  * }
  */
-const getComponentPropsType = (property) => {
+function getComponentPropsTypes(context, prop) {
+  const result = []
+  for (const expr of resolvedExpressions(context, prop.property.value)) {
+    const types = getComponentPropsTypesFromExpression(expr)
+    if (types == null) {
+      return null
+    }
+    result.push(...types)
+  }
+  return result
+
   /**
-   * Check basic props `props: { basicProps: ... }`
+   * @param {Expression} expr
    */
-  if (property.property.value.type === 'Identifier') {
-    return property.property.value.name
+  function getComponentPropsTypesFromExpression(expr) {
+    let typeExprs
+    /**
+     * Check object props `props: { objectProps: {...} }`
+     */
+    if (expr.type === 'ObjectExpression') {
+      const type = utils.findProperty(expr, 'type')
+      if (type == null) return null
+
+      typeExprs = resolvedExpressions(context, type.value)
+    } else {
+      typeExprs = [expr]
+    }
+
+    const result = []
+    for (const typeExpr of typeExprs) {
+      const types = getComponentPropsTypesFromTypeExpression(typeExpr)
+      if (types == null) {
+        return null
+      }
+      result.push(...types)
+    }
+    return result
   }
+
   /**
-   * Check object props `props: { objectProps: {...} }`
+   * @param {Expression} typeExpr
    */
-  if (property.property.value.type === 'ObjectExpression') {
-    const typeProperty = utils.findProperty(property.property.value, 'type')
-    if (typeProperty == null) return null
-
-    if (typeProperty.value.type === 'Identifier') return typeProperty.value.name
+  function getComponentPropsTypesFromTypeExpression(typeExpr) {
+    if (typeExpr.type === 'Identifier') {
+      return [typeExpr.name]
+    }
+    if (typeExpr.type === 'ArrayExpression') {
+      const types = []
+      for (const element of typeExpr.elements) {
+        if (!element) {
+          continue
+        }
+        if (element.type === 'SpreadElement') {
+          return null
+        }
+        for (const elementExpr of resolvedExpressions(context, element)) {
+          if (elementExpr.type !== 'Identifier') {
+            return null
+          }
+          types.push(elementExpr.name)
+        }
+      }
+      return types
+    }
+    return null
   }
-  return null
 }
 
 /**
- *
- * @param {any} obj
- */
-const getPrototypeType = (obj) =>
-  Object.prototype.toString.call(obj).slice(8, -1)
-
-/**
- * Get return type of property.
- * @param {{ property: ComponentPropertyData, propertyMap?: PropertyMap }} args
- * @returns {{type: string | null | 'ReturnStatementHasNotArgument'}}
+ * Check whether given expression may be a function.
+ * @param {RuleContext} context
+ * @param {Expression} node
+ * @returns {boolean}
  */
-const getValueType = ({ property, propertyMap }) => {
-  if (property.type === 'array') {
-    return {
-      type: null
+function maybeFunction(context, node) {
+  for (const expr of resolvedExpressions(context, node)) {
+    if (
+      expr.type === 'ObjectExpression' ||
+      expr.type === 'ArrayExpression' ||
+      expr.type === 'Literal' ||
+      expr.type === 'TemplateLiteral' ||
+      expr.type === 'BinaryExpression' ||
+      expr.type === 'LogicalExpression' ||
+      expr.type === 'UnaryExpression' ||
+      expr.type === 'UpdateExpression'
+    ) {
+      continue
     }
-  }
-
-  if (property.type === 'object') {
-    if (property.groupName === 'props') {
-      return {
-        type: getComponentPropsType(property)
+    if (expr.type === 'ConditionalExpression') {
+      if (
+        !maybeFunction(context, expr.consequent) &&
+        !maybeFunction(context, expr.alternate)
+      ) {
+        continue
       }
     }
+    const evaluated = eslintUtils.getStaticValue(
+      expr,
+      utils.getScope(context, expr)
+    )
+    if (!evaluated) {
+      // It could be a function because we don't know what it is.
+      return true
+    }
+    if (typeof evaluated.value === 'function') {
+      return true
+    }
+  }
+  return false
+}
 
-    if (property.groupName === 'computed' || property.groupName === 'methods') {
-      if (
-        property.property.value.type === 'FunctionExpression' &&
-        property.property.value.body.type === 'BlockStatement'
-      ) {
-        const blockStatement = property.property.value.body
+class FunctionData {
+  /**
+   * @param {string} name
+   * @param {'methods' | 'computed'} kind
+   * @param {FunctionExpression | ArrowFunctionExpression} node
+   * @param {RuleContext} context
+   */
+  constructor(name, kind, node, context) {
+    this.context = context
+    this.name = name
+    this.kind = kind
+    this.node = node
+    /** @type {(Expression | null)[]} */
+    this.returnValues = []
+    /** @type {boolean | null} */
+    this.cacheMaybeReturnFunction = null
+  }
 
-        /**
-         * Only check return statement inside computed and methods
-         */
-        const returnStatement = blockStatement.body.find(
-          (b) => b.type === 'ReturnStatement'
-        )
+  /**
+   * @param {Expression | null} node
+   */
+  addReturnValue(node) {
+    this.returnValues.push(node)
+  }
 
-        if (!returnStatement || returnStatement.type !== 'ReturnStatement')
-          return {
-            type: null
-          }
+  /**
+   * @param {ComponentStack} component
+   */
+  maybeReturnFunction(component) {
+    if (this.cacheMaybeReturnFunction != null) {
+      return this.cacheMaybeReturnFunction
+    }
+    // Avoid infinite recursion.
+    this.cacheMaybeReturnFunction = true
 
-        if (returnStatement.argument === null)
-          return {
-            type: 'ReturnStatementHasNotArgument'
-          }
+    return (this.cacheMaybeReturnFunction = this.returnValues.some(
+      (returnValue) =>
+        returnValue && component.maybeFunctionExpression(returnValue)
+    ))
+  }
+}
 
-        if (
-          property.groupName === 'computed' &&
-          propertyMap &&
-          propertyMap[property.name] &&
-          returnStatement.argument
-        ) {
-          if (
-            returnStatement.argument.type === 'MemberExpression' &&
-            returnStatement.argument.object.type === 'ThisExpression' &&
-            returnStatement.argument.property.type === 'Identifier'
-          )
-            return {
-              type: propertyMap[returnStatement.argument.property.name]
-                .valueType.type
-            }
+/** Component information class. */
+class ComponentStack {
+  /**
+   * @param {ObjectExpression} node
+   * @param {RuleContext} context
+   * @param {ComponentStack | null} upper
+   */
+  constructor(node, context, upper) {
+    this.node = node
+    this.context = context
+    /** Upper scope component */
+    this.upper = upper
 
-          if (
-            returnStatement.argument.type === 'CallExpression' &&
-            returnStatement.argument.callee.type === 'MemberExpression' &&
-            returnStatement.argument.callee.object.type === 'ThisExpression' &&
-            returnStatement.argument.callee.property.type === 'Identifier'
-          )
-            return {
-              type: propertyMap[returnStatement.argument.callee.property.name]
-                .valueType.type
-            }
-        }
+    /** @type {Map<string, boolean>} */
+    const maybeFunctions = new Map()
+    /** @type {FunctionData[]} */
+    const functions = []
 
-        /**
-         * Use value as Object even if object includes method
-         */
-        if (
-          property.groupName === 'computed' &&
-          returnStatement.argument.type === 'ObjectExpression'
-        ) {
-          return {
-            type: 'Object'
+    // Extract properties
+    for (const property of utils.iterateProperties(node, GROUPS)) {
+      if (property.type === 'array') {
+        continue
+      }
+      if (property.groupName === 'data') {
+        maybeFunctions.set(
+          property.name,
+          maybeFunction(context, property.property.value)
+        )
+      } else if (property.groupName === 'props') {
+        const types = getComponentPropsTypes(context, property)
+        maybeFunctions.set(
+          property.name,
+          !types || types.some((type) => !NATIVE_NOT_FUNCTION_TYPES.has(type))
+        )
+      } else if (property.groupName === 'computed') {
+        let value = property.property.value
+        if (value.type === 'ObjectExpression') {
+          const getProp = utils.findProperty(value, 'get')
+          if (getProp) {
+            value = getProp.value
           }
         }
+        processFunction(property.name, value, 'computed')
+      } else if (property.groupName === 'methods') {
+        const value = property.property.value
+        processFunction(property.name, value, 'methods')
+        maybeFunctions.set(property.name, true)
+      }
+    }
+    this.maybeFunctions = maybeFunctions
+    this.functions = functions
+    /** @type {CallMember[]} */
+    this.callMembers = []
+    /** @type {Map<Expression, boolean>} */
+    this.cacheMaybeFunctionExpressions = new Map()
 
-        const evaluated = eslintUtils.getStaticValue(returnStatement.argument)
-
-        if (evaluated) {
-          return {
-            type: getPrototypeType(evaluated.value)
-          }
+    /**
+     * @param {string} name
+     * @param {Expression} value
+     * @param {'methods' | 'computed'} kind
+     */
+    function processFunction(name, value, kind) {
+      if (value.type === 'FunctionExpression') {
+        functions.push(new FunctionData(name, kind, value, context))
+      } else if (value.type === 'ArrowFunctionExpression') {
+        const data = new FunctionData(name, kind, value, context)
+        if (value.expression) {
+          data.addReturnValue(value.body)
         }
+        functions.push(data)
       }
     }
+  }
 
-    const evaluated = eslintUtils.getStaticValue(property.property.value)
-
-    if (evaluated) {
-      return {
-        type: getPrototypeType(evaluated.value)
+  /**
+   * Adds the given return statement to the return value of the function.
+   * @param {FunctionExpression | ArrowFunctionExpression | FunctionDeclaration} scopeFunction
+   * @param {ReturnStatement} returnNode
+   */
+  addReturnStatement(scopeFunction, returnNode) {
+    for (const data of this.functions) {
+      if (data.node === scopeFunction) {
+        data.addReturnValue(returnNode.argument)
+        break
       }
     }
   }
-  return {
-    type: null
+
+  verifyComponent() {
+    for (const call of this.callMembers) {
+      this.verifyCallMember(call)
+    }
   }
-}
 
-/**
- * @param {Set<GroupName>} groups
- * @param {ObjectExpression} vueNodeMap
- * @param {PropertyMap} propertyMap
- */
-const addPropertyMap = (groups, vueNodeMap, propertyMap) => {
-  const properties = utils.iterateProperties(vueNodeMap, groups)
-  for (const property of properties) {
-    propertyMap[property.name] = {
-      ...propertyMap[property.name],
-      ...property,
-      valueType: getValueType({ property, propertyMap })
+  /**
+   * @param {CallMember} call
+   */
+  verifyCallMember(call) {
+    const fnData = this.functions.find(
+      (data) => data.name === call.name && data.kind === 'computed'
+    )
+    if (!fnData) {
+      // It is not computed, or unknown.
+      return
+    }
+
+    if (!fnData.maybeReturnFunction(this)) {
+      const prefix = call.node.callee.type === 'MemberExpression' ? 'this.' : ''
+      this.context.report({
+        node: call.node,
+        messageId: 'unexpected',
+        data: {
+          likeProperty: `${prefix}${call.name}`,
+          likeMethod: `${prefix}${call.name}()`
+        }
+      })
+    }
+  }
+
+  /**
+   * Check whether given expression may be a function.
+   * @param {Expression} node
+   * @returns {boolean}
+   */
+  maybeFunctionExpression(node) {
+    const cache = this.cacheMaybeFunctionExpressions.get(node)
+    if (cache != null) {
+      return cache
+    }
+    // Avoid infinite recursion.
+    this.cacheMaybeFunctionExpressions.set(node, true)
+
+    const result = maybeFunctionExpressionWithoutCache.call(this)
+    this.cacheMaybeFunctionExpressions.set(node, result)
+    return result
+
+    /**
+     * @this {ComponentStack}
+     */
+    function maybeFunctionExpressionWithoutCache() {
+      for (const expr of resolvedExpressions(this.context, node)) {
+        if (!maybeFunction(this.context, expr)) {
+          continue
+        }
+        if (expr.type === 'MemberExpression') {
+          if (utils.isThis(expr.object, this.context)) {
+            const name = utils.getStaticPropertyName(expr)
+            if (name && !this.maybeFunctionProperty(name)) {
+              continue
+            }
+          }
+        } else if (expr.type === 'CallExpression') {
+          if (
+            expr.callee.type === 'MemberExpression' &&
+            utils.isThis(expr.callee.object, this.context)
+          ) {
+            const name = utils.getStaticPropertyName(expr.callee)
+            const fnData = this.functions.find((data) => data.name === name)
+            if (
+              fnData &&
+              fnData.kind === 'methods' &&
+              !fnData.maybeReturnFunction(this)
+            ) {
+              continue
+            }
+          }
+        } else if (expr.type === 'ConditionalExpression') {
+          if (
+            !this.maybeFunctionExpression(expr.consequent) &&
+            !this.maybeFunctionExpression(expr.alternate)
+          ) {
+            continue
+          }
+        }
+        // It could be a function because we don't know what it is.
+        return true
+      }
+      return false
+    }
+  }
+
+  /**
+   * Check whether given property name may be a function.
+   * @param {string} name
+   * @returns {boolean}
+   */
+  maybeFunctionProperty(name) {
+    const cache = this.maybeFunctions.get(name)
+    if (cache != null) {
+      return cache
+    }
+    // Avoid infinite recursion.
+    this.maybeFunctions.set(name, true)
+
+    const result = maybeFunctionPropertyWithoutCache.call(this)
+    this.maybeFunctions.set(name, result)
+    return result
+
+    /**
+     * @this {ComponentStack}
+     */
+    function maybeFunctionPropertyWithoutCache() {
+      const fnData = this.functions.find((data) => data.name === name)
+      if (fnData && fnData.kind === 'computed') {
+        return fnData.maybeReturnFunction(this)
+      }
+      // It could be a function because we don't know what it is.
+      return true
     }
   }
 }
@@ -199,63 +494,99 @@ module.exports = {
   },
   /** @param {RuleContext} context */
   create(context) {
-    /** @type {GroupName[]} */
-    const GROUP_NAMES = ['data', 'props', 'computed', 'methods']
-    const groups = new Set(GROUP_NAMES)
-
-    /** @type {PropertyMap} */
-    const propertyMap = Object.create(null)
-
-    return utils.defineVueVisitor(context, {
-      onVueObjectEnter(node) {
-        const properties = utils.iterateProperties(node, groups)
-
-        for (const property of properties) {
-          propertyMap[property.name] = {
-            ...propertyMap[property.name],
-            ...property,
-            valueType: getValueType({ property })
-          }
-        }
-      },
+    /**
+     * @typedef {object} ScopeStack
+     * @property {ScopeStack | null} upper
+     * @property {FunctionDeclaration | FunctionExpression | ArrowFunctionExpression} scopeNode
+     */
+    /** @type {ScopeStack | null} */
+    let scopeStack = null
 
-      /** @param {ThisExpression} node */
-      'CallExpression > MemberExpression > ThisExpression'(
-        node,
-        { node: vueNode }
-      ) {
-        addPropertyMap(groups, vueNode, propertyMap)
+    /** @type {ComponentStack | null} */
+    let componentStack = null
+    /** @type {ComponentStack | null} */
+    let templateComponent = null
 
-        if (node.parent.type !== 'MemberExpression') return
-        if (node.parent.property.type !== 'Identifier') return
-        if (node.parent.parent.type !== 'CallExpression') return
-        if (node.parent.parent.callee.type !== 'MemberExpression') return
-        if (!Object.is(node.parent.parent.callee, node.parent)) return
-
-        const thisMember = node.parent.property.name
+    return utils.compositingVisitors(
+      {},
+      utils.defineVueVisitor(context, {
+        onVueObjectEnter(node) {
+          componentStack = new ComponentStack(node, context, componentStack)
+          if (!templateComponent && utils.isInExportDefault(node)) {
+            templateComponent = componentStack
+          }
+        },
+        onVueObjectExit() {
+          if (componentStack) {
+            componentStack.verifyComponent()
+            componentStack = componentStack.upper
+          }
+        },
+        /**
+         * @param {FunctionExpression | FunctionDeclaration | ArrowFunctionExpression} node
+         */
+        ':function'(node) {
+          scopeStack = {
+            upper: scopeStack,
+            scopeNode: node
+          }
+        },
+        ReturnStatement(node) {
+          if (scopeStack && componentStack) {
+            componentStack.addReturnStatement(scopeStack.scopeNode, node)
+          }
+        },
+        ':function:exit'() {
+          scopeStack = scopeStack && scopeStack.upper
+        },
 
-        if (
-          !propertyMap[thisMember] ||
-          !propertyMap[thisMember].valueType ||
-          !propertyMap[thisMember].valueType.type
-        )
-          return
-
-        if (
-          propertyMap[thisMember].groupName === 'computed' &&
-          propertyMap[thisMember].valueType.type !== 'Function'
-        ) {
-          context.report({
-            node: node.parent.parent,
-            loc: node.parent.parent.loc,
-            messageId: 'unexpected',
-            data: {
-              likeProperty: `this.${thisMember}`,
-              likeMethod: `this.${thisMember}()`
+        /**
+         * @param {ThisExpression | Identifier} node
+         */
+        'ThisExpression, Identifier'(node) {
+          if (
+            !componentStack ||
+            node.parent.type !== 'MemberExpression' ||
+            node.parent.object !== node ||
+            node.parent.parent.type !== 'CallExpression' ||
+            node.parent.parent.callee !== node.parent ||
+            !utils.isThis(node, context)
+          ) {
+            return
+          }
+          const name = utils.getStaticPropertyName(node.parent)
+          if (name) {
+            componentStack.callMembers.push({
+              name,
+              node: node.parent.parent
+            })
+          }
+        }
+      }),
+      utils.defineTemplateBodyVisitor(context, {
+        /**
+         * @param {VExpressionContainer} node
+         */
+        VExpressionContainer(node) {
+          if (!templateComponent) {
+            return
+          }
+          for (const id of node.references
+            .filter((ref) => ref.variable == null)
+            .map((ref) => ref.id)) {
+            if (
+              id.parent.type !== 'CallExpression' ||
+              id.parent.callee !== id
+            ) {
+              continue
             }
-          })
+            templateComponent.verifyCallMember({
+              name: id.name,
+              node: id.parent
+            })
+          }
         }
-      }
-    })
+      })
+    )
   }
 }
diff --git a/lib/rules/valid-define-emits.js b/lib/rules/valid-define-emits.js
index 6b79e83cc..b16fc300e 100644
--- a/lib/rules/valid-define-emits.js
+++ b/lib/rules/valid-define-emits.js
@@ -70,8 +70,8 @@ module.exports = {
           }
         },
         Identifier(node) {
-          for (const def of emitsDefExpressions) {
-            if (utils.inRange(def.range, node)) {
+          for (const defineEmits of emitsDefExpressions) {
+            if (utils.inRange(defineEmits.range, node)) {
               const variable = findVariable(context.getScope(), node)
               if (
                 variable &&
@@ -79,10 +79,15 @@ module.exports = {
               ) {
                 if (
                   variable.defs.length &&
-                  variable.defs.every((def) =>
-                    utils.inRange(scriptSetup.range, def.name)
+                  variable.defs.every(
+                    (def) =>
+                      utils.inRange(scriptSetup.range, def.name) &&
+                      !utils.inRange(defineEmits.range, def.name)
                   )
                 ) {
+                  if (utils.withinTypeNode(node)) {
+                    continue
+                  }
                   //`defineEmits` are referencing locally declared variables.
                   context.report({
                     node,
diff --git a/lib/rules/valid-define-props.js b/lib/rules/valid-define-props.js
index 613916659..273eae70a 100644
--- a/lib/rules/valid-define-props.js
+++ b/lib/rules/valid-define-props.js
@@ -71,8 +71,8 @@ module.exports = {
           }
         },
         Identifier(node) {
-          for (const def of propsDefExpressions) {
-            if (utils.inRange(def.range, node)) {
+          for (const defineProps of propsDefExpressions) {
+            if (utils.inRange(defineProps.range, node)) {
               const variable = findVariable(context.getScope(), node)
               if (
                 variable &&
@@ -80,10 +80,15 @@ module.exports = {
               ) {
                 if (
                   variable.defs.length &&
-                  variable.defs.every((def) =>
-                    utils.inRange(scriptSetup.range, def.name)
+                  variable.defs.every(
+                    (def) =>
+                      utils.inRange(scriptSetup.range, def.name) &&
+                      !utils.inRange(defineProps.range, def.name)
                   )
                 ) {
+                  if (utils.withinTypeNode(node)) {
+                    continue
+                  }
                   //`defineProps` are referencing locally declared variables.
                   context.report({
                     node,
diff --git a/lib/utils/indent-ts.js b/lib/utils/indent-ts.js
index ed2080750..b98e9d105 100644
--- a/lib/utils/indent-ts.js
+++ b/lib/utils/indent-ts.js
@@ -12,6 +12,7 @@ const {
   isClosingBracketToken,
   isOpeningBracketToken
 } = require('eslint-utils')
+const { isTypeNode } = require('./ts-ast-utils')
 
 /**
  * @typedef {import('../../typings/eslint-plugin-vue/util-types/indent-helper').TSNodeListener} TSNodeListener
@@ -224,46 +225,9 @@ function defineVisitor({
      */
     // eslint-disable-next-line complexity -- ignore
     '*[type=/^TS/]'(node) {
-      if (
-        node.type !== 'TSAnyKeyword' &&
-        node.type !== 'TSArrayType' &&
-        node.type !== 'TSBigIntKeyword' &&
-        node.type !== 'TSBooleanKeyword' &&
-        node.type !== 'TSConditionalType' &&
-        node.type !== 'TSConstructorType' &&
-        node.type !== 'TSFunctionType' &&
-        node.type !== 'TSImportType' &&
-        node.type !== 'TSIndexedAccessType' &&
-        node.type !== 'TSInferType' &&
-        node.type !== 'TSIntersectionType' &&
-        node.type !== 'TSIntrinsicKeyword' &&
-        node.type !== 'TSLiteralType' &&
-        node.type !== 'TSMappedType' &&
-        node.type !== 'TSNamedTupleMember' &&
-        node.type !== 'TSNeverKeyword' &&
-        node.type !== 'TSNullKeyword' &&
-        node.type !== 'TSNumberKeyword' &&
-        node.type !== 'TSObjectKeyword' &&
-        node.type !== 'TSOptionalType' &&
-        node.type !== 'TSRestType' &&
-        node.type !== 'TSStringKeyword' &&
-        node.type !== 'TSSymbolKeyword' &&
-        node.type !== 'TSTemplateLiteralType' &&
-        node.type !== 'TSThisType' &&
-        node.type !== 'TSTupleType' &&
-        node.type !== 'TSTypeLiteral' &&
-        node.type !== 'TSTypeOperator' &&
-        node.type !== 'TSTypePredicate' &&
-        node.type !== 'TSTypeQuery' &&
-        node.type !== 'TSTypeReference' &&
-        node.type !== 'TSUndefinedKeyword' &&
-        node.type !== 'TSUnionType' &&
-        node.type !== 'TSUnknownKeyword' &&
-        node.type !== 'TSVoidKeyword'
-      ) {
+      if (!isTypeNode(node)) {
         return
       }
-      /** @type {TypeNode} */
       const typeNode = node
       if (/** @type {any} */ (typeNode.parent).type === 'TSParenthesizedType') {
         return
diff --git a/lib/utils/index.js b/lib/utils/index.js
index b17de0821..5c49d15f2 100644
--- a/lib/utils/index.js
+++ b/lib/utils/index.js
@@ -54,7 +54,8 @@ const { traverseNodes, getFallbackKeys } = vueEslintParser.AST
 const { findVariable } = require('eslint-utils')
 const {
   getComponentPropsFromTypeDefine,
-  getComponentEmitsFromTypeDefine
+  getComponentEmitsFromTypeDefine,
+  isTypeNode
 } = require('./ts-ast-utils')
 
 /**
@@ -1717,6 +1718,18 @@ module.exports = {
    * Retrieve `ChainExpression#expression` value if the given node a `ChainExpression` node. Otherwise, pass through it.
    */
   skipChainExpression,
+  /**
+   * Checks whether the given node is in a type annotation.
+   */
+  withinTypeNode,
+  findVariableByIdentifier,
+  getScope,
+  /**
+   * Checks whether the given node is in export default.
+   * @param {ASTNode} node
+   * @returns {boolean}
+   */
+  isInExportDefault,
 
   /**
    * Check whether the given node is `this` or variable that stores `this`.
@@ -2004,6 +2017,43 @@ function compositingVisitors(visitor, ...visitors) {
 // AST Helpers
 // ------------------------------------------------------------------------------
 
+/**
+ * Find the variable of a given identifier.
+ * @param {RuleContext} context The rule context
+ * @param {Identifier} node The variable name to find.
+ * @returns {Variable|null} The found variable or null.
+ */
+function findVariableByIdentifier(context, node) {
+  return findVariable(getScope(context, node), node)
+}
+
+/**
+ * Gets the scope for the current node
+ * @param {RuleContext} context The rule context
+ * @param {ESNode} currentNode The node to get the scope of
+ * @returns { import('eslint').Scope.Scope } The scope information for this node
+ */
+function getScope(context, currentNode) {
+  // On Program node, get the outermost scope to avoid return Node.js special function scope or ES modules scope.
+  const inner = currentNode.type !== 'Program'
+  const scopeManager = context.getSourceCode().scopeManager
+
+  /** @type {ESNode | null} */
+  let node = currentNode
+  for (; node; node = /** @type {ESNode | null} */ (node.parent)) {
+    const scope = scopeManager.acquire(node, inner)
+
+    if (scope) {
+      if (scope.type === 'function-expression-name') {
+        return scope.childScopes[0]
+      }
+      return scope
+    }
+  }
+
+  return scopeManager.scopes[0]
+}
+
 /**
  * Finds the property with the given name from the given ObjectExpression node.
  * @param {ObjectExpression} node
@@ -2081,6 +2131,23 @@ function isVElement(node) {
   return node.type === 'VElement'
 }
 
+/**
+ * Checks whether the given node is in export default.
+ * @param {ASTNode} node
+ * @returns {boolean}
+ */
+function isInExportDefault(node) {
+  /** @type {ASTNode | null} */
+  let parent = node.parent
+  while (parent) {
+    if (parent.type === 'ExportDefaultDeclaration') {
+      return true
+    }
+    parent = parent.parent
+  }
+  return false
+}
+
 /**
  * Retrieve `TSAsExpression#expression` value if the given node a `TSAsExpression` node. Otherwise, pass through it.
  * @template T Node type
@@ -2164,6 +2231,23 @@ function skipChainExpression(node) {
   return node
 }
 
+/**
+ * Checks whether the given node is in a type annotation.
+ * @param {ESNode} node
+ * @returns {boolean}
+ */
+function withinTypeNode(node) {
+  /** @type {ASTNode | null} */
+  let target = node
+  while (target) {
+    if (isTypeNode(target)) {
+      return true
+    }
+    target = target.parent
+  }
+  return false
+}
+
 /**
  * Gets the property name of a given node.
  * @param {Property|AssignmentProperty|MethodDefinition|MemberExpression} node - The node to get.
diff --git a/lib/utils/property-references.js b/lib/utils/property-references.js
index 2291ea717..37709ee0b 100644
--- a/lib/utils/property-references.js
+++ b/lib/utils/property-references.js
@@ -9,7 +9,7 @@ const utils = require('./index')
 const eslintUtils = require('eslint-utils')
 
 /**
- * @typedef {'props' | 'data' | 'computed' | 'methods' | 'setup'} Group
+ * @typedef {import('./style-variables').StyleVariablesContext} StyleVariablesContext
  */
 /**
  * @typedef {object} IHasPropertyOption
@@ -18,6 +18,7 @@ const eslintUtils = require('eslint-utils')
 /**
  * @typedef {object} IPropertyReferences
  * @property { (name: string, option?: IHasPropertyOption) => boolean } hasProperty
+ * @property { () => Map<string, {nodes:ASTNode[]}> } allProperties
  * @property { (name: string) => IPropertyReferences } getNest
  */
 
@@ -28,58 +29,24 @@ const eslintUtils = require('eslint-utils')
 /** @type {IPropertyReferences} */
 const ANY = {
   hasProperty: () => true,
+  allProperties: () => new Map(),
   getNest: () => ANY
 }
 
 /** @type {IPropertyReferences} */
 const NEVER = {
   hasProperty: () => false,
+  allProperties: () => new Map(),
   getNest: () => NEVER
 }
 
-/**
- * Find the variable of a given name.
- * @param {RuleContext} context The rule context
- * @param {Identifier} node The variable name to find.
- * @returns {Variable|null} The found variable or null.
- */
-function findVariable(context, node) {
-  return eslintUtils.findVariable(getScope(context, node), node)
-}
-/**
- * Gets the scope for the current node
- * @param {RuleContext} context The rule context
- * @param {ESNode} currentNode The node to get the scope of
- * @returns { import('eslint').Scope.Scope } The scope information for this node
- */
-function getScope(context, currentNode) {
-  // On Program node, get the outermost scope to avoid return Node.js special function scope or ES modules scope.
-  const inner = currentNode.type !== 'Program'
-  const scopeManager = context.getSourceCode().scopeManager
-
-  /** @type {ESNode | null} */
-  let node = currentNode
-  for (; node; node = /** @type {ESNode | null} */ (node.parent)) {
-    const scope = scopeManager.acquire(node, inner)
-
-    if (scope) {
-      if (scope.type === 'function-expression-name') {
-        return scope.childScopes[0]
-      }
-      return scope
-    }
-  }
-
-  return scopeManager.scopes[0]
-}
-
 /**
  * @param {RuleContext} context
  * @param {Identifier} id
  * @returns {FunctionExpression | ArrowFunctionExpression | FunctionDeclaration | null}
  */
 function findFunction(context, id) {
-  const calleeVariable = findVariable(context, id)
+  const calleeVariable = utils.findVariableByIdentifier(context, id)
   if (!calleeVariable) {
     return null
   }
@@ -186,6 +153,10 @@ function definePropertyReferenceExtractor(context) {
       return name === this.name
     }
 
+    allProperties() {
+      return new Map([[this.name, { nodes: [this.node.property] }]])
+    }
+
     /**
      * @param {string} name
      * @returns {IPropertyReferences}
@@ -213,6 +184,14 @@ function definePropertyReferenceExtractor(context) {
       return Boolean(this.properties[name])
     }
 
+    allProperties() {
+      const result = new Map()
+      for (const [name, nodes] of Object.entries(this.properties)) {
+        result.set(name, { nodes: nodes.map((node) => node.key) })
+      }
+      return result
+    }
+
     /**
      * @param {string} name
      * @returns {IPropertyReferences}
@@ -405,7 +384,7 @@ function definePropertyReferenceExtractor(context) {
    * @returns {IPropertyReferences}
    */
   function extractFromIdentifier(node) {
-    const variable = findVariable(context, node)
+    const variable = utils.findVariableByIdentifier(context, node)
     if (!variable) {
       return NEVER
     }
@@ -429,6 +408,7 @@ function definePropertyReferenceExtractor(context) {
         hasProperty(_name, options) {
           return Boolean(options && options.unknownCallAsAny)
         },
+        allProperties: () => new Map(),
         getNest: () => ANY
       }
     }
@@ -446,6 +426,7 @@ function definePropertyReferenceExtractor(context) {
         hasProperty(_name, options) {
           return Boolean(options && options.unknownCallAsAny)
         },
+        allProperties: () => new Map(),
         getNest: () => ANY
       }
     }
@@ -482,9 +463,10 @@ function definePropertyReferenceExtractor(context) {
   /**
    * Extract the property references from path.
    * @param {string} pathString
+   * @param {Identifier | Literal | TemplateLiteral} node
    * @returns {IPropertyReferences}
    */
-  function extractFromPath(pathString) {
+  function extractFromPath(pathString, node) {
     return extractFromSegments(pathString.split('.'))
 
     /**
@@ -498,21 +480,45 @@ function definePropertyReferenceExtractor(context) {
       const segmentName = segments[0]
       return {
         hasProperty: (name) => name === segmentName,
+        allProperties: () => new Map([[segmentName, { nodes: [node] }]]),
         getNest: (name) =>
           name === segmentName ? extractFromSegments(segments.slice(1)) : NEVER
       }
     }
   }
 
+  /**
+   * Extract the property references from name literal.
+   * @param {Expression} node
+   * @returns {IPropertyReferences}
+   */
+  function extractFromNameLiteral(node) {
+    const referenceName =
+      node.type === 'Literal' || node.type === 'TemplateLiteral'
+        ? utils.getStringLiteralValue(node)
+        : null
+    if (referenceName) {
+      return {
+        hasProperty: (name) => name === referenceName,
+        allProperties: () => new Map([[referenceName, { nodes: [node] }]]),
+        getNest: (name) => (name === referenceName ? ANY : NEVER)
+      }
+    } else {
+      return NEVER
+    }
+  }
+
   /**
    * Extract the property references from name.
    * @param {string} referenceName
+   * @param {Expression|SpreadElement} nameNode
    * @param { () => IPropertyReferences } [getNest]
    * @returns {IPropertyReferences}
    */
-  function extractFromName(referenceName, getNest) {
+  function extractFromName(referenceName, nameNode, getNest) {
     return {
       hasProperty: (name) => name === referenceName,
+      allProperties: () => new Map([[referenceName, { nodes: [nameNode] }]]),
       getNest: (name) =>
         name === referenceName ? (getNest ? getNest() : ANY) : NEVER
     }
@@ -534,7 +540,7 @@ function definePropertyReferenceExtractor(context) {
       // unknown name
       return ANY
     }
-    return extractFromName(refName, () => {
+    return extractFromName(refName, nameNode, () => {
       return extractFromExpression(node, false).getNest('value')
     })
   }
@@ -548,15 +554,67 @@ function definePropertyReferenceExtractor(context) {
     const base = extractFromExpression(node, false)
     return {
       hasProperty: (name, option) => base.hasProperty(name, option),
+      allProperties: () => base.allProperties(),
       getNest: (name) => base.getNest(name).getNest('value')
     }
   }
+
+  /**
+   * Extract the property references from VExpressionContainer.
+   * @param {VExpressionContainer} node
+   * @param {object} [options]
+   * @param {boolean} [options.ignoreGlobals]
+   * @returns {IPropertyReferences}
+   */
+  function extractFromVExpressionContainer(node, options) {
+    const ignoreGlobals = options && options.ignoreGlobals
+
+    /** @type { (name:string)=>boolean } */
+    let ignoreRef = () => false
+    if (ignoreGlobals) {
+      const globalScope =
+        context.getSourceCode().scopeManager.globalScope ||
+        context.getSourceCode().scopeManager.scopes[0]
+
+      ignoreRef = (name) => globalScope.set.has(name)
+    }
+    const references = []
+    for (const id of node.references
+      .filter((ref) => ref.variable == null)
+      .map((ref) => ref.id)) {
+      if (ignoreRef(id.name)) {
+        continue
+      }
+      references.push(
+        extractFromName(id.name, id, () => extractFromExpression(id, true))
+      )
+    }
+    return mergePropertyReferences(references)
+  }
+  /**
+   * Extract the property references from StyleVariablesContext.
+   * @param {StyleVariablesContext} ctx
+   * @returns {IPropertyReferences}
+   */
+  function extractFromStyleVariablesContext(ctx) {
+    const references = []
+    for (const { id } of ctx.references) {
+      references.push(
+        extractFromName(id.name, id, () => extractFromExpression(id, true))
+      )
+    }
+    return mergePropertyReferences(references)
+  }
+
   return {
     extractFromExpression,
     extractFromPattern,
     extractFromFunctionParam,
     extractFromPath,
-    extractFromName
+    extractFromName,
+    extractFromNameLiteral,
+    extractFromVExpressionContainer,
+    extractFromStyleVariablesContext
   }
 }
 
@@ -594,6 +652,21 @@ class PropertyReferencesForMerge {
     return this.references.some((ref) => ref.hasProperty(name, option))
   }
 
+  allProperties() {
+    const result = new Map()
+    for (const reference of this.references) {
+      for (const [name, { nodes }] of reference.allProperties()) {
+        const r = result.get(name)
+        if (r) {
+          r.nodes = [...new Set([...r.nodes, ...nodes])]
+        } else {
+          result.set(name, { nodes: [...nodes] })
+        }
+      }
+    }
+    return result
+  }
+
   /**
    * @param {string} name
    * @returns {IPropertyReferences}
diff --git a/lib/utils/style-variables/index.js b/lib/utils/style-variables/index.js
index 63caf208a..3127166a4 100644
--- a/lib/utils/style-variables/index.js
+++ b/lib/utils/style-variables/index.js
@@ -1,9 +1,5 @@
 const { isVElement } = require('..')
 
-module.exports = {
-  getStyleVariablesContext
-}
-
 class StyleVariablesContext {
   /**
    * @param {RuleContext} context
@@ -31,6 +27,11 @@ class StyleVariablesContext {
   }
 }
 
+module.exports = {
+  getStyleVariablesContext,
+  StyleVariablesContext
+}
+
 /** @type {Map<VElement, StyleVariablesContext>} */
 const cache = new Map()
 /**
diff --git a/lib/utils/ts-ast-utils.js b/lib/utils/ts-ast-utils.js
index b801b6374..6777859b8 100644
--- a/lib/utils/ts-ast-utils.js
+++ b/lib/utils/ts-ast-utils.js
@@ -4,6 +4,7 @@ const { findVariable } = require('eslint-utils')
  * @typedef {import('@typescript-eslint/types').TSESTree.TSInterfaceBody} TSInterfaceBody
  * @typedef {import('@typescript-eslint/types').TSESTree.TSTypeLiteral} TSTypeLiteral
  * @typedef {import('@typescript-eslint/types').TSESTree.Parameter} TSESTreeParameter
+ * @typedef {import('@typescript-eslint/types').TSESTree.Node} Node
  *
  */
 /**
@@ -12,10 +13,55 @@ const { findVariable } = require('eslint-utils')
  */
 
 module.exports = {
+  isTypeNode,
   getComponentPropsFromTypeDefine,
   getComponentEmitsFromTypeDefine
 }
 
+/**
+ * @param {Node | ASTNode} node
+ * @returns {node is TypeNode}
+ */
+function isTypeNode(node) {
+  return (
+    node.type === 'TSAnyKeyword' ||
+    node.type === 'TSArrayType' ||
+    node.type === 'TSBigIntKeyword' ||
+    node.type === 'TSBooleanKeyword' ||
+    node.type === 'TSConditionalType' ||
+    node.type === 'TSConstructorType' ||
+    node.type === 'TSFunctionType' ||
+    node.type === 'TSImportType' ||
+    node.type === 'TSIndexedAccessType' ||
+    node.type === 'TSInferType' ||
+    node.type === 'TSIntersectionType' ||
+    node.type === 'TSIntrinsicKeyword' ||
+    node.type === 'TSLiteralType' ||
+    node.type === 'TSMappedType' ||
+    node.type === 'TSNamedTupleMember' ||
+    node.type === 'TSNeverKeyword' ||
+    node.type === 'TSNullKeyword' ||
+    node.type === 'TSNumberKeyword' ||
+    node.type === 'TSObjectKeyword' ||
+    node.type === 'TSOptionalType' ||
+    node.type === 'TSRestType' ||
+    node.type === 'TSStringKeyword' ||
+    node.type === 'TSSymbolKeyword' ||
+    node.type === 'TSTemplateLiteralType' ||
+    node.type === 'TSThisType' ||
+    node.type === 'TSTupleType' ||
+    node.type === 'TSTypeLiteral' ||
+    node.type === 'TSTypeOperator' ||
+    node.type === 'TSTypePredicate' ||
+    node.type === 'TSTypeQuery' ||
+    node.type === 'TSTypeReference' ||
+    node.type === 'TSUndefinedKeyword' ||
+    node.type === 'TSUnionType' ||
+    node.type === 'TSUnknownKeyword' ||
+    node.type === 'TSVoidKeyword'
+  )
+}
+
 /**
  * @param {TypeNode} node
  * @returns {node is TSTypeLiteral}
diff --git a/package.json b/package.json
index 16e6ead6e..f5771e7a2 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "eslint-plugin-vue",
-  "version": "7.19.0",
+  "version": "7.20.0",
   "description": "Official ESLint plugin for Vue.js",
   "main": "lib/index.js",
   "scripts": {
@@ -51,7 +51,7 @@
     "node": ">=8.10"
   },
   "peerDependencies": {
-    "eslint": "^6.2.0 || ^7.0.0 || ^8.0.0-0"
+    "eslint": "^6.2.0 || ^7.0.0 || ^8.0.0"
   },
   "dependencies": {
     "eslint-utils": "^2.1.0",
@@ -60,7 +60,7 @@
     "vue-eslint-parser": "^7.10.0"
   },
   "devDependencies": {
-    "@types/eslint": "^7.2.0",
+    "@types/eslint": "^7.28.1",
     "@types/eslint-visitor-keys": "^1.0.0",
     "@types/natural-compare": "^1.4.0",
     "@types/node": "^13.13.5",
@@ -69,20 +69,19 @@
     "@vuepress/plugin-pwa": "^1.4.1",
     "acorn": "^8.5.0",
     "env-cmd": "^10.1.0",
-    "eslint": "^7.0.0",
+    "eslint": "^8.0.0",
     "eslint-config-prettier": "^6.11.0",
     "eslint-plugin-eslint-plugin": "^3.5.3",
     "eslint-plugin-import": "^2.20.2",
     "eslint-plugin-prettier": "^3.1.3",
     "eslint-plugin-vue": "file:.",
-    "eslint4b": "^7.0.0",
     "espree": "^9.0.0",
-    "lodash": "^4.17.15",
+    "lodash": "^4.17.21",
     "mocha": "^7.1.2",
-    "nyc": "^15.0.1",
-    "prettier": "^2.1.1",
-    "typescript": "^4.3.4",
+    "nyc": "^15.1.0",
+    "prettier": "^2.4.1",
+    "typescript": "^4.4.3",
     "vue-eslint-editor": "^1.1.0",
-    "vuepress": "^1.4.1"
+    "vuepress": "^1.8.2"
   }
 }
diff --git a/tests/lib/rules/multi-word-component-names.js b/tests/lib/rules/multi-word-component-names.js
new file mode 100644
index 000000000..65b777984
--- /dev/null
+++ b/tests/lib/rules/multi-word-component-names.js
@@ -0,0 +1,253 @@
+/**
+ * @author Marton Csordas
+ * See LICENSE file in root directory for full license.
+ */
+'use strict'
+
+const RuleTester = require('eslint').RuleTester
+const rule = require('../../../lib/rules/multi-word-component-names')
+
+const tester = new RuleTester({
+  parser: require.resolve('vue-eslint-parser'),
+  parserOptions: {
+    ecmaVersion: 2020,
+    sourceType: 'module'
+  }
+})
+
+tester.run('multi-word-component-names', rule, {
+  valid: [
+    {
+      filename: 'App.vue',
+      code: ''
+    },
+    {
+      filename: 'invalid.vue',
+      code: `
+        <script>
+        export default { name: 'App' }
+        </script>`
+    },
+    {
+      filename: 'invalid.vue',
+      code: `
+        <script>
+        Vue.component('App', {})
+        </script>`
+    },
+    {
+      filename: 'app.vue',
+      code: ''
+    },
+    {
+      filename: 'invalid.vue',
+      code: `
+        <script>
+        export default { name: 'app' }
+        </script>`
+    },
+    {
+      filename: 'invalid.vue',
+      code: `
+        <script>
+        Vue.component('app', {})
+        </script>`
+    },
+    {
+      filename: 'transition.vue',
+      code: ''
+    },
+    {
+      filename: 'invalid.vue',
+      code: `
+        <script>
+        export default { name: 'transition' }
+        </script>`
+    },
+    {
+      filename: 'invalid.vue',
+      code: `
+        <script>
+        Vue.component('transition', {})
+        </script>`
+    },
+    {
+      filename: 'component.vue',
+      code: ''
+    },
+    {
+      filename: 'invalid.vue',
+      code: `
+        <script>
+        export default { name: 'component' }
+        </script>`
+    },
+    {
+      filename: 'invalid.vue',
+      code: `
+        <script>
+        Vue.component('component', {})
+        </script>`
+    },
+    {
+      filename: 'multi-word.vue',
+      code: ''
+    },
+    {
+      filename: 'invalid.vue',
+      code: `
+        <script>
+        export default { name: 'multi-word' }
+        </script>`
+    },
+    {
+      filename: 'invalid.vue',
+      code: `
+        <script>
+        Vue.component('multi-word', {})
+        </script>`
+    },
+    {
+      filename: 'multiWord.vue',
+      code: ''
+    },
+    {
+      filename: 'invalid.vue',
+      code: `
+        <script>
+        export default { name: 'multiWord' }
+        </script>`
+    },
+    {
+      filename: 'invalid.vue',
+      code: `
+        <script>
+        Vue.component('multiWord', {})
+        </script>`
+    },
+    {
+      filename: 'MultiWord.vue',
+      code: ''
+    },
+    {
+      filename: 'invalid.vue',
+      code: `
+        <script>
+        export default { name: 'MultiWord' }
+        </script>`
+    },
+    {
+      filename: 'invalid.vue',
+      code: `
+        <script>
+        Vue.component('MultiWord', {})
+        </script>`
+    },
+    {
+      filename: 'TheTest.vue',
+      code: `
+      <script>
+      export default { name: 'TheTest' }
+      </script>
+      `
+    },
+    {
+      filename: 'TheTest.vue',
+      code: `
+      <script>
+      Vue.component('TheTest', {})
+      </script>
+      `
+    }
+  ],
+  invalid: [
+    {
+      filename: 'test.vue',
+      code: '',
+      errors: [
+        {
+          message: 'Component name "test" should always be multi-word.',
+          line: 1
+        }
+      ]
+    },
+    {
+      filename: 'test.vue',
+      code: `
+        <script>
+        export default { name: 'test' }
+        </script>`,
+      errors: [
+        {
+          message: 'Component name "test" should always be multi-word.',
+          line: 3
+        }
+      ]
+    },
+    {
+      filename: 'test.vue',
+      code: `
+        <script>
+        Vue.component('test', {})
+        </script>`,
+      errors: [
+        {
+          message: 'Component name "test" should always be multi-word.',
+          line: 3
+        }
+      ]
+    },
+    {
+      filename: 'valid-name.vue',
+      code: `
+        <script>
+        export default { name: 'invalid' }
+        </script>`,
+      errors: [
+        {
+          message: 'Component name "invalid" should always be multi-word.',
+          line: 3
+        }
+      ]
+    },
+    {
+      filename: 'valid-name.vue',
+      code: `
+        <script>
+        Vue.component('invalid', {})
+        </script>`,
+      errors: [
+        {
+          message: 'Component name "invalid" should always be multi-word.',
+          line: 3
+        }
+      ]
+    },
+    {
+      filename: 'invalid.vue',
+      code: `
+        <script>
+        export default {}
+        </script>`,
+      errors: [
+        {
+          message: 'Component name "invalid" should always be multi-word.',
+          line: 1
+        }
+      ]
+    },
+    {
+      filename: 'invalid.vue',
+      code: `
+        <script>
+        Vue.component('', {})
+        </script>`,
+      errors: [
+        {
+          message: 'Component name "" should always be multi-word.',
+          line: 3
+        }
+      ]
+    }
+  ]
+})
diff --git a/tests/lib/rules/no-computed-properties-in-data.js b/tests/lib/rules/no-computed-properties-in-data.js
new file mode 100644
index 000000000..a352d4419
--- /dev/null
+++ b/tests/lib/rules/no-computed-properties-in-data.js
@@ -0,0 +1,130 @@
+/**
+ * @author  Yosuke Ota
+ * See LICENSE file in root directory for full license.
+ */
+'use strict'
+
+const RuleTester = require('eslint').RuleTester
+const rule = require('../../../lib/rules/no-computed-properties-in-data')
+
+const tester = new RuleTester({
+  parser: require.resolve('vue-eslint-parser'),
+  parserOptions: {
+    ecmaVersion: 2020,
+    sourceType: 'module'
+  }
+})
+
+tester.run('no-computed-properties-in-data', rule, {
+  valid: [
+    {
+      filename: 'test.vue',
+      code: `
+      <script>
+      export default {
+        data() {
+          const foo = this.foo
+          return {}
+        }
+      }
+      </script>
+      `
+    },
+    {
+      filename: 'test.vue',
+      code: `
+      <script>
+      export default {
+        data() {
+          const foo = this.foo()
+          return {}
+        },
+        methods: {
+          foo() {}
+        }
+      }
+      </script>
+      `
+    },
+    {
+      filename: 'test.vue',
+      code: `
+      <script>
+      export default {
+        props: ['foo'],
+        data() {
+          const foo = this.foo
+          return {}
+        },
+      }
+      </script>
+      `
+    },
+    {
+      filename: 'test.vue',
+      code: `
+      <script>
+      export default {
+        data: {
+          foo: this.foo
+        },
+        computed: {
+          foo () {}
+        }
+      }
+      </script>
+      `
+    }
+  ],
+  invalid: [
+    {
+      filename: 'test.vue',
+      code: `
+      <script>
+      export default {
+        data() {
+          const foo = this.foo
+          return  {}
+        },
+        computed: {
+          foo () {}
+        }
+      }
+      </script>
+      `,
+      errors: [
+        {
+          message:
+            'The computed property cannot be used in `data()` because it is before initialization.',
+          line: 5,
+          column: 23
+        }
+      ]
+    },
+    {
+      filename: 'test.vue',
+      code: `
+      <script>
+      export default {
+        data() {
+          const vm = this
+          const foo = vm.foo
+          return  {}
+        },
+        computed: {
+          foo () {}
+        }
+      }
+      </script>
+      `,
+      errors: [
+        {
+          message:
+            'The computed property cannot be used in `data()` because it is before initialization.',
+          line: 6,
+          column: 23
+        }
+      ]
+    }
+  ]
+})
diff --git a/tests/lib/rules/no-deprecated-router-link-tag-prop.js b/tests/lib/rules/no-deprecated-router-link-tag-prop.js
new file mode 100644
index 000000000..9154cf31c
--- /dev/null
+++ b/tests/lib/rules/no-deprecated-router-link-tag-prop.js
@@ -0,0 +1,312 @@
+/**
+ * @author Marton Csordas
+ * See LICENSE file in root directory for full license.
+ */
+'use strict'
+
+const RuleTester = require('eslint').RuleTester
+const rule = require('../../../lib/rules/no-deprecated-router-link-tag-prop')
+
+const tester = new RuleTester({
+  parser: require.resolve('vue-eslint-parser'),
+  parserOptions: {
+    ecmaVersion: 2020,
+    sourceType: 'module'
+  }
+})
+
+tester.run('no-deprecated-router-link-tag-prop', rule, {
+  valid: [
+    {
+      filename: 'test.vue',
+      code: `
+      <template>
+        <RouterLink to="/">Home</RouterLink>
+      </template>
+      `
+    },
+    {
+      filename: 'test.vue',
+      code: `
+      <template>
+        <router-link to="/">Home</router-link>
+      </template>
+      `
+    },
+    {
+      filename: 'test.vue',
+      code: `
+      <template>
+        <RouterLink to="/">
+          <div>Home</div>
+        </RouterLink>
+      </template>
+      `
+    },
+    {
+      filename: 'test.vue',
+      code: `
+      <template>
+        <router-link to="/">
+          <div>Home</div>
+        </router-link>
+      </template>
+      `
+    },
+    {
+      filename: 'test.vue',
+      code: `
+      <template>
+        <NuxtLink to="/">Home</NuxtLink>
+      </template>
+      `
+    },
+    {
+      filename: 'test.vue',
+      code: `
+      <template>
+        <nuxt-link to="/">Home</nuxt-link>
+      </template>
+      `
+    },
+    {
+      filename: 'test.vue',
+      code: `
+      <template>
+        <NuxtLink to="/">
+          <div>Home</div>
+        </NuxtLink>
+      </template>
+      `
+    },
+    {
+      filename: 'test.vue',
+      code: `
+      <template>
+        <nuxt-link to="/">
+          <div>Home</div>
+        </nuxt-link>
+      </template>
+      `
+    }
+  ],
+  invalid: [
+    {
+      filename: 'test.vue',
+      code: `
+      <template>
+        <RouterLink tag="div" to="/">Home</RouterLink>
+      </template>
+      `,
+      errors: [
+        {
+          message:
+            "'tag' property on 'RouterLink' component is deprecated. Use scoped slots instead.",
+          line: 3,
+          column: 21
+        }
+      ]
+    },
+    {
+      filename: 'test.vue',
+      code: `
+      <template>
+        <router-link tag="div" to="/">Home</router-link>
+      </template>
+      `,
+      errors: [
+        {
+          message:
+            "'tag' property on 'router-link' component is deprecated. Use scoped slots instead.",
+          line: 3,
+          column: 22
+        }
+      ]
+    },
+    {
+      filename: 'test.vue',
+      code: `
+      <template>
+        <RouterLink tag="div" to="/">Home</RouterLink>
+      </template>
+      `,
+      options: [{ components: ['RouterLink'] }],
+      errors: [
+        {
+          message:
+            "'tag' property on 'RouterLink' component is deprecated. Use scoped slots instead.",
+          line: 3,
+          column: 21
+        }
+      ]
+    },
+    {
+      filename: 'test.vue',
+      code: `
+      <template>
+        <RouterLink tag="div" to="/">Home</RouterLink>
+      </template>
+      `,
+      options: [{ components: ['router-link'] }],
+      errors: [
+        {
+          message:
+            "'tag' property on 'RouterLink' component is deprecated. Use scoped slots instead.",
+          line: 3,
+          column: 21
+        }
+      ]
+    },
+    {
+      filename: 'test.vue',
+      code: `
+      <template>
+        <router-link tag="div" to="/">Home</router-link>
+      </template>
+      `,
+      options: [{ components: ['RouterLink'] }],
+      errors: [
+        {
+          message:
+            "'tag' property on 'router-link' component is deprecated. Use scoped slots instead.",
+          line: 3,
+          column: 22
+        }
+      ]
+    },
+    {
+      filename: 'test.vue',
+      code: `
+      <template>
+        <RouterLink :tag="someVariable" to="/">Home</RouterLink>
+      </template>
+      `,
+      errors: [
+        {
+          message:
+            "'tag' property on 'RouterLink' component is deprecated. Use scoped slots instead.",
+          line: 3,
+          column: 22
+        }
+      ]
+    },
+    {
+      filename: 'test.vue',
+      code: `
+      <template>
+        <router-link :tag="someVariable" to="/">Home</router-link>
+      </template>
+      `,
+      errors: [
+        {
+          message:
+            "'tag' property on 'router-link' component is deprecated. Use scoped slots instead.",
+          line: 3,
+          column: 23
+        }
+      ]
+    },
+    {
+      filename: 'test.vue',
+      code: `
+      <template>
+        <RouterLink :tag="someVariable" to="/">Home</RouterLink>
+      </template>
+      `,
+      options: [{ components: ['RouterLink'] }],
+      errors: [
+        {
+          message:
+            "'tag' property on 'RouterLink' component is deprecated. Use scoped slots instead.",
+          line: 3,
+          column: 22
+        }
+      ]
+    },
+    {
+      filename: 'test.vue',
+      code: `
+      <template>
+        <router-link :tag="someVariable" to="/">Home</router-link>
+      </template>
+      `,
+      options: [{ components: ['RouterLink'] }],
+      errors: [
+        {
+          message:
+            "'tag' property on 'router-link' component is deprecated. Use scoped slots instead.",
+          line: 3,
+          column: 23
+        }
+      ]
+    },
+    {
+      filename: 'test.vue',
+      code: `
+      <template>
+        <NuxtLink tag="div" to="/">Home</NuxtLink>
+      </template>
+      `,
+      options: [{ components: ['NuxtLink'] }],
+      errors: [
+        {
+          message:
+            "'tag' property on 'NuxtLink' component is deprecated. Use scoped slots instead.",
+          line: 3,
+          column: 19
+        }
+      ]
+    },
+    {
+      filename: 'test.vue',
+      code: `
+      <template>
+        <nuxt-link tag="div" to="/">Home</nuxt-link>
+      </template>
+      `,
+      options: [{ components: ['NuxtLink'] }],
+      errors: [
+        {
+          message:
+            "'tag' property on 'nuxt-link' component is deprecated. Use scoped slots instead.",
+          line: 3,
+          column: 20
+        }
+      ]
+    },
+    {
+      filename: 'test.vue',
+      code: `
+      <template>
+        <NuxtLink :tag="someVariable" to="/">Home</NuxtLink>
+      </template>
+      `,
+      options: [{ components: ['NuxtLink'] }],
+      errors: [
+        {
+          message:
+            "'tag' property on 'NuxtLink' component is deprecated. Use scoped slots instead.",
+          line: 3,
+          column: 20
+        }
+      ]
+    },
+    {
+      filename: 'test.vue',
+      code: `
+      <template>
+        <nuxt-link :tag="someVariable" to="/">Home</nuxt-link>
+      </template>
+      `,
+      options: [{ components: ['NuxtLink'] }],
+      errors: [
+        {
+          message:
+            "'tag' property on 'nuxt-link' component is deprecated. Use scoped slots instead.",
+          line: 3,
+          column: 21
+        }
+      ]
+    }
+  ]
+})
diff --git a/tests/lib/rules/no-undef-properties.js b/tests/lib/rules/no-undef-properties.js
new file mode 100644
index 000000000..09e16bda9
--- /dev/null
+++ b/tests/lib/rules/no-undef-properties.js
@@ -0,0 +1,1074 @@
+/**
+ * @fileoverview Disallow undefined properties.
+ * @author Yosuke Ota
+ */
+'use strict'
+
+const RuleTester = require('eslint').RuleTester
+const rule = require('../../../lib/rules/no-undef-properties')
+
+const tester = new RuleTester({
+  parser: require.resolve('vue-eslint-parser'),
+  parserOptions: {
+    ecmaVersion: 2020,
+    sourceType: 'module'
+  }
+})
+
+tester.run('no-undef-properties', rule, {
+  valid: [
+    {
+      filename: 'test.vue',
+      code: `
+      <template>
+        <div :attr="foo"> {{ bar }} </div>
+      </template>
+      <script>
+        export default {
+          props: ['foo'],
+          data () {
+            return {
+              bar: 42
+            }
+          },
+          created() {
+            this.baz()
+          },
+          methods: {
+            baz() {}
+          }
+        };
+      </script>
+      `
+    },
+    {
+      filename: 'test.vue',
+      code: `
+      <template>
+        <div :attr="foo"> {{ bar }} </div>
+      </template>
+      <script>
+        export default {
+          inject: ['foo'],
+          setup() {
+            return {
+              bar: 42
+            }
+          },
+          computed: {
+            baz() {
+              return 42
+            }
+          },
+          created() {
+            console.log(this.baz)
+          }
+        };
+      </script>
+      `
+    },
+    //default ignores
+    {
+      filename: 'test.vue',
+      code: `
+      <template>
+        <div>{{ $t('foo') }}</div>
+      </template>
+      <script>
+        export default {
+          mounted() {
+            const hash = this.$route.hash
+            this.$on('click', this.click)
+          },
+          methods: {
+            click() {
+              this.$nextTick()
+            }
+          }
+        }
+      </script>
+      `
+    },
+    {
+      // global in template
+      filename: 'test.vue',
+      code: `
+      <template>
+        <div>{{ undefined }}</div>
+      </template>
+      <script>
+        export default {
+        }
+      </script>
+      `
+    },
+
+    //watch
+    {
+      filename: 'test.vue',
+      code: `
+      <script>
+        export default {
+          props: ['foo'],
+          watch: {
+            foo: 'bar'
+          },
+          methods: {
+            bar() {}
+          }
+        };
+      </script>
+      `
+    },
+    {
+      filename: 'test.vue',
+      code: `
+      <script>
+        export default {
+          data () {
+            return {
+              foo: {
+                bar :42
+              }
+            }
+          },
+          watch: {
+            'foo.bar': 'baz'
+          },
+          methods: {
+            baz() {}
+          }
+        };
+      </script>
+      `
+    },
+
+    // props
+    {
+      filename: 'test.vue',
+      code: `
+      <script>
+        export default {
+          props: ['foo'],
+          data (props) {
+            return {
+              bar: props.foo
+            }
+          }
+        };
+      </script>
+      `
+    },
+    {
+      filename: 'test.vue',
+      code: `
+      <script>
+        export default {
+          props: ['foo'],
+          setup (props) {
+            return {
+              bar: props.foo
+            }
+          }
+        };
+      </script>
+      `
+    },
+    {
+      filename: 'test.vue',
+      code: `
+      <script>
+        export default {
+          functional: true,
+          props: ['foo'],
+          render (_, {props}) {
+            return h(props.foo)
+          }
+        };
+      </script>
+      `
+    },
+
+    // arg vm
+    {
+      filename: 'test.vue',
+      code: `
+      <script>
+        export default {
+          data () {return {foo:42}},
+          render (vm) {
+            return h(vm.foo)
+          }
+        };
+      </script>
+      `
+    },
+    {
+      filename: 'test.vue',
+      code: `
+      <script>
+        export default {
+          data () {return {foo:42}},
+          computed: { p: (vm) => vm.foo }
+        };
+      </script>
+      `
+    },
+    {
+      filename: 'test.vue',
+      code: `
+      <script>
+        export default {
+          data () {return {foo:42}},
+          computed: { p: { get: (vm) => vm.foo } }
+        };
+      </script>
+      `
+    },
+
+    // deep
+    {
+      filename: 'test.vue',
+      code: `
+      <template> {{ foo.bar }} </template>
+      <script>
+        export default {
+          data () {
+            return {
+              foo: {
+                bar: 42
+              }
+            }
+          },
+        };
+      </script>
+      `
+    },
+    {
+      filename: 'test.vue',
+      code: `
+      <template> {{ foo.bar.baz }} </template>
+      <script>
+        export default {
+          data () {
+            return {
+              foo: {
+                bar: {
+                  baz: 42
+                }
+              }
+            }
+          },
+        };
+      </script>
+      `
+    },
+
+    // track
+    {
+      filename: 'test.vue',
+      code: `
+      <script>
+        export default {
+          data () {
+            return {
+              foo: 42
+            }
+          },
+          mounted() {
+            fn(this)
+          }
+        };
+
+        function fn(vm) {
+          return vm.foo
+        }
+      </script>
+      `
+    },
+    {
+      filename: 'test.vue',
+      code: `
+      <script>
+        const fn = function(vm) {
+          return vm.foo
+        }
+        export default {
+          data () {
+            return {
+              foo: 42
+            }
+          },
+          mounted() {
+            fn(this)
+          }
+        };
+      </script>
+      `
+    },
+    {
+      filename: 'test.vue',
+      code: `
+      <script>
+        function a(vm) {
+          return vm.foo
+        }
+        const fn = a
+        export default {
+          data () {
+            return {
+              foo: 42
+            }
+          },
+          mounted() {
+            fn(this)
+          }
+        };
+      </script>
+      `
+    },
+    {
+      filename: 'test.vue',
+      code: `
+      <script>
+        function a(vm) {
+          return vm.foo2
+        }
+        export default {
+          data () {
+            return {
+              foo: 42
+            }
+          },
+          mounted() {
+            b(this)
+          }
+        };
+      </script>
+      `
+    },
+    {
+      filename: 'test.vue',
+      code: `
+      <script>
+        function a(vm) {
+          return vm.foo2
+        }
+        const b = unknown
+        export default {
+          data () {
+            return {
+              foo: 42
+            }
+          },
+          mounted() {
+            b(this)
+          }
+        };
+      </script>
+      `
+    },
+    {
+      filename: 'test.vue',
+      code: `
+      <script>
+        function a(vm) {
+          return vm.foo2
+        }
+        let b = a
+        export default {
+          data () {
+            return {
+              foo: 42
+            }
+          },
+          mounted() {
+            b(this)
+          }
+        };
+      </script>
+      `
+    },
+    {
+      filename: 'test.vue',
+      code: `
+      <script>
+        function fn( { foo } = {} ) {
+        }
+        export default {
+          data () {
+            return {
+              foo: 42
+            }
+          },
+          mounted() {
+            fn(this)
+          }
+        };
+      </script>
+      `
+    },
+    {
+      filename: 'test.vue',
+      code: `
+      <script>
+        export default {
+          data () {
+            return {
+              foo: 42
+            }
+          },
+          mounted() {
+            const { foo = 42 } = this
+          }
+        };
+      </script>
+      `
+    },
+    {
+      filename: 'test.vue',
+      code: `
+      <script>
+        export default {
+          data () {
+            return {
+              foo: {
+                bar: 42
+              }
+            }
+          },
+          mounted() {
+            const { foo : { bar = 42 } = {} } = this
+          }
+        };
+      </script>
+      `
+    },
+    {
+      filename: 'test.vue',
+      code: `
+      <script>
+        export default {
+          data () {
+            return {
+              foo: {
+                bar: 42
+              }
+            }
+          },
+          mounted() {
+            ({ foo : { bar: v = 42 } = {} } = this)
+          }
+        };
+      </script>
+      `
+    },
+    {
+      filename: 'test.vue',
+      code: `
+      <script>
+        export default {
+          data () {
+            return {
+              foo: 41
+            }
+          },
+          mounted() {
+            const vm = this
+            vm.foo
+          }
+        };
+      </script>
+      `
+    },
+    {
+      filename: 'test.vue',
+      code: `
+      <script>
+        export default {
+          data () {
+            return {
+              foo: {
+                bar: 42
+              }
+            }
+          },
+          mounted() {
+            const vm = this
+            ;(vm?.foo)?.bar
+          }
+        };
+      </script>
+      `
+    }
+  ],
+
+  invalid: [
+    // undef property
+    {
+      filename: 'test.vue',
+      code: `
+      <template>
+        <div :attr="foo2"> {{ bar2 }} </div>
+      </template>
+      <script>
+        export default {
+          props: ['foo'],
+          data () {
+            return {
+              bar: 42
+            }
+          },
+          created() {
+            this.baz2()
+          },
+          methods: {
+            baz() {}
+          }
+        };
+      </script>
+      `,
+      errors: [
+        {
+          message: "'foo2' is not defined.",
+          line: 3
+        },
+        {
+          message: "'bar2' is not defined.",
+          line: 3
+        },
+        {
+          message: "'baz2' is not defined.",
+          line: 14
+        }
+      ]
+    },
+    {
+      filename: 'test.vue',
+      code: `
+      <template>
+        <div :attr="foo2"> {{ bar2 }} </div>
+      </template>
+      <script>
+        export default {
+          inject: ['foo'],
+          setup() {
+            return {
+              bar: 42
+            }
+          },
+          computed: {
+            baz() {
+              return 42
+            }
+          },
+          created() {
+            console.log(this.baz2)
+          }
+        };
+      </script>
+      `,
+      errors: [
+        {
+          message: "'foo2' is not defined.",
+          line: 3
+        },
+        {
+          message: "'bar2' is not defined.",
+          line: 3
+        },
+        {
+          message: "'baz2' is not defined.",
+          line: 19
+        }
+      ]
+    },
+
+    // same names
+    {
+      filename: 'test.vue',
+      code: `
+      <template>
+        <div :attr="foo2"> {{ foo2 }} </div>
+      </template>
+      <script>
+        export default {
+          props: ['foo'],
+          created() {
+            this.foo2
+
+            this.foo2
+          }
+        };
+      </script>
+      `,
+      errors: [
+        {
+          message: "'foo2' is not defined.",
+          line: 9
+        }
+      ]
+    },
+
+    //watch
+    {
+      filename: 'test.vue',
+      code: `
+      <script>
+        export default {
+          props: ['foo'],
+          watch: {
+            foo2: 'bar2'
+          },
+          methods: {
+            bar() {}
+          }
+        };
+      </script>
+      `,
+      errors: [
+        {
+          message: "'foo2' is not defined.",
+          line: 6
+        },
+        {
+          message: "'bar2' is not defined.",
+          line: 6
+        }
+      ]
+    },
+    {
+      filename: 'test.vue',
+      code: `
+      <script>
+        export default {
+          data () {
+            return {
+              foo: {
+                bar :42
+              }
+            }
+          },
+          watch: {
+            'foo2.bar': 'baz',
+            'foo.bar2': 'baz',
+          },
+          methods: {
+            baz() {}
+          }
+        };
+      </script>
+      `,
+      errors: [
+        {
+          message: "'foo2' is not defined.",
+          line: 12
+        },
+        {
+          message: "'foo.bar2' is not defined.",
+          line: 13
+        }
+      ]
+    },
+
+    // props
+    {
+      filename: 'test.vue',
+      code: `
+      <script>
+        export default {
+          computed: {
+            foo () {}
+          },
+          data (props) {
+            return {
+              bar: props.foo
+            }
+          }
+        };
+      </script>
+      `,
+      errors: ["'foo' is not defined in props."]
+    },
+    {
+      filename: 'test.vue',
+      code: `
+      <script>
+        export default {
+          computed: {
+            foo () {}
+          },
+          setup (props) {
+            return {
+              bar: props.foo
+            }
+          }
+        };
+      </script>
+      `,
+      errors: ["'foo' is not defined in props."]
+    },
+    {
+      filename: 'test.vue',
+      code: `
+      <script>
+        export default {
+          functional: true,
+          computed: {
+            foo () {}
+          },
+          render (_, {props}) {
+            return h(props.foo)
+          }
+        };
+      </script>
+      `,
+      errors: ["'foo' is not defined in props."]
+    },
+
+    // arg vm
+    {
+      filename: 'test.vue',
+      code: `
+      <script>
+        export default {
+          data () {return {foo:42}},
+          render (vm) {
+            return h(vm.bar)
+          }
+        };
+      </script>
+      `,
+      errors: ["'bar' is not defined."]
+    },
+    {
+      filename: 'test.vue',
+      code: `
+      <script>
+        export default {
+          data () {return {foo:42}},
+          computed: { p: (vm) => vm.bar }
+        };
+      </script>
+      `,
+      errors: ["'bar' is not defined."]
+    },
+    {
+      filename: 'test.vue',
+      code: `
+      <script>
+        export default {
+          data () {return {foo:42}},
+          computed: { p: { get: (vm) => vm.bar } }
+        };
+      </script>
+      `,
+      errors: ["'bar' is not defined."]
+    },
+
+    // deep
+    {
+      filename: 'test.vue',
+      code: `
+      <template> {{ foo.baz }} </template>
+      <script>
+        export default {
+          data () {
+            return {
+              foo: {
+                bar: 42
+              }
+            }
+          },
+        };
+      </script>
+      `,
+      errors: ["'foo.baz' is not defined."]
+    },
+    {
+      filename: 'test.vue',
+      code: `
+      <template> {{ foo.bar.baz2 }} </template>
+      <script>
+        export default {
+          data () {
+            return {
+              foo: {
+                bar: {
+                  baz: 42
+                }
+              }
+            }
+          },
+        };
+      </script>
+      `,
+      errors: ["'foo.bar.baz2' is not defined."]
+    },
+
+    // track
+    {
+      filename: 'test.vue',
+      code: `
+      <script>
+        export default {
+          data () {
+            return {
+              foo: 42
+            }
+          },
+          mounted() {
+            fn(this)
+          }
+        };
+
+        function fn(vm) {
+          return vm.foo2
+        }
+      </script>
+      `,
+      errors: [
+        {
+          message: "'foo2' is not defined.",
+          line: 15
+        }
+      ]
+    },
+    {
+      filename: 'test.vue',
+      code: `
+      <script>
+        const fn = function(vm) {
+          return vm.foo2
+        }
+        export default {
+          data () {
+            return {
+              foo: 42
+            }
+          },
+          mounted() {
+            fn(this)
+          }
+        };
+      </script>
+      `,
+      errors: [
+        {
+          message: "'foo2' is not defined.",
+          line: 4
+        }
+      ]
+    },
+    {
+      filename: 'test.vue',
+      code: `
+      <script>
+        function a(vm) {
+          return vm.foo2
+        }
+        const fn = a
+        export default {
+          data () {
+            return {
+              foo: 42
+            }
+          },
+          mounted() {
+            fn(this)
+          }
+        };
+      </script>
+      `,
+      errors: [
+        {
+          message: "'foo2' is not defined.",
+          line: 4
+        }
+      ]
+    },
+    {
+      filename: 'test.vue',
+      code: `
+      <script>
+        function fn( { foo2 } = {} ) {
+        }
+        export default {
+          data () {
+            return {
+              foo: 42
+            }
+          },
+          mounted() {
+            fn(this)
+          }
+        };
+      </script>
+      `,
+      errors: [
+        {
+          message: "'foo2' is not defined.",
+          line: 3
+        }
+      ]
+    },
+    {
+      filename: 'test.vue',
+      code: `
+      <script>
+        export default {
+          data () {
+            return {
+              foo: 42
+            }
+          },
+          mounted() {
+            const { foo2 = 42 } = this
+          }
+        };
+      </script>
+      `,
+      errors: [
+        {
+          message: "'foo2' is not defined.",
+          line: 10
+        }
+      ]
+    },
+    {
+      filename: 'test.vue',
+      code: `
+      <script>
+        export default {
+          data () {
+            return {
+              foo: {
+                bar: 42
+              }
+            }
+          },
+          mounted() {
+            const { foo : { bar2 = 42 } = {} } = this
+          }
+        };
+      </script>
+      `,
+      errors: [
+        {
+          message: "'foo.bar2' is not defined.",
+          line: 12
+        }
+      ]
+    },
+    {
+      filename: 'test.vue',
+      code: `
+      <script>
+        export default {
+          data () {
+            return {
+              foo: {
+                bar: 42
+              }
+            }
+          },
+          mounted() {
+            ({ foo : { bar2: v = 42 } = {} } = this)
+          }
+        };
+      </script>
+      `,
+      errors: [
+        {
+          message: "'foo.bar2' is not defined.",
+          line: 12
+        }
+      ]
+    },
+    {
+      filename: 'test.vue',
+      code: `
+      <script>
+        export default {
+          data () {
+            return {
+              foo: 41
+            }
+          },
+          mounted() {
+            const vm = this
+            vm.foo2
+          }
+        };
+      </script>
+      `,
+      errors: [
+        {
+          message: "'foo2' is not defined.",
+          line: 11
+        }
+      ]
+    },
+    {
+      filename: 'test.vue',
+      code: `
+      <script>
+        export default {
+          data () {
+            return {
+              foo: {
+                bar: 42
+              }
+            }
+          },
+          mounted() {
+            const vm = this
+            ;(vm?.foo)?.bar2
+          }
+        };
+      </script>
+      `,
+      errors: [
+        {
+          message: "'foo.bar2' is not defined.",
+          line: 13
+        }
+      ]
+    },
+    {
+      filename: 'test.vue',
+      code: `
+      <template>
+        <!-- ✓ GOOD -->
+        <div>{{ name }}: {{ count }}</div>
+        <!-- ✗ BAD -->
+        <div>{{ label }}: {{ cnt }}</div>
+      </template>
+      <script setup>
+      const prop = defineProps(['name', 'def'])
+      let count = 0
+
+      /* ✓ GOOD */
+      watch(() => prop.def, () => console.log('Updated!'))
+
+      /* ✗ BAD */
+      watch(() => prop.undef, () => console.log('Updated!'))
+      </script>
+      `,
+      errors: [
+        {
+          message: "'label' is not defined.",
+          line: 6
+        },
+        {
+          message: "'cnt' is not defined.",
+          line: 6
+        },
+        {
+          message: "'undef' is not defined.",
+          line: 16
+        }
+      ]
+    }
+  ]
+})
diff --git a/tests/lib/rules/no-use-computed-property-like-method.js b/tests/lib/rules/no-use-computed-property-like-method.js
index 902f29b19..539e6275a 100644
--- a/tests/lib/rules/no-use-computed-property-like-method.js
+++ b/tests/lib/rules/no-use-computed-property-like-method.js
@@ -16,7 +16,7 @@ const rule = require('../../../lib/rules/no-use-computed-property-like-method')
 
 const tester = new RuleTester({
   parser: require.resolve('vue-eslint-parser'),
-  parserOptions: { ecmaVersion: 2015, sourceType: 'module' }
+  parserOptions: { ecmaVersion: 2020, sourceType: 'module' }
 })
 
 tester.run('no-use-computed-property-like-method', rule, {
@@ -438,6 +438,137 @@ tester.run('no-use-computed-property-like-method', rule, {
         }
       </script>
       `
+    },
+    {
+      //https://github.com/vuejs/eslint-plugin-vue/issues/1649
+      filename: 'test.vue',
+      code: `
+      <script>
+      import { mapGetters } from 'vuex'
+
+      export default {
+        props: [\`user\`],
+        computed: {
+          ...mapGetters(\`auth\`, [\`statusForUser\`]),
+          status () {
+            return this.statusForUser(this.user)
+          },
+        },
+      }
+      </script>
+      `
+    },
+    {
+      filename: 'test.vue',
+      code: `
+      <script>
+        const s = s
+        export default {
+          props: {
+            str: s
+          },
+          computed: {
+            x() {
+              const str = this.str
+              return str
+            },
+          },
+          methods: {
+            fn() {
+              const vm = this
+              vm.x()
+            }
+          }
+        }
+      </script>
+      `
+    },
+    {
+      filename: 'test.vue',
+      code: `
+      <script>
+        const s = String
+        export default {
+          computed: {
+            x() {
+              return s
+            },
+          },
+          methods: {
+            fn() {
+              const vm = this
+              vm.x()
+            }
+          }
+        }
+      </script>
+      `
+    },
+    {
+      filename: 'test.vue',
+      code: `
+      <script>
+        export default {
+          computed: {
+            x() {
+              return this.x
+            },
+          },
+          methods: {
+            fn() {
+              const vm = this
+              vm.x()
+            }
+          }
+        }
+      </script>
+      `
+    },
+    {
+      filename: 'test.vue',
+      code: `
+      <script>
+        export default {
+          computed: {
+            x() {
+              return this.foo()
+            },
+          },
+          methods: {
+            fn() {
+              const vm = this
+              vm.x()
+            },
+            foo () {
+              return this.foo()
+            }
+          }
+        }
+      </script>
+      `
+    },
+    {
+      filename: 'test.vue',
+      code: `
+      <script>
+        export default {
+          props: {
+            val: b ? [String] : Function
+          },
+          computed: {
+            x() {
+              return this.val
+            },
+          },
+          methods: {
+            fn() {
+              const vm = this
+              vm.x()
+            }
+          }
+        }
+      </script>
+      `
     }
   ],
   invalid: [
@@ -762,6 +893,214 @@ tester.run('no-use-computed-property-like-method', rule, {
         'Use this.computedReturnArray instead of this.computedReturnArray().',
         'Use this.computedReturnArray2 instead of this.computedReturnArray2().'
       ]
+    },
+    {
+      filename: 'test.vue',
+      code: `
+      <script>
+        export default {
+          props: {
+            str: String
+          },
+          computed: {
+            x() {
+              const str = this.str
+              return str
+            },
+            y() {
+              return
+            }
+          },
+          methods: {
+            fn() {
+              const vm = this
+              vm.x()
+            }
+          }
+        }
+      </script>
+      `,
+      errors: ['Use this.x instead of this.x().']
+    },
+    {
+      filename: 'test.vue',
+      code: `
+      <script>
+        const s = String
+        export default {
+          props: {
+            str: s
+          },
+          computed: {
+            x() {
+              const str = this.str
+              return str
+            },
+          },
+          methods: {
+            fn() {
+              const vm = this
+              vm.x()
+            }
+          }
+        }
+      </script>
+      `,
+      errors: ['Use this.x instead of this.x().']
+    },
+    {
+      filename: 'test.vue',
+      code: `
+      <script>
+        const s = String
+        export default {
+          props: {
+            val: [s, Number]
+          },
+          computed: {
+            x() {
+              return this.val
+            },
+          },
+          methods: {
+            fn() {
+              const vm = this
+              vm.x()
+            }
+          }
+        }
+      </script>
+      `,
+      errors: ['Use this.x instead of this.x().']
+    },
+    {
+      filename: 'test.vue',
+      code: `
+      <script>
+        export default {
+          computed: {
+            x: {
+              get: () => 42
+            },
+          },
+          methods: {
+            fn() {
+              const vm = this
+              vm.x()
+            }
+          }
+        }
+      </script>
+      `,
+      errors: ['Use this.x instead of this.x().']
+    },
+    {
+      filename: 'test.vue',
+      code: `
+      <script>
+        export default {
+          computed: {
+            x() {
+              return b ? this.foo() : 'str'
+            },
+          },
+          methods: {
+            fn() {
+              const vm = this
+              vm.x()
+            },
+            foo () {
+              return 42
+            }
+          }
+        }
+      </script>
+      `,
+      errors: ['Use this.x instead of this.x().']
+    },
+    {
+      filename: 'test.vue',
+      code: `
+      <script>
+        export default {
+          props: {
+            val: b ? [String] : Number
+          },
+          computed: {
+            x() {
+              return this.val
+            },
+          },
+          methods: {
+            fn() {
+              const vm = this
+              vm.x()
+            }
+          }
+        }
+      </script>
+      `,
+      errors: ['Use this.x instead of this.x().']
+    },
+    {
+      filename: 'test.vue',
+      code: `
+      <script>
+        let t = [String]
+        if (b) {
+          t = Number
+        }
+        let t2 = [String]
+        if (b) {
+          t2 = Function
+        }
+        export default {
+          props: {
+            val: t,
+            f: t2
+          },
+          computed: {
+            x() {
+              return this.val
+            },
+            y() {
+              return this.f
+            },
+          },
+          methods: {
+            fn() {
+              const vm = this
+              vm.x()
+              vm.y()
+            }
+          }
+        }
+      </script>
+      `,
+      errors: ['Use this.x instead of this.x().']
+    },
+    {
+      filename: 'test.vue',
+      code: `
+      <template>
+        {{x()}}
+        {{y()}}
+        {{y(x)}}
+      </template>
+      <script>
+        export default {
+          computed: {
+            x() {
+              return 42
+            },
+            y() {
+              return String
+            },
+          }
+        }
+      </script>
+      `,
+      errors: ['Use x instead of x().']
     }
   ]
 })
diff --git a/tests/lib/rules/valid-define-emits.js b/tests/lib/rules/valid-define-emits.js
index 309375e94..557101d67 100644
--- a/tests/lib/rules/valid-define-emits.js
+++ b/tests/lib/rules/valid-define-emits.js
@@ -61,6 +61,62 @@ tester.run('valid-define-emits', rule, {
         defineEmits(def)
       </script>
       `
+    },
+    {
+      filename: 'test.vue',
+      code: `
+      <script setup>
+        defineEmits({
+          notify (payload) {
+            return typeof payload === 'string'
+          }
+        })
+      </script>
+      `
+    },
+    {
+      // https://github.com/vuejs/eslint-plugin-vue/issues/1656
+      filename: 'test.vue',
+      parserOptions: {
+        parser: require.resolve('@typescript-eslint/parser')
+      },
+      code: `
+      <script setup lang="ts">
+      import type { PropType } from 'vue';
+
+      type X = string;
+
+      const props = defineProps({
+        myProp: Array as PropType<string[]>,
+      });
+
+      const emit = defineEmits({
+        myProp: (x: X) => true,
+      });
+      </script>
+      `
+    },
+    {
+      filename: 'test.vue',
+      parserOptions: {
+        parser: require.resolve('@typescript-eslint/parser')
+      },
+      code: `
+      <script setup lang="ts">
+      import type { PropType } from 'vue';
+
+      const strList = ['a', 'b', 'c']
+      const str = 'abc'
+
+      const props = defineProps({
+        myProp: Array as PropType<typeof strList>,
+      });
+
+      const emit = defineEmits({
+        myProp: (x: typeof str) => true,
+      });
+      </script>
+      `
     }
   ],
   invalid: [
diff --git a/tests/lib/rules/valid-define-props.js b/tests/lib/rules/valid-define-props.js
index 0bd49f171..10894e069 100644
--- a/tests/lib/rules/valid-define-props.js
+++ b/tests/lib/rules/valid-define-props.js
@@ -61,6 +61,65 @@ tester.run('valid-define-props', rule, {
         defineProps(def)
       </script>
       `
+    },
+    {
+      filename: 'test.vue',
+      code: `
+      <script setup>
+        defineProps({
+          addFunction: {
+            type: Function,
+            default (a, b) {
+              return a + b
+            }
+          }
+        })
+      </script>
+      `
+    },
+    {
+      // https://github.com/vuejs/eslint-plugin-vue/issues/1656
+      filename: 'test.vue',
+      parserOptions: {
+        parser: require.resolve('@typescript-eslint/parser')
+      },
+      code: `
+      <script setup lang="ts">
+      import type { PropType } from 'vue';
+
+      type X = string;
+
+      const props = defineProps({
+        myProp: Array as PropType<string[]>,
+      });
+
+      const emit = defineEmits({
+        myProp: (x: X) => true,
+      });
+      </script>
+      `
+    },
+    {
+      filename: 'test.vue',
+      parserOptions: {
+        parser: require.resolve('@typescript-eslint/parser')
+      },
+      code: `
+      <script setup lang="ts">
+      import type { PropType } from 'vue';
+
+      const strList = ['a', 'b', 'c']
+      const str = 'abc'
+
+      const props = defineProps({
+        myProp: Array as PropType<typeof strList>,
+      });
+
+      const emit = defineEmits({
+        myProp: (x: typeof str) => true,
+      });
+      </script>
+      `
     }
   ],
   invalid: [
diff --git a/tools/new-rule.js b/tools/new-rule.js
index 68a8b440c..3009dfdd3 100644
--- a/tools/new-rule.js
+++ b/tools/new-rule.js
@@ -32,7 +32,7 @@ const logger = console
 // Requirements
 // ------------------------------------------------------------------------------
 
-// ...
+const utils = require('../utils')
 
 // ------------------------------------------------------------------------------
 // Helpers