genComponent() — vue Function Reference

Architecture documentation for the genComponent() function in index.ts from the vue codebase.

Function typescript CompilerSFC ScriptAnalyzer calls 2 called by 1

Entity Profile

CompilerSFC→ ScriptAnalyzer→ genComponent() — vue Function Reference

Dependency Diagram

graph TD
  51a51b9c_5d7a_4e96_c7de_f686070e1977["genComponent()"]
  54260741_ae9d_a025_86de_47c513f5f82d["index.ts"]
  51a51b9c_5d7a_4e96_c7de_f686070e1977 -->|defined in| 54260741_ae9d_a025_86de_47c513f5f82d
  075d1f95_9965_89f4_3c01_f944fee6b553["genElement()"]
  075d1f95_9965_89f4_3c01_f944fee6b553 -->|calls| 51a51b9c_5d7a_4e96_c7de_f686070e1977
  9fb6810f_0f8d_c3be_a848_4600c5dd2c8d["genChildren()"]
  51a51b9c_5d7a_4e96_c7de_f686070e1977 -->|calls| 9fb6810f_0f8d_c3be_a848_4600c5dd2c8d
  02d2d2c1_c21e_ae8c_6eba_1f4c093c8eb4["genData()"]
  51a51b9c_5d7a_4e96_c7de_f686070e1977 -->|calls| 02d2d2c1_c21e_ae8c_6eba_1f4c093c8eb4
  style 51a51b9c_5d7a_4e96_c7de_f686070e1977 fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

src/compiler/codegen/index.ts lines 634–643

function genComponent(
  componentName: string,
  el: ASTElement,
  state: CodegenState
): string {
  const children = el.inlineTemplate ? null : genChildren(el, state, true)
  return `_c(${componentName},${genData(el, state)}${
    children ? `,${children}` : ''
  })`
}