Home / File/ create-component.ts — vue Source File

create-component.ts — vue Source File

Architecture documentation for create-component.ts, a typescript file in the vue codebase. 17 imports, 4 dependents.

File typescript VueCore Instance 17 imports 4 dependents 10 functions

Entity Profile

Dependency Diagram

graph LR
  82e2e746_8f28_fbf0_8cf7_69eca6423e4a["create-component.ts"]
  5164a61d_92b2_9c7f_8acb_b18093afdb59["vnode.ts"]
  82e2e746_8f28_fbf0_8cf7_69eca6423e4a --> 5164a61d_92b2_9c7f_8acb_b18093afdb59
  5ad3a184_20dd_3738_991b_41d3120e21c9["VNode"]
  82e2e746_8f28_fbf0_8cf7_69eca6423e4a --> 5ad3a184_20dd_3738_991b_41d3120e21c9
  414b37af_5f63_dee7_31a2_9a7cad5979ec["create-functional-component.ts"]
  82e2e746_8f28_fbf0_8cf7_69eca6423e4a --> 414b37af_5f63_dee7_31a2_9a7cad5979ec
  8e06d47c_8725_0580_db2e_8b6ce77e9953["createFunctionalComponent"]
  82e2e746_8f28_fbf0_8cf7_69eca6423e4a --> 8e06d47c_8725_0580_db2e_8b6ce77e9953
  76672dd6_4e87_4468_a48b_f4da793fd211["index.ts"]
  82e2e746_8f28_fbf0_8cf7_69eca6423e4a --> 76672dd6_4e87_4468_a48b_f4da793fd211
  cdac6c52_7988_97a3_c580_ce7bb214aaef["index.ts"]
  82e2e746_8f28_fbf0_8cf7_69eca6423e4a --> cdac6c52_7988_97a3_c580_ce7bb214aaef
  d937f76e_061f_a631_9587_336503c9a15c["lifecycle.ts"]
  82e2e746_8f28_fbf0_8cf7_69eca6423e4a --> d937f76e_061f_a631_9587_336503c9a15c
  77ac8989_609a_4755_79eb_0403c1cc7788["callHook"]
  82e2e746_8f28_fbf0_8cf7_69eca6423e4a --> 77ac8989_609a_4755_79eb_0403c1cc7788
  055f956d_f3e0_f8ad_f06a_a9b3085eb888["updateChildComponent"]
  82e2e746_8f28_fbf0_8cf7_69eca6423e4a --> 055f956d_f3e0_f8ad_f06a_a9b3085eb888
  428cbd6d_51c5_fed9_65af_f319e424b217["activateChildComponent"]
  82e2e746_8f28_fbf0_8cf7_69eca6423e4a --> 428cbd6d_51c5_fed9_65af_f319e424b217
  8d2d9489_7b69_4b25_92ee_497afbc2fc3b["deactivateChildComponent"]
  82e2e746_8f28_fbf0_8cf7_69eca6423e4a --> 8d2d9489_7b69_4b25_92ee_497afbc2fc3b
  6d8f8976_7066_720b_0d45_45fe42921eaf["util"]
  82e2e746_8f28_fbf0_8cf7_69eca6423e4a --> 6d8f8976_7066_720b_0d45_45fe42921eaf
  be7d62b3_e3a0_60d5_fdeb_a2f58e314fd1["init"]
  82e2e746_8f28_fbf0_8cf7_69eca6423e4a --> be7d62b3_e3a0_60d5_fdeb_a2f58e314fd1
  af685b49_362f_04d6_83f7_0b2ffece0105["scheduler"]
  82e2e746_8f28_fbf0_8cf7_69eca6423e4a --> af685b49_362f_04d6_83f7_0b2ffece0105
  style 82e2e746_8f28_fbf0_8cf7_69eca6423e4a fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

import VNode from './vnode'
import { isArray } from 'core/util'
import { resolveConstructorOptions } from 'core/instance/init'
import { queueActivatedComponent } from 'core/observer/scheduler'
import { createFunctionalComponent } from './create-functional-component'

import { warn, isDef, isUndef, isTrue, isObject } from '../util/index'

import {
  resolveAsyncComponent,
  createAsyncPlaceholder,
  extractPropsFromVNodeData
} from './helpers/index'

import {
  callHook,
  activeInstance,
  updateChildComponent,
  activateChildComponent,
  deactivateChildComponent
} from '../instance/lifecycle'

import type {
  MountedComponentVNode,
  VNodeData,
  VNodeWithData
} from 'types/vnode'
import type { Component } from 'types/component'
import type { ComponentOptions, InternalComponentOptions } from 'types/options'

export function getComponentName(options: ComponentOptions) {
  return options.name || options.__name || options._componentTag
}

// inline hooks to be invoked on component VNodes during patch
const componentVNodeHooks = {
  init(vnode: VNodeWithData, hydrating: boolean): boolean | void {
    if (
      vnode.componentInstance &&
      !vnode.componentInstance._isDestroyed &&
      vnode.data.keepAlive
    ) {
      // kept-alive components, treat as a patch
      const mountedNode: any = vnode // work around flow
      componentVNodeHooks.prepatch(mountedNode, mountedNode)
    } else {
      const child = (vnode.componentInstance = createComponentInstanceForVnode(
        vnode,
        activeInstance
      ))
      child.$mount(hydrating ? vnode.elm : undefined, hydrating)
    }
  },

  prepatch(oldVnode: MountedComponentVNode, vnode: MountedComponentVNode) {
    const options = vnode.componentOptions
    const child = (vnode.componentInstance = oldVnode.componentInstance)
    updateChildComponent(
      child,
      options.propsData, // updated props
// ... (216 more lines)

Domain

Subdomains

Frequently Asked Questions

What does create-component.ts do?
create-component.ts is a source file in the vue codebase, written in typescript. It belongs to the VueCore domain, Instance subdomain.
What functions are defined in create-component.ts?
create-component.ts defines 10 function(s): componentVNodeHooks.destroy, componentVNodeHooks.init, componentVNodeHooks.insert, componentVNodeHooks.prepatch, createComponent, createComponentInstanceForVnode, getComponentName, installComponentHooks, mergeHook, transformModel.
What does create-component.ts depend on?
create-component.ts imports 17 module(s): VNode, activateChildComponent, callHook, component, create-functional-component.ts, createFunctionalComponent, deactivateChildComponent, index.ts, and 9 more.
What files import create-component.ts?
create-component.ts is imported by 4 file(s): create-element.ts, debug.ts, extend.ts, keep-alive.ts.
Where is create-component.ts in the architecture?
create-component.ts is located at src/core/vdom/create-component.ts (domain: VueCore, subdomain: Instance, directory: src/core/vdom).

Analyze Your Own Codebase

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

Try Supermodel Free