vue Architecture Docs
Home / Function/ genElement() — vue Function Reference

genElement() — vue Function Reference

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

Function typescript VueCore Observer calls 9 called by 6

Entity Profile

Dependency Diagram

graph TD
  009d7fc7_09cb_184e_e93c_1f468ff505c0["genElement()"]
  6a18399e_553e_fef8_6a39_746f79f94bd2["index.ts"]
  009d7fc7_09cb_184e_e93c_1f468ff505c0 -->|defined in| 6a18399e_553e_fef8_6a39_746f79f94bd2
  e748fb47_6716_51f2_1c20_197a7392a425["generate()"]
  e748fb47_6716_51f2_1c20_197a7392a425 -->|calls| 009d7fc7_09cb_184e_e93c_1f468ff505c0
  efed1b05_29b1_203b_9210_7f683c302bb9["genStatic()"]
  efed1b05_29b1_203b_9210_7f683c302bb9 -->|calls| 009d7fc7_09cb_184e_e93c_1f468ff505c0
  f9b375f7_0463_ff1f_5be6_7e356b4bded3["genOnce()"]
  f9b375f7_0463_ff1f_5be6_7e356b4bded3 -->|calls| 009d7fc7_09cb_184e_e93c_1f468ff505c0
  86c7d981_30e6_c29a_19f3_e7b26950b745["genIfConditions()"]
  86c7d981_30e6_c29a_19f3_e7b26950b745 -->|calls| 009d7fc7_09cb_184e_e93c_1f468ff505c0
  db876b7b_004a_9015_7afa_993985df7520["genScopedSlot()"]
  db876b7b_004a_9015_7afa_993985df7520 -->|calls| 009d7fc7_09cb_184e_e93c_1f468ff505c0
  574cf366_be5c_8e5d_b72b_8e5c7974e7ea["genNode()"]
  574cf366_be5c_8e5d_b72b_8e5c7974e7ea -->|calls| 009d7fc7_09cb_184e_e93c_1f468ff505c0
  efed1b05_29b1_203b_9210_7f683c302bb9["genStatic()"]
  009d7fc7_09cb_184e_e93c_1f468ff505c0 -->|calls| efed1b05_29b1_203b_9210_7f683c302bb9
  f9b375f7_0463_ff1f_5be6_7e356b4bded3["genOnce()"]
  009d7fc7_09cb_184e_e93c_1f468ff505c0 -->|calls| f9b375f7_0463_ff1f_5be6_7e356b4bded3
  f1257d59_66c7_6288_39e7_c860744c0fdf["genFor()"]
  009d7fc7_09cb_184e_e93c_1f468ff505c0 -->|calls| f1257d59_66c7_6288_39e7_c860744c0fdf
  539756f9_3a11_1e1c_313e_d779ff83093a["genIf()"]
  009d7fc7_09cb_184e_e93c_1f468ff505c0 -->|calls| 539756f9_3a11_1e1c_313e_d779ff83093a
  c685f493_8cd2_1c26_d251_343fbd2a9498["genChildren()"]
  009d7fc7_09cb_184e_e93c_1f468ff505c0 -->|calls| c685f493_8cd2_1c26_d251_343fbd2a9498
  efff3f4c_82aa_c3e2_8ac7_3524fe9edc87["genSlot()"]
  009d7fc7_09cb_184e_e93c_1f468ff505c0 -->|calls| efff3f4c_82aa_c3e2_8ac7_3524fe9edc87
  c853697a_a300_4af8_8ebe_b8ab14fdba76["genComponent()"]
  009d7fc7_09cb_184e_e93c_1f468ff505c0 -->|calls| c853697a_a300_4af8_8ebe_b8ab14fdba76
  2f9548d4_5dab_e18c_c75b_5e2c2bf4a780["genData()"]
  009d7fc7_09cb_184e_e93c_1f468ff505c0 -->|calls| 2f9548d4_5dab_e18c_c75b_5e2c2bf4a780
  d6dee955_2f0a_a362_98f7_02380d114a94["checkBindingType()"]
  009d7fc7_09cb_184e_e93c_1f468ff505c0 -->|calls| d6dee955_2f0a_a362_98f7_02380d114a94
  style 009d7fc7_09cb_184e_e93c_1f468ff505c0 fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

src/compiler/codegen/index.ts lines 74–124

export function genElement(el: ASTElement, state: CodegenState): string {
  if (el.parent) {
    el.pre = el.pre || el.parent.pre
  }

  if (el.staticRoot && !el.staticProcessed) {
    return genStatic(el, state)
  } else if (el.once && !el.onceProcessed) {
    return genOnce(el, state)
  } else if (el.for && !el.forProcessed) {
    return genFor(el, state)
  } else if (el.if && !el.ifProcessed) {
    return genIf(el, state)
  } else if (el.tag === 'template' && !el.slotTarget && !state.pre) {
    return genChildren(el, state) || 'void 0'
  } else if (el.tag === 'slot') {
    return genSlot(el, state)
  } else {
    // component or element
    let code
    if (el.component) {
      code = genComponent(el.component, el, state)
    } else {
      let data
      const maybeComponent = state.maybeComponent(el)
      if (!el.plain || (el.pre && maybeComponent)) {
        data = genData(el, state)
      }

      let tag: string | undefined
      // check if this is a component in <script setup>
      const bindings = state.options.bindings
      if (maybeComponent && bindings && bindings.__isScriptSetup !== false) {
        tag = checkBindingType(bindings, el.tag)
      }
      if (!tag) tag = `'${el.tag}'`

      const children = el.inlineTemplate ? null : genChildren(el, state, true)
      code = `_c(${tag}${
        data ? `,${data}` : '' // data
      }${
        children ? `,${children}` : '' // children
      })`
    }
    // module transforms
    for (let i = 0; i < state.transforms.length; i++) {
      code = state.transforms[i](el, code)
    }
    return code
  }
}

Domain

Subdomains

Defined In

Calls

Called By

Source

Frequently Asked Questions

What does genElement() do?
genElement() is a function in the vue codebase, defined in src/compiler/codegen/index.ts.
Where is genElement() defined?
genElement() is defined in src/compiler/codegen/index.ts at line 74.
What does genElement() call?
genElement() calls 9 function(s): checkBindingType, genChildren, genComponent, genData, genFor, genIf, genOnce, genSlot, and 1 more.
What calls genElement()?
genElement() is called by 6 function(s): genIfConditions, genNode, genOnce, genScopedSlot, genStatic, generate.

Analyze Your Own Codebase

Get architecture documentation, dependency graphs, and domain analysis for your codebase in minutes.

Try Supermodel Free