From d0790d8f31379e4e724199fb7bfa4dc98f349485 Mon Sep 17 00:00:00 2001 From: Kolobok12309 Date: Wed, 25 Jun 2025 21:16:59 +0300 Subject: [PATCH 1/6] fix: Can import style between sfc's --- packages/plugin-vue/src/main.ts | 30 +++++++++++++++++++++++------- 1 file changed, 23 insertions(+), 7 deletions(-) diff --git a/packages/plugin-vue/src/main.ts b/packages/plugin-vue/src/main.ts index 446a2073..202ac500 100644 --- a/packages/plugin-vue/src/main.ts +++ b/packages/plugin-vue/src/main.ts @@ -12,6 +12,7 @@ import { createDescriptor, getDescriptor, getPrevDescriptor, + getSrcDescriptor, setSrcDescriptor, } from './utils/descriptorCache' import { @@ -434,13 +435,28 @@ async function genStyleCode( if (descriptor.styles.length) { for (let i = 0; i < descriptor.styles.length; i++) { const style = descriptor.styles[i] + let indexQuery = i if (style.src) { - await linkSrcToDescriptor( - style.src, - descriptor, - pluginContext, - style.scoped, - ) + const resolvedSrc = + (await pluginContext.resolve(style.src, descriptor.filename))?.id || + style.src + const alreadyDescriptor = getSrcDescriptor(resolvedSrc, { + scoped: style.scoped, + src: descriptor.id, + }) + + if (alreadyDescriptor) { + indexQuery = alreadyDescriptor.styles.findIndex( + ({ scoped, src }) => style.scoped === scoped && style.src === src, + ) + } else { + await linkSrcToDescriptor( + style.src, + descriptor, + pluginContext, + style.scoped, + ) + } } const src = style.src || descriptor.filename // do not include module in default query, since we use it to indicate @@ -453,7 +469,7 @@ async function genStyleCode( : '' const directQuery = customElement ? `&inline` : `` const scopedQuery = style.scoped ? `&scoped=${descriptor.id}` : `` - const query = `?vue&type=style&index=${i}${srcQuery}${directQuery}${scopedQuery}` + const query = `?vue&type=style&index=${indexQuery}${srcQuery}${directQuery}${scopedQuery}` const styleRequest = src + query + attrsQuery if (style.module) { if (customElement) { From 79fdb168846bbc501c2c3372c035e848efc61641 Mon Sep 17 00:00:00 2001 From: Kolobok12309 Date: Thu, 26 Jun 2025 09:25:50 +0300 Subject: [PATCH 2/6] Add support of different src for same file --- packages/plugin-vue/src/main.ts | 19 ++++++++++++++++--- 1 file changed, 16 insertions(+), 3 deletions(-) diff --git a/packages/plugin-vue/src/main.ts b/packages/plugin-vue/src/main.ts index 202ac500..d6565d09 100644 --- a/packages/plugin-vue/src/main.ts +++ b/packages/plugin-vue/src/main.ts @@ -446,9 +446,22 @@ async function genStyleCode( }) if (alreadyDescriptor) { - indexQuery = alreadyDescriptor.styles.findIndex( - ({ scoped, src }) => style.scoped === scoped && style.src === src, - ) + const foundIndex = await alreadyDescriptor.styles.reduce(async (acc, { scoped, src }, index) => { + const prevRes = await acc; + + if (~prevRes) return prevRes; + if (scoped !== style.scoped) return prevRes; + if (!src) return prevRes; + + const _resolvedSrc = (await pluginContext.resolve(src, alreadyDescriptor.filename))?.id || src + + if (_resolvedSrc !== resolvedSrc) return prevRes; + + return index; + }, Promise.resolve(-1)); + + if (~foundIndex) + indexQuery = foundIndex } else { await linkSrcToDescriptor( style.src, From 97da6f98133034a3bc2d65a762a47134f453b995 Mon Sep 17 00:00:00 2001 From: Kolobok12309 Date: Thu, 26 Jun 2025 09:35:52 +0300 Subject: [PATCH 3/6] Fix test run --- playground/vue-custom-id/package.json | 1 + 1 file changed, 1 insertion(+) diff --git a/playground/vue-custom-id/package.json b/playground/vue-custom-id/package.json index aad14496..40430877 100644 --- a/playground/vue-custom-id/package.json +++ b/playground/vue-custom-id/package.json @@ -2,6 +2,7 @@ "name": "@vitejs/test-vue-custom-id", "private": true, "version": "0.0.0", + "type": "module", "scripts": { "dev": "vite", "build": "vite build", From 98deac66ce030cb2e7d35de1a89a383a1e4ed8e6 Mon Sep 17 00:00:00 2001 From: Kolobok12309 Date: Thu, 26 Jun 2025 10:35:03 +0300 Subject: [PATCH 4/6] Add tests --- playground/vue/src-import/SrcImport.vue | 4 ++++ playground/vue/src-import/bar.css | 0 playground/vue/src-import/foo.css | 0 playground/vue/src-import/script.ts | 4 ++++ playground/vue/src-import/srcImportScopedStyle.vue | 7 +++++++ playground/vue/src-import/srcImportScopedStyle2.vue | 4 ++++ playground/vue/src-import/srcImportStyle.vue | 3 ++- playground/vue/src-import/srcImportStyle2.vue | 2 +- playground/vue/src-import/template.html | 2 ++ 9 files changed, 24 insertions(+), 2 deletions(-) create mode 100644 playground/vue/src-import/bar.css create mode 100644 playground/vue/src-import/foo.css create mode 100644 playground/vue/src-import/srcImportScopedStyle.vue create mode 100644 playground/vue/src-import/srcImportScopedStyle2.vue diff --git a/playground/vue/src-import/SrcImport.vue b/playground/vue/src-import/SrcImport.vue index d70e1f48..3cadcbee 100644 --- a/playground/vue/src-import/SrcImport.vue +++ b/playground/vue/src-import/SrcImport.vue @@ -1,4 +1,8 @@ + + + + diff --git a/playground/vue/src-import/bar.css b/playground/vue/src-import/bar.css new file mode 100644 index 00000000..e69de29b diff --git a/playground/vue/src-import/foo.css b/playground/vue/src-import/foo.css new file mode 100644 index 00000000..e69de29b diff --git a/playground/vue/src-import/script.ts b/playground/vue/src-import/script.ts index 1a9f7ec3..f4ef2682 100644 --- a/playground/vue/src-import/script.ts +++ b/playground/vue/src-import/script.ts @@ -1,6 +1,8 @@ import { defineComponent } from 'vue' import SrcImportStyle from './srcImportStyle.vue' import SrcImportStyle2 from './srcImportStyle2.vue' +import SrcImportScopedStyle from './srcImportScopedStyle.vue' +import SrcImportScopedStyle2 from './srcImportScopedStyle2.vue' import SrcImportModuleStyle from './srcImportModuleStyle.vue' import SrcImportModuleStyle2 from './srcImportModuleStyle2.vue' @@ -8,6 +10,8 @@ export default defineComponent({ components: { SrcImportStyle, SrcImportStyle2, + SrcImportScopedStyle, + SrcImportScopedStyle2, SrcImportModuleStyle, SrcImportModuleStyle2, }, diff --git a/playground/vue/src-import/srcImportScopedStyle.vue b/playground/vue/src-import/srcImportScopedStyle.vue new file mode 100644 index 00000000..de917698 --- /dev/null +++ b/playground/vue/src-import/srcImportScopedStyle.vue @@ -0,0 +1,7 @@ + + + diff --git a/playground/vue/src-import/srcImportScopedStyle2.vue b/playground/vue/src-import/srcImportScopedStyle2.vue new file mode 100644 index 00000000..1e0f3274 --- /dev/null +++ b/playground/vue/src-import/srcImportScopedStyle2.vue @@ -0,0 +1,4 @@ + + diff --git a/playground/vue/src-import/srcImportStyle.vue b/playground/vue/src-import/srcImportStyle.vue index de917698..e78e2e31 100644 --- a/playground/vue/src-import/srcImportStyle.vue +++ b/playground/vue/src-import/srcImportStyle.vue @@ -1,4 +1,5 @@ - + + diff --git a/playground/vue/src-import/srcImportStyle2.vue b/playground/vue/src-import/srcImportStyle2.vue index 1e0f3274..e8ab4b43 100644 --- a/playground/vue/src-import/srcImportStyle2.vue +++ b/playground/vue/src-import/srcImportStyle2.vue @@ -1,4 +1,4 @@ - + diff --git a/playground/vue/src-import/template.html b/playground/vue/src-import/template.html index af94a480..d24f459b 100644 --- a/playground/vue/src-import/template.html +++ b/playground/vue/src-import/template.html @@ -3,5 +3,7 @@

SFC Src Imports

This should be tan
+ + From 26afe8f23274779681ad44afd02e3483f67697ef Mon Sep 17 00:00:00 2001 From: Kolobok12309 Date: Thu, 26 Jun 2025 10:36:47 +0300 Subject: [PATCH 5/6] Run lint fix --- packages/plugin-vue/src/main.ts | 26 +++++++++++++++----------- 1 file changed, 15 insertions(+), 11 deletions(-) diff --git a/packages/plugin-vue/src/main.ts b/packages/plugin-vue/src/main.ts index d6565d09..ecca81e5 100644 --- a/packages/plugin-vue/src/main.ts +++ b/packages/plugin-vue/src/main.ts @@ -446,22 +446,26 @@ async function genStyleCode( }) if (alreadyDescriptor) { - const foundIndex = await alreadyDescriptor.styles.reduce(async (acc, { scoped, src }, index) => { - const prevRes = await acc; + const foundIndex = await alreadyDescriptor.styles.reduce( + async (acc, { scoped, src }, index) => { + const prevRes = await acc - if (~prevRes) return prevRes; - if (scoped !== style.scoped) return prevRes; - if (!src) return prevRes; + if (~prevRes) return prevRes + if (scoped !== style.scoped) return prevRes + if (!src) return prevRes - const _resolvedSrc = (await pluginContext.resolve(src, alreadyDescriptor.filename))?.id || src + const _resolvedSrc = + (await pluginContext.resolve(src, alreadyDescriptor.filename)) + ?.id || src - if (_resolvedSrc !== resolvedSrc) return prevRes; + if (_resolvedSrc !== resolvedSrc) return prevRes - return index; - }, Promise.resolve(-1)); + return index + }, + Promise.resolve(-1), + ) - if (~foundIndex) - indexQuery = foundIndex + if (~foundIndex) indexQuery = foundIndex } else { await linkSrcToDescriptor( style.src, From 22d7b86592129787b4d17a7bbf1d06a11634eadf Mon Sep 17 00:00:00 2001 From: Kolobok12309 Date: Thu, 24 Jul 2025 08:42:27 +0300 Subject: [PATCH 6/6] chore: Replace bitwise NOT --- packages/plugin-vue/src/main.ts | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/plugin-vue/src/main.ts b/packages/plugin-vue/src/main.ts index ecca81e5..0085f7be 100644 --- a/packages/plugin-vue/src/main.ts +++ b/packages/plugin-vue/src/main.ts @@ -450,7 +450,7 @@ async function genStyleCode( async (acc, { scoped, src }, index) => { const prevRes = await acc - if (~prevRes) return prevRes + if (prevRes !== -1) return prevRes if (scoped !== style.scoped) return prevRes if (!src) return prevRes @@ -465,7 +465,7 @@ async function genStyleCode( Promise.resolve(-1), ) - if (~foundIndex) indexQuery = foundIndex + if (foundIndex !== -1) indexQuery = foundIndex } else { await linkSrcToDescriptor( style.src,