fix(webpack): don't parse styles for composable keys

nuxt · Sep 7, 2022 · 3a71f1d · 3a71f1d
1 parent 6b3a1a4
commit 3a71f1d
Show file tree

Hide file tree

Showing 2 changed files with 10 additions and 3 deletions.
diff --git a/packages/vite/src/plugins/composable-keys.ts b/packages/vite/src/plugins/composable-keys.ts
@@ -5,7 +5,7 @@ import { walk } from 'estree-walker'
 import MagicString from 'magic-string'
 import { hash } from 'ohash'
 import type { CallExpression } from 'estree'
-import { parseURL } from 'ufo'
+import { parseQuery, parseURL } from 'ufo'
 
 export interface ComposableKeysOptions {
   sourcemap: boolean
@@ -22,8 +22,8 @@ export const composableKeysPlugin = createUnplugin((options: ComposableKeysOptio
     name: 'nuxt:composable-keys',
     enforce: 'post',
     transform (code, id) {
-      const { pathname } = parseURL(decodeURIComponent(pathToFileURL(id).href))
-      if (!pathname.match(/\.(m?[jt]sx?|vue)/)) { return }
+      const { pathname, search } = parseURL(decodeURIComponent(pathToFileURL(id).href))
+      if (!pathname.match(/\.(m?[jt]sx?|vue)/) || parseQuery(search).type === 'style') { return }
       if (!KEYED_FUNCTIONS_RE.test(code)) { return }
       const { 0: script = code, index: codeIndex = 0 } = code.match(/(?<=<script[^>]*>)[\S\s.]*?(?=<\/script>)/) || []
       const s = new MagicString(code)

diff --git a/test/fixtures/basic/pages/keyed-composables.vue b/test/fixtures/basic/pages/keyed-composables.vue
@@ -43,3 +43,10 @@ const { data: useLazyFetchTest2 } = await useLocalLazyFetch()
     {{ useLazyFetchTest1 === useLazyFetchTest2 }}
   </div>
 </template>
+
+<style scoped>
+body {
+  background-color: #000;
+  color: #fff;
+}
+</style>