fix(docs): extend vue 2 info regarding types (#750)

* fix(docs): extend vue 2 info regarding types

Related #741

* update instructions as suggested

extensions/vscode-vue-language-features/README.md

@@ -30,9 +30,9 @@ This company is [sponsoring this project](https://github.com/sponsors/johnsoncod
 
 1. Add `@vue/runtime-dom`
 
-This extension required Vue 3 types from the `@vue/runtime-dom`.
+This extension requires Vue 3 types from the `@vue/runtime-dom`.
 
-Vue 3 in itself includes the package `@vue/runtime-dom`. For Vue 2 you will have to install this package yourself:
+Vue 3 itself includes the `@vue/runtime-dom` package. For Vue 2 you will have to install it yourself:
 
 ```jsonc
 // package.json
@@ -45,17 +45,30 @@ Vue 3 in itself includes the package `@vue/runtime-dom`. For Vue 2 you will have
 
 2. Remove `Vue.extend`
 
-Template type-checking do not support with `Vue.extend`, you can use [composition-api](https://github.com/vuejs/composition-api), [vue-class-component](https://github.com/vuejs/vue-class-component), or instead of `export default Vue.extend`.
+Template type-checking is not supported with `Vue.extend`. You can use [composition-api](https://github.com/vuejs/composition-api), [vue-class-component](https://github.com/vuejs/vue-class-component), or `export default { ... }` instead of `export default Vue.extend`.
 
-3. Support Vue 2 template
+Here is a compatibility table for different ways of writing the script blocks:
 
-Volar preferentially supports Vue 3. Vue 3 and Vue 2 template has some different. You need to set the `experimentalCompatMode` option to support Vue 2 template.
+|                                          | Component options type-checking in `<script>` | Interpolation type-checking in `<template>` | Cross-component props type-checking |
+|:-----------------------------------------|:----------------------------------------------|:--------------------------------------------|:------------------------------------|
+| `export default { ... }` with JS         | Not supported                                 | Not supported                               | Not supported                       |
+| `export default { ... }` with TS         | Not supported                                 | Supported but deprecated                    | Supported but deprecated            |
+| `export default Vue.extend({ ... })` with JS | Not supported                             | Not supported                               | Not supported                       |
+| `export default Vue.extend({ ... })` with TS | Limited (supports `data` types but not `props` types) | Limited                         | Not supported                       |
+| `export default defineComponent({ ... })` | Supported                                    | Supported                                   | Supported                           |
+| Class component                          | Supported                                     | Supported with additional code ([#21](https://github.com/johnsoncodehk/volar/issues/21)) |  Supported with additional code     |
+
+Note that you can use `defineComponent` even for components that are using the `Options API`.
+
+3. Support for Vue 2 template
+
+Volar preferentially supports Vue 3. Vue 3 and Vue 2 templates have some differences. You need to set the `experimentalCompatMode` option to support the Vue 2 templates.
 
 ```jsonc
 // tsconfig.json
 {
   "compilerOptions": {
-    ...
+    // ...
   },
   "vueCompilerOptions": {
     "experimentalCompatMode": 2,
@@ -65,11 +78,11 @@ Volar preferentially supports Vue 3. Vue 3 and Vue 2 template has some different
   }
 }
 ```
-
-4. remove `.d.ts` files if it exists.
 
-For projects generated by the [Vue CLI](https://cli.vuejs.org/), `.d.ts` files are included. remove these files.
-
+4. remove `.d.ts` files if they exist.
+
+For projects generated by the [Vue CLI](https://cli.vuejs.org/), `.d.ts` files are included. Remove these files.
+
 ```
 rm src/shims-tsx.d.ts src/shims-vue.d.ts
 ```