fix: failed to transform Vue on webpack, close #27, close #26

Author: antfu

examples/vue-cli/vue.config.js

@@ -1,6 +1,6 @@
 /* eslint-disable @typescript-eslint/no-var-requires */
 
-const ScriptSetup = require('unplugin-vue2-script-setup/webpack')
+const ScriptSetup = require('unplugin-vue2-script-setup/webpack').default
 
 /**
  * @type {import('@vue/cli-service').ProjectOptions}

playground/App.vue

@@ -8,6 +8,7 @@
 import HelloWorld from './HelloWorld.vue'
 
 function onUpdate(e: any) {
+  // eslint-disable-next-line no-console
   console.log(e)
 }
 </script>

src/core/transform.ts

@@ -16,10 +16,10 @@ export function transform(input: string, id: string, options?: ScriptSetupTransf
   if (!shouldTransform(input, id, options))
     return null
   const resolved = resolveOptions(options)
-  if (!id.endsWith('.vue'))
-    return transformNonVue(input, id, resolved)
-  else
+  if (id.endsWith('.vue') || id.includes('.vue?vue'))
     return transformVue(input, id, resolved)
+  else
+    return transformNonVue(input, id, resolved)
 }
 
 function transformNonVue(input: string, id: string, options: ResolvedOptions): TransformResult {

test/__snapshots__/transform.test.ts.snap

@@ -13,6 +13,7 @@ const __sfc_main = {};
 
 __sfc_main.setup = (__props, __ctx) => {
   function onUpdate(e: any) {
+    // eslint-disable-next-line no-console
     console.log(e);
   }
 
@@ -145,41 +146,6 @@ export default defineConfig({
 "
 `;
 
-exports[`transform fixtures test/fixtures/A.vue 1`] = `
-"<template>
-  <div @click=\\"counter\\">{{ msg }}: {{ count }}</div>
-</template>
-
-<script lang=\\"ts\\">
-const __sfc_main = {
-  data() {
-    return {
-      msg: 'hello'
-    };
-  }
-
-};
-
-__sfc_main.setup = (__props, __ctx) => {
-  let count = 0;
-
-  function counter() {
-    count = count + 1;
-  }
-
-  return {
-    count,
-    counter
-  };
-};
-
-export default __sfc_main;
-</script>
-
-
-"
-`;
-
 exports[`transform fixtures test/fixtures/DynamicStyle.vue 1`] = `
 "<template>
   <div :style=\\"{ color, border: '1px' }\\" />