diff --git a/packages/playground/server/api/analyze.ts b/packages/playground/server/api/analyze.ts index 3b8133e..5c15b42 100644 --- a/packages/playground/server/api/analyze.ts +++ b/packages/playground/server/api/analyze.ts @@ -24,7 +24,10 @@ export default defineEventHandler(async (ctx) => { graph = analyzeSetupScript(sfc.descriptor.scriptSetup?.content!); } else if(sfc.descriptor.script?.content) { - if (sfc.descriptor.script.lang === 'tsx' || sfc.descriptor.script.lang === 'jsx') { + if ( + (sfc.descriptor.script.lang === 'tsx' || sfc.descriptor.script.lang === 'jsx') + && !sfc.descriptor.template?.content + ) { const res = await analyzeTsx(sfc.descriptor.script?.content!); graph = res.graph; nodes = res.nodesUsedInTemplate; diff --git a/packages/vscode/src/analyze.ts b/packages/vscode/src/analyze.ts index a5ca728..9a9fe2f 100644 --- a/packages/vscode/src/analyze.ts +++ b/packages/vscode/src/analyze.ts @@ -25,7 +25,10 @@ export async function analyze(code: string) { ); } else if(sfc.descriptor.script?.content) { - if (sfc.descriptor.script.lang === 'tsx' || sfc.descriptor.script.lang === 'jsx') { + if ( + (sfc.descriptor.script.lang === 'tsx' || sfc.descriptor.script.lang === 'jsx') + && !sfc.descriptor.template?.content + ) { const res = await analyzeTsx(sfc.descriptor.script?.content!, (sfc.descriptor.script.loc.start.line || 1) - 1, ); diff --git a/src/analyze/options.ts b/src/analyze/options.ts index 28da780..781560c 100644 --- a/src/analyze/options.ts +++ b/src/analyze/options.ts @@ -16,6 +16,7 @@ export function analyze( const ast = babelParse(content, { sourceType: 'module', plugins: [ 'typescript', + 'jsx', ], }); @@ -166,12 +167,21 @@ export function analyze( // 3 filter data by return traverse(setupNode, { ReturnStatement(path2) { + // only process return in setupNode scope + if(path2.scope !== path1.scope) { + return; + } + if(path2.node.argument?.type === 'ObjectExpression') { const returnNode = path2.node.argument; traverse(returnNode, { ObjectProperty(path3) { if(path3.parent === returnNode) { - if(path3.node.key.type === 'Identifier' && path3.node.value.type === 'Identifier') { + if( + path3.node.key.type === 'Identifier' + && path3.node.value.type === 'Identifier' + && tempNodes.has(path3.node.value.name) + ) { const valName = path3.node.value.name; if(!graph.nodes.has(valName)) { graph.nodes.add(valName); @@ -234,7 +244,7 @@ export function analyze( }, }, path2.scope, path2); } else { - console.warn('setup return type is not ObjectExpression'); + console.warn(`setup return type(${path2.node.argument?.type}) is not ObjectExpression`); } }, }, path1.scope, path1); diff --git a/src/analyze/setupScript.ts b/src/analyze/setupScript.ts index edb292f..27297af 100644 --- a/src/analyze/setupScript.ts +++ b/src/analyze/setupScript.ts @@ -514,6 +514,7 @@ export function analyze( const ast = babelParse(content, { sourceType: 'module', plugins: [ 'typescript', + 'jsx', ], }); diff --git a/src/analyze/template.ts b/src/analyze/template.ts index efbf138..22cd9ac 100644 --- a/src/analyze/template.ts +++ b/src/analyze/template.ts @@ -44,6 +44,15 @@ export function analyze( } } }, + // component + CallExpression(path) { + if(path.node.callee.type === 'Identifier' && path.node.callee.name === '_resolveComponent') { + if(path.node.arguments[0].type === 'StringLiteral') { + const name = path.node.arguments[0].value; + name && nodes.add(name); + } + } + }, }); return nodes; diff --git a/test/options-setup/TestComponent.graph.ts b/test/options-setup/TestComponent.graph.ts index 7c041c5..a664ffe 100644 --- a/test/options-setup/TestComponent.graph.ts +++ b/test/options-setup/TestComponent.graph.ts @@ -2,13 +2,14 @@ import { NodeType, TypedNode } from '@/analyze/utils'; const edges = new Map>(); -const number: TypedNode = {label: 'number', type: NodeType.var, info: {line: 65, column: 6}}; -const count: TypedNode = {label: 'count', type: NodeType.var, info: {line: 67, column: 10}}; -const plus: TypedNode = {label: 'plus', type: NodeType.fun, info: {line: 70, column: 6}}; -const add: TypedNode = {label: 'add', type: NodeType.fun, info: {line: 74, column: 6}}; -const a: TypedNode = {label: 'a', type: NodeType.var, info: {line: 81, column: 10}}; -const b: TypedNode = {label: 'b', type: NodeType.var, info: {line: 82, column: 10}}; -const c: TypedNode = {label: 'c', type: NodeType.var, info: {line: 87, column: 6}}; +const number: TypedNode = {label: 'number', type: NodeType.var, info: {line: 66, column: 6}}; +const count: TypedNode = {label: 'count', type: NodeType.var, info: {line: 68, column: 10}}; +const plus: TypedNode = {label: 'plus', type: NodeType.fun, info: {line: 71, column: 6}}; +const add: TypedNode = {label: 'add', type: NodeType.fun, info: {line: 75, column: 6}}; +// const a: TypedNode = {label: 'a', type: NodeType.var, info: {line: 82, column: 10}}; +const b: TypedNode = {label: 'b', type: NodeType.var, info: {line: 83, column: 10}}; +const c: TypedNode = {label: 'c', type: NodeType.var, info: {line: 89, column: 6}}; +const ComponentD: TypedNode = { label: 'ComponentD', type: NodeType.var, info: {line: 84, column: 10}}; edges.set(number, new Set([])); edges.set(b, new Set([count])); @@ -16,9 +17,10 @@ edges.set(c, new Set([count])); edges.set(count, new Set([])); edges.set(plus, new Set([plus])); edges.set(add, new Set([number, add, count])); +edges.set(ComponentD, new Set([])); // edges.set(a, new Set([count])); export const graph = { - nodes: new Set([number, b, count, c, plus, add]), + nodes: new Set([number, b, count, c, plus, add, ComponentD]), edges, }; diff --git a/test/options-setup/TestComponent.nodes.ts b/test/options-setup/TestComponent.nodes.ts index 213db23..8a8b13c 100644 --- a/test/options-setup/TestComponent.nodes.ts +++ b/test/options-setup/TestComponent.nodes.ts @@ -1 +1 @@ -export const nodes = new Set(['msg', 'plus', 'count', 'number', 'add']); \ No newline at end of file +export const nodes = new Set(['msg', 'plus', 'count', 'number', 'add', 'ComponentD']); \ No newline at end of file diff --git a/test/options-setup/TestComponent.vue b/test/options-setup/TestComponent.vue index 3de08fa..d27d6a3 100644 --- a/test/options-setup/TestComponent.vue +++ b/test/options-setup/TestComponent.vue @@ -50,9 +50,10 @@ Edit components/HelloWorld.vue to test hot module replacement.

+ - diff --git a/tsconfig.json b/tsconfig.json index 801008a..34eb81a 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -15,6 +15,7 @@ "resolveJsonModule": true, "skipLibCheck": true, "skipDefaultLibCheck": true, + "jsx": "preserve", "baseUrl": "./", "paths": { "@/*": [