feat: add "Vue" from auto import

close #82
vuejs · Oct 22, 2022 · 6cad71b · 6cad71b
1 parent 07d204f
commit 6cad71b
Show file tree

Hide file tree

Showing 2 changed files with 33 additions and 2 deletions.
diff --git a/extensions/vscode-vue-language-features/package.json b/extensions/vscode-vue-language-features/package.json
@@ -471,6 +471,11 @@
 					"default": true,
 					"description": "Enabled auto-import for component with tag completion."
 				},
+				"volar.completion.trimVueFromImportName": {
+					"type": "boolean",
+					"default": true,
+					"description": "Trim \"Vue\" from import name from auto import."
+				},
 				"volar.preview.script.vite": {
 					"type": "string",
 					"default": "node {VITE_BIN} --port={PORT}"

diff --git a/vue-language-tools/vue-language-service/src/languageService.ts b/vue-language-tools/vue-language-service/src/languageService.ts
@@ -38,10 +38,36 @@ export function getSemanticTokenLegend() {
 export function getLanguageServicePlugins(
 	host: vue.LanguageServiceHost,
 	apis: embeddedLS.LanguageService,
-) {
+): embeddedLS.LanguageServicePlugin[] {
 
 	// plugins
-	const tsPlugin = useTsPlugin();
+	const _tsPlugin = useTsPlugin();
+	const tsPlugin: embeddedLS.LanguageServicePlugin = (() => {
+		let context: embeddedLS.LanguageServicePluginContext;
+		return {
+			..._tsPlugin,
+			setup(_context) {
+				_tsPlugin.setup?.(_context);
+				context = _context;
+			},
+			complete: {
+				..._tsPlugin.complete,
+				async resolve(item) {
+					item = await _tsPlugin.complete!.resolve!(item);
+					if (
+						/\w*Vue$/.test(item.label)
+						&& item.textEdit?.newText && /\w*Vue$/.test(item.textEdit.newText)
+						&& item.additionalTextEdits?.length === 1 && item.additionalTextEdits[0].newText.indexOf('Vue from ') >= 0
+						&& (await context.env.configurationHost?.getConfiguration<boolean>('volar.completion.trimVueFromImportName') ?? true)
+					) {
+						item.textEdit.newText = item.textEdit.newText.slice(0, -'Vue'.length);
+						item.additionalTextEdits[0].newText = item.additionalTextEdits[0].newText.replace('Vue from ', ' from ');
+					}
+					return item;
+				},
+			},
+		};
+	})();
 	const vuePlugin = useVuePlugin({
 		getVueDocument: (document) => apis.context.documents.get(document.uri),
 	});