feat(vscode): add examples to inlay hints configuration (#5068)

vuejs · Dec 20, 2024 · c9a2174 · c9a2174
1 parent f35dfa0
commit c9a2174
Show file tree

Hide file tree

Showing 6 changed files with 629 additions and 36 deletions.
diff --git a/.gitignore b/.gitignore
@@ -6,7 +6,6 @@ node_modules
 .vscode-test-web
 extensions/*/meta.json
 extensions/*/stats.html
-extensions/vscode/src/generated-meta.ts
 
 packages/*/*.d.ts
 packages/*/*.js

diff --git a/extensions/vscode/README.md b/extensions/vscode/README.md
@@ -259,13 +259,13 @@ Finally you need to make VS Code recognize your new extension and automatically
 
 <!-- commands -->
 
-| Command                        | Title                                                  |
-| ------------------------------ | ------------------------------------------------------ |
-| `vue.action.restartServer`     | Vue: Restart Vue and TS servers                        |
-| `vue.action.doctor`            | Vue: Doctor                                            |
-| `vue.action.writeVirtualFiles` | Vue (Debug): Write Virtual Files                       |
-| `vue.action.splitEditors`      | Vue: Split &lt;script&gt;, <template>, <style> Editors |
-| `vue.findAllFileReferences`    | Vue: Find File References via Vue Language Server      |
+| Command                        | Title                                                   |
+| ------------------------------ | ------------------------------------------------------- |
+| `vue.action.restartServer`     | Vue: Restart Vue and TS servers                         |
+| `vue.action.doctor`            | Vue: Doctor                                             |
+| `vue.action.writeVirtualFiles` | Vue (Debug): Write Virtual Files                        |
+| `vue.action.splitEditors`      | Vue: Split `<script>`, `<template>`, `<style>` Editors  |
+| `vue.findAllFileReferences`    | Vue: Find File References via Vue Language Server       |
 
 <!-- commands -->
 
@@ -292,7 +292,7 @@ Finally you need to make VS Code recognize your new extension and automatically
 | `vue.complete.casing.props`           | Preferred attr name case.                                                                                                                                          | `string`         | `"autoKebab"`                       |
 | `vue.complete.defineAssignment`       | Auto add `const props = ` before `defineProps` when selecting the completion item `props`. (also `emit` and `slots`)                                               | `boolean`        | `true`                              |
 | `vue.autoInsert.dotValue`             | Auto-complete Ref value with `.value`.                                                                                                                             | `boolean`        | `false`                             |
-| `vue.autoInsert.bracketSpacing`       | Auto add space between double curly brackets: {{&vert;}} -&gt; {{ | }}                                                                                             | `boolean`        | `true`                              |
+| `vue.autoInsert.bracketSpacing`       | Auto add space between double curly brackets: <code>{{&vert;}}</code> -> <code>{{ &vert; }}</code>                                                                 | `boolean`        | `true`                              |
 | `vue.inlayHints.destructuredProps`    | Show inlay hints for destructured props.                                                                                                                           | `boolean`        | `false`                             |
 | `vue.inlayHints.missingProps`         | Show inlay hints for missing required props.                                                                                                                       | `boolean`        | `false`                             |
 | `vue.inlayHints.inlineHandlerLeading` | Show inlay hints for event argument in inline handlers.                                                                                                            | `boolean`        | `false`                             |

diff --git a/extensions/vscode/package.json b/extensions/vscode/package.json
@@ -402,27 +402,27 @@
 				"vue.inlayHints.destructuredProps": {
 					"type": "boolean",
 					"default": false,
-					"description": "Show inlay hints for destructured props."
+					"markdownDescription": "Show inlay hints for destructured props:\n\n```ts\nwatch(() => /* props. */foo, () => { ... });\n```"
 				},
 				"vue.inlayHints.missingProps": {
 					"type": "boolean",
 					"default": false,
-					"description": "Show inlay hints for missing required props."
+					"markdownDescription": "Show inlay hints for missing required props:\n\n```html\n<Comp />\n<!-- ^ foo! -->\n```"
 				},
 				"vue.inlayHints.inlineHandlerLeading": {
 					"type": "boolean",
 					"default": false,
-					"description": "Show inlay hints for event argument in inline handlers."
+					"markdownDescription": "Show inlay hints for event argument in inline handlers:\n\n```html\n<Comp @foo=\"/* $event => */console.log($event)\" />\n```"
 				},
 				"vue.inlayHints.optionsWrapper": {
 					"type": "boolean",
 					"default": false,
-					"description": "Show inlay hints for component options wrapper for type support."
+					"markdownDescription": "Show inlay hints for component options wrapper for type support:\n\n```vue\n<script lang=\"ts\">\nexport default /* (await import('vue')).defineComponent( */{}/* ) */;\n</script>\n```"
 				},
 				"vue.inlayHints.vBindShorthand": {
 					"type": "boolean",
 					"default": false,
-					"description": "Show inlay hints for v-bind shorthand."
+					"markdownDescription": "Show inlay hints for v-bind shorthand:\n\n```html\n<Comp :foo />\n     <!-- ^ =\"foo\" -->\n```"
 				},
 				"vue.format.template.initialIndent": {
 					"type": "boolean",
@@ -559,8 +559,7 @@
 		"pack:next": "pnpm run build && vsce package",
 		"release": "pnpm run build:minify && vsce publish",
 		"release:next": "pnpm run build && vsce publish --pre-release",
-		"size": "pnpm run build:minify -- --metafile && esbuild-visualizer --metadata ./meta.json && open ./stats.html",
-		"postinstall": "vscode-ext-gen --scope vue"
+		"size": "pnpm run build:minify -- --metafile && esbuild-visualizer --metadata ./meta.json && open ./stats.html"
 	},
 	"devDependencies": {
 		"@types/semver": "^7.5.3",
@@ -574,7 +573,6 @@
 		"esbuild-visualizer": "latest",
 		"reactive-vscode": "^0.2.9",
 		"semver": "^7.5.4",
-		"vscode-ext-gen": "^0.5.0",
 		"vscode-tmlanguage-snapshot": "latest"
 	}
 }