fix(compiler-sfc): prohibit src usage for <script setup> + do not

process non js/ts blocks in compileScript

Author: yyx990803

packages/compiler-sfc/src/compileScript.ts

@@ -53,10 +53,9 @@ export function compileScript(
 
   const hasCssVars = styles.some(s => typeof s.attrs.vars === 'string')
 
-  const isTS =
-    (script && script.lang === 'ts') ||
-    (scriptSetup && scriptSetup.lang === 'ts')
-
+  const scriptLang = script && script.lang
+  const scriptSetupLang = scriptSetup && scriptSetup.lang
+  const isTS = scriptLang === 'ts' || scriptSetupLang === 'ts'
   const plugins: ParserPlugin[] = [
     ...(options.babelParserPlugins || []),
     ...babelParserDefautPlugins,
@@ -67,19 +66,28 @@ export function compileScript(
     if (!script) {
       throw new Error(`SFC contains no <script> tags.`)
     }
+    if (scriptLang && scriptLang !== 'ts') {
+      // do not process non js/ts script blocks
+      return script
+    }
     return {
       ...script,
       content: hasCssVars ? injectCssVarsCalls(sfc, plugins) : script.content,
       bindings: analyzeScriptBindings(script)
     }
   }
 
-  if (script && script.lang !== scriptSetup.lang) {
+  if (script && scriptLang !== scriptSetupLang) {
     throw new Error(
       `<script> and <script setup> must have the same language type.`
     )
   }
 
+  if (scriptSetupLang && scriptSetupLang !== 'ts') {
+    // do not process non js/ts script blocks
+    return scriptSetup
+  }
+
   const defaultTempVar = `__default__`
   const bindings: BindingMetadata = {}
   const imports: Record<string, string> = {}

packages/compiler-sfc/src/parse.ts

@@ -150,15 +150,6 @@ export function parse(
         const block = createBlock(node, source, pad) as SFCScriptBlock
         const isSetup = !!block.attrs.setup
         if (isSetup && !descriptor.scriptSetup) {
-          if (block.src) {
-            errors.push(
-              new SyntaxError(
-                `<script setup> cannot be used with the "src" attribute since ` +
-                  `its syntax will be ambiguous outside of the component.`
-              )
-            )
-            break
-          }
           descriptor.scriptSetup = block
           break
         }
@@ -177,6 +168,27 @@ export function parse(
     }
   })
 
+  if (descriptor.scriptSetup) {
+    if (descriptor.scriptSetup.src) {
+      errors.push(
+        new SyntaxError(
+          `<script setup> cannot use the "src" attribute because ` +
+            `its syntax will be ambiguous outside of the component.`
+        )
+      )
+      delete descriptor.scriptSetup
+    }
+    if (descriptor.script && descriptor.script.src) {
+      errors.push(
+        new SyntaxError(
+          `<script> cannot use the "src" attribute when <script setup> is ` +
+            `also present because they must be processed together.`
+        )
+      )
+      delete descriptor.script
+    }
+  }
+
   if (sourceMap) {
     const genMap = (block: SFCBlock | null) => {
       if (block && !block.src) {