diff --git a/packages/autocomplete/src/utils.ts b/packages/autocomplete/src/utils.ts index 6fce0bffdc..42183eacdf 100644 --- a/packages/autocomplete/src/utils.ts +++ b/packages/autocomplete/src/utils.ts @@ -2,7 +2,7 @@ export function searchUsageBoundary(line: string, index: number) { let start = index let end = index - const regex = /[^\s>"'`]/ + const regex = /[^\s>"'`;]/ while (start && regex.test(line.charAt(start - 1))) --start while (end < line.length && regex.test(line.charAt(end))) ++end diff --git a/packages/vscode/src/annonation.ts b/packages/vscode/src/annonation.ts index 54ae689199..2dc6f81122 100644 --- a/packages/vscode/src/annonation.ts +++ b/packages/vscode/src/annonation.ts @@ -4,7 +4,7 @@ import { DecorationRangeBehavior, MarkdownString, Range, window, workspace } fro import type { UnocssPluginContext } from '@unocss/core' import { INCLUDE_COMMENT_IDE, getMatchedPositions } from './integration' import { log } from './log' -import { getPrettiedMarkdown, throttle } from './utils' +import { getPrettiedMarkdown, isCssId, throttle } from './utils' export async function registerAnnonations( cwd: string, @@ -54,7 +54,7 @@ export async function registerAnnonations( const code = doc.getText() const id = doc.uri.fsPath - if (!code || (!code.includes(INCLUDE_COMMENT_IDE) && !filter(code, id))) + if (!code || (!code.includes(INCLUDE_COMMENT_IDE) && !isCssId(id) && !filter(code, id))) return reset() const result = await uno.generate(code, { id, preflights: false, minify: true }) diff --git a/packages/vscode/src/autocomplete.ts b/packages/vscode/src/autocomplete.ts index 892d1a1dc0..bfab4746a4 100644 --- a/packages/vscode/src/autocomplete.ts +++ b/packages/vscode/src/autocomplete.ts @@ -2,7 +2,7 @@ import type { UnocssPluginContext } from '@unocss/core' import { createAutocomplete } from '@unocss/autocomplete' import type { CompletionItemProvider, ExtensionContext, Position, TextDocument } from 'vscode' import { CompletionItem, CompletionItemKind, CompletionList, MarkdownString, Range, languages } from 'vscode' -import { getPrettiedMarkdown } from './utils' +import { getPrettiedMarkdown, isCssId } from './utils' import { log } from './log' const languageIds = [ @@ -10,6 +10,7 @@ const languageIds = [ 'haml', 'hbs', 'html', + 'css', 'javascript', 'javascriptreact', 'markdown', @@ -40,7 +41,7 @@ export async function registerAutoComplete( const code = doc.getText() const id = doc.uri.fsPath - if (!code || !filter(code, id)) + if (!code || (!isCssId(id) && !filter(code, id))) return null try { diff --git a/packages/vscode/src/utils.ts b/packages/vscode/src/utils.ts index 8e3d3ce494..c245f512ae 100644 --- a/packages/vscode/src/utils.ts +++ b/packages/vscode/src/utils.ts @@ -1,8 +1,9 @@ import type { UnoGenerator } from '@unocss/core' +import { cssIdRE } from '@unocss/core' import prettier from 'prettier/standalone' import parserCSS from 'prettier/parser-postcss' -export function throttle any)>(func: T, timeFrame: number): T { +export function throttle any)>(func: T, timeFrame: number): T { let lastTime = 0 let timer: any return function () { @@ -34,3 +35,7 @@ export async function getPrettiedCSS(uno: UnoGenerator, util: string) { export async function getPrettiedMarkdown(uno: UnoGenerator, util: string) { return `\`\`\`css\n${(await getPrettiedCSS(uno, util)).prettified}\n\`\`\`` } + +export function isCssId(id: string) { + return cssIdRE.test(id) +} diff --git a/test/autocomplete-utils.test.ts b/test/autocomplete-utils.test.ts index 206e8d6e01..8b403c4e2e 100644 --- a/test/autocomplete-utils.test.ts +++ b/test/autocomplete-utils.test.ts @@ -11,5 +11,8 @@ describe('searchUsageBoundary', () => { expect(searchUsageBoundary('
', 10).content) .toMatchInlineSnapshot('"p-2"') + + expect(searchUsageBoundary('.a{ @apply p-2; }', 14).content) + .toMatchInlineSnapshot('"p-2"') }) })