diff --git a/packages/language-server/tests/completions.spec.ts b/packages/language-server/tests/completions.spec.ts index b86517721e..96c9624688 100644 --- a/packages/language-server/tests/completions.spec.ts +++ b/packages/language-server/tests/completions.spec.ts @@ -23,11 +23,23 @@ describe('Completions', async () => { "script setup lang="tsx"", "script setup lang="jsx"", "style lang="css"", + "style lang="css" scoped", + "style lang="css" module", "style lang="scss"", + "style lang="scss" scoped", + "style lang="scss" module", "style lang="less"", + "style lang="less" scoped", + "style lang="less" module", "style lang="stylus"", + "style lang="stylus" scoped", + "style lang="stylus" module", "style lang="postcss"", + "style lang="postcss" scoped", + "style lang="postcss" module", "style lang="sass"", + "style lang="sass" scoped", + "style lang="sass" module", "template lang="pug"", ] `); diff --git a/packages/language-service/lib/plugins/vue-sfc.ts b/packages/language-service/lib/plugins/vue-sfc.ts index ea6ea241fa..0bd4816423 100644 --- a/packages/language-service/lib/plugins/vue-sfc.ts +++ b/packages/language-service/lib/plugins/vue-sfc.ts @@ -195,16 +195,11 @@ export function create(): LanguageServicePlugin { styleItem.kind = 17 satisfies typeof vscode.CompletionItemKind.File; styleItem.detail = '.css'; for (const lang of styleLangs) { - result.items.push({ - ...styleItem, - kind: 17 satisfies typeof vscode.CompletionItemKind.File, - detail: lang === 'postcss' ? '.css' : `.${lang}`, - label: styleItem.label + ' lang="' + lang + '"', - textEdit: styleItem.textEdit ? { - ...styleItem.textEdit, - newText: styleItem.textEdit.newText + ' lang="' + lang + '"', - } : undefined, - }); + result.items.push( + getStyleCompletionItem(styleItem, lang), + getStyleCompletionItem(styleItem, lang, 'scoped'), + getStyleCompletionItem(styleItem, lang, 'module') + ); } } @@ -253,3 +248,20 @@ export function create(): LanguageServicePlugin { } } } + +function getStyleCompletionItem( + styleItem: vscode.CompletionItem, + lang: string, + attr?: string +): vscode.CompletionItem { + return { + ...styleItem, + kind: 17 satisfies typeof vscode.CompletionItemKind.File, + detail: lang === 'postcss' ? '.css' : `.${lang}`, + label: styleItem.label + ' lang="' + lang + '"' + (attr ? ` ${attr}` : ''), + textEdit: styleItem.textEdit ? { + ...styleItem.textEdit, + newText: styleItem.textEdit.newText + ' lang="' + lang + '"' + (attr ? ` ${attr}` : ''), + } : undefined + }; +}