Use entire body of <script lang=ts> in vue compiler (fixes #740)

webpro · webpro · commit 8d53df517a88 · 2024-11-15T23:28:08.000+01:00
diff --git a/packages/knip/fixtures/compilers/Component.vue b/packages/knip/fixtures/compilers/Component.vue
@@ -0,0 +1,4 @@
+<script setup lang="ts">
+import { Enum } from './enum';
+Enum.Member;
+</script>
diff --git a/packages/knip/fixtures/compilers/enum.ts b/packages/knip/fixtures/compilers/enum.ts
@@ -0,0 +1,3 @@
+export enum Enum {
+  Member = 'member',
+}
diff --git a/packages/knip/fixtures/compilers/index.ts b/packages/knip/fixtures/compilers/index.ts
@@ -1,2 +1,6 @@
 import identifier from './module.mdx';
+import Component from './Component.vue';
+import { createApp } from 'vue';
+
 identifier;
+createApp(Component);
diff --git a/packages/knip/fixtures/compilers/package.json b/packages/knip/fixtures/compilers/package.json
@@ -1,6 +1,7 @@
 {
   "name": "compilers",
   "devDependencies": {
-    "@mdx-js/mdx": "*"
+    "@mdx-js/mdx": "*",
+    "vue": "*"
   }
 }
diff --git a/packages/knip/fixtures/compilers/tsconfig.json b/packages/knip/fixtures/compilers/tsconfig.json
@@ -1,5 +1,6 @@
 {
   "compilerOptions": {
-    "target": "ES2015"
+    "target": "ES2015",
+    "jsx": "preserve"
   }
 }
diff --git a/packages/knip/src/compilers/compilers.ts b/packages/knip/src/compilers/compilers.ts
@@ -1,9 +1,10 @@
 import type { SyncCompilerFn } from './types.js';
 
-const scriptExtractor = /<script\b[^>]*>([\s\S]*?)<\/script>/gm;
-export const importMatcher = /import[^'"]+['"]([^'"]+)['"]/g;
 export const fencedCodeBlockMatcher = /```[\s\S]*?```/g;
 
+// Extract imports from body of <script> nodes
+const scriptExtractor = /<script\b[^>]*>([\s\S]*?)<\/script>/gm;
+export const importMatcher = /import[^'"]+['"]([^'"]+)['"]/g;
 export const importsWithinScripts: SyncCompilerFn = (text: string) => {
   const scripts = [];
   let scriptMatch: RegExpExecArray | null;
@@ -15,3 +16,15 @@ export const importsWithinScripts: SyncCompilerFn = (text: string) => {
   }
   return scripts.join(';\n');
 };
+
+// Extract body of <script lang="ts"> nodes
+const tsScriptExtractor = /<script\b[^>]*lang="ts"[^>]*>(?<body>[\s\S]*?)<\/script>/gm;
+export const tsScriptBodies: SyncCompilerFn = (text: string) => {
+  const scripts = [];
+  let scriptMatch: RegExpExecArray | null;
+  // biome-ignore lint/suspicious/noAssignInExpressions: ignore
+  while ((scriptMatch = tsScriptExtractor.exec(text))) {
+    if (scriptMatch.groups?.body) scripts.push(scriptMatch.groups.body);
+  }
+  return scripts.join(';\n');
+};
diff --git a/packages/knip/src/compilers/vue.ts b/packages/knip/src/compilers/vue.ts
@@ -1,8 +1,8 @@
-import { importsWithinScripts } from './compilers.js';
+import { tsScriptBodies } from './compilers.js';
 import type { HasDependency } from './types.js';
 
 const condition = (hasDependency: HasDependency) => hasDependency('vue') || hasDependency('nuxt');
 
-const compiler = importsWithinScripts;
+const compiler = tsScriptBodies;
 
 export default { condition, compiler };
diff --git a/packages/knip/src/typescript/get-imports-and-exports.ts b/packages/knip/src/typescript/get-imports-and-exports.ts
@@ -1,6 +1,6 @@
 import { isBuiltin } from 'node:module';
 import ts from 'typescript';
-import { ALIAS_TAG, ANONYMOUS, DEFAULT_EXTENSIONS, IMPORT_STAR, PROTOCOL_VIRTUAL } from '../constants.js';
+import { ALIAS_TAG, ANONYMOUS, IMPORT_STAR, PROTOCOL_VIRTUAL } from '../constants.js';
 import type { GetImportsAndExportsOptions } from '../types/config.js';
 import type { ExportMap, ExportMember, ImportDetails, ImportMap, UnresolvedImport } from '../types/dependency-graph.js';
 import type { ExportNode, ExportNodeMember } from '../types/exports.js';
@@ -9,7 +9,7 @@ import type { IssueSymbol } from '../types/issues.js';
 import { timerify } from '../util/Performance.js';
 import { addNsValue, addValue, createImports } from '../util/dependency-graph.js';
 import { getPackageNameFromFilePath, isStartsLikePackageName, sanitizeSpecifier } from '../util/modules.js';
-import { extname, isInNodeModules } from '../util/path.js';
+import { isInNodeModules } from '../util/path.js';
 import { shouldIgnore } from '../util/tag.js';
 import type { BoundSourceFile } from './SourceFile.js';
 import {
@@ -155,9 +155,7 @@ const getImportsAndExports = (
         addValue(imports.imported, identifier, sourceFile.fileName);
       }
 
-      if (symbol && DEFAULT_EXTENSIONS.includes(extname(sourceFile.fileName))) {
-        importedInternalSymbols.set(symbol, filePath);
-      }
+      if (symbol) importedInternalSymbols.set(symbol, filePath);
     }
   };
 
diff --git a/packages/knip/test/compilers.test.ts b/packages/knip/test/compilers.test.ts
@@ -19,7 +19,7 @@ test('Support compiler functions in config', async () => {
   assert.deepEqual(counters, {
     ...baseCounters,
     files: 2,
-    processed: 9,
-    total: 9,
+    processed: 11,
+    total: 11,
   });
 });

Original file line number	Diff line number	Diff line change
`@@ -0,0 +1,3 @@`
	`1`	`+export enum Enum {`
	`2`	`+ Member = 'member',`
	`3`	`+}`
Original file line number	Diff line number	Diff line change
`@@ -1,6 +1,7 @@`
`1`	`1`	`{`
`2`	`2`	`"name": "compilers",`
`3`	`3`	`"devDependencies": {`
`4`		`- "@mdx-js/mdx": "*"`
	`4`	`+ "@mdx-js/mdx": "*",`
	`5`	`+ "vue": "*"`
`5`	`6`	`}`
`6`	`7`	`}`
Original file line number	Diff line number	Diff line change
`@@ -1,5 +1,6 @@`
`1`	`1`	`{`
`2`	`2`	`"compilerOptions": {`
`3`		`- "target": "ES2015"`
	`3`	`+ "target": "ES2015",`
	`4`	`+ "jsx": "preserve"`
`4`	`5`	`}`
`5`	`6`	`}`