vue Architecture Docs
Home / File/ runtime-with-compiler.ts — vue Source File

runtime-with-compiler.ts — vue Source File

Architecture documentation for runtime-with-compiler.ts, a typescript file in the vue codebase. 10 imports, 2 dependents.

File typescript WebPlatform WebCompiler 10 imports 2 dependents 3 functions

Entity Profile

Dependency Diagram

graph LR
  65cd287e_4e6a_7361_27b7_9f8be7ceff8e["runtime-with-compiler.ts"]
  1f23f9a8_908f_4fb5_cd0e_f6931084f349["index.ts"]
  65cd287e_4e6a_7361_27b7_9f8be7ceff8e --> 1f23f9a8_908f_4fb5_cd0e_f6931084f349
  fca02fea_d74a_16b5_3202_1a85f2351c93["index.ts"]
  65cd287e_4e6a_7361_27b7_9f8be7ceff8e --> fca02fea_d74a_16b5_3202_1a85f2351c93
  9abdd56a_b3e9_b714_a871_bb62d484ef69["query"]
  65cd287e_4e6a_7361_27b7_9f8be7ceff8e --> 9abdd56a_b3e9_b714_a871_bb62d484ef69
  95855a54_c069_03c0_f190_110611bbea7e["index.ts"]
  65cd287e_4e6a_7361_27b7_9f8be7ceff8e --> 95855a54_c069_03c0_f190_110611bbea7e
  41a7b76c_d45b_2c9a_3ce7_24aa4da8ba47["compat.ts"]
  65cd287e_4e6a_7361_27b7_9f8be7ceff8e --> 41a7b76c_d45b_2c9a_3ce7_24aa4da8ba47
  7937fbf2_2517_3f42_44b3_0dbdf16af5de["config"]
  65cd287e_4e6a_7361_27b7_9f8be7ceff8e --> 7937fbf2_2517_3f42_44b3_0dbdf16af5de
  02e43f4a_da65_7acd_5a98_0f017554a159["index"]
  65cd287e_4e6a_7361_27b7_9f8be7ceff8e --> 02e43f4a_da65_7acd_5a98_0f017554a159
  17c5f2b1_ab60_baee_8c7b_724c745b9df0["perf"]
  65cd287e_4e6a_7361_27b7_9f8be7ceff8e --> 17c5f2b1_ab60_baee_8c7b_724c745b9df0
  907f4994_ea28_43b1_7976_0db9f0e97637["component"]
  65cd287e_4e6a_7361_27b7_9f8be7ceff8e --> 907f4994_ea28_43b1_7976_0db9f0e97637
  51931e9b_f9dc_de8e_3f55_263f1372f144["global-api"]
  65cd287e_4e6a_7361_27b7_9f8be7ceff8e --> 51931e9b_f9dc_de8e_3f55_263f1372f144
  c1eaeca5_8650_22c0_a407_8ee0c9af6632["entry-runtime-with-compiler-esm.ts"]
  c1eaeca5_8650_22c0_a407_8ee0c9af6632 --> 65cd287e_4e6a_7361_27b7_9f8be7ceff8e
  58582da8_a6a4_5c38_7806_4f6a7543c3d2["entry-runtime-with-compiler.ts"]
  58582da8_a6a4_5c38_7806_4f6a7543c3d2 --> 65cd287e_4e6a_7361_27b7_9f8be7ceff8e
  style 65cd287e_4e6a_7361_27b7_9f8be7ceff8e fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

import config from 'core/config'
import { warn, cached } from 'core/util/index'
import { mark, measure } from 'core/util/perf'

import Vue from './runtime/index'
import { query } from './util/index'
import { compileToFunctions } from './compiler/index'
import {
  shouldDecodeNewlines,
  shouldDecodeNewlinesForHref
} from './util/compat'
import type { Component } from 'types/component'
import type { GlobalAPI } from 'types/global-api'

const idToTemplate = cached(id => {
  const el = query(id)
  return el && el.innerHTML
})

const mount = Vue.prototype.$mount
Vue.prototype.$mount = function (
  el?: string | Element,
  hydrating?: boolean
): Component {
  el = el && query(el)

  /* istanbul ignore if */
  if (el === document.body || el === document.documentElement) {
    __DEV__ &&
      warn(
        `Do not mount Vue to <html> or <body> - mount to normal elements instead.`
      )
    return this
  }

  const options = this.$options
  // resolve template/el and convert to render function
  if (!options.render) {
    let template = options.template
    if (template) {
      if (typeof template === 'string') {
        if (template.charAt(0) === '#') {
          template = idToTemplate(template)
          /* istanbul ignore if */
          if (__DEV__ && !template) {
            warn(
              `Template element not found or is empty: ${options.template}`,
              this
            )
          }
        }
      } else if (template.nodeType) {
        template = template.innerHTML
      } else {
        if (__DEV__) {
          warn('invalid template option:' + template, this)
        }
        return this
      }
    } else if (el) {
      // @ts-expect-error
      template = getOuterHTML(el)
    }
    if (template) {
      /* istanbul ignore if */
      if (__DEV__ && config.performance && mark) {
        mark('compile')
      }

      const { render, staticRenderFns } = compileToFunctions(
        template,
        {
          outputSourceRange: __DEV__,
          shouldDecodeNewlines,
          shouldDecodeNewlinesForHref,
          delimiters: options.delimiters,
          comments: options.comments
        },
        this
      )
      options.render = render
      options.staticRenderFns = staticRenderFns

      /* istanbul ignore if */
      if (__DEV__ && config.performance && mark) {
        mark('compile end')
        measure(`vue ${this._name} compile`, 'compile', 'compile end')
      }
    }
  }
  return mount.call(this, el, hydrating)
}

/**
 * Get outerHTML of elements, taking care
 * of SVG elements in IE as well.
 */
function getOuterHTML(el: Element): string {
  if (el.outerHTML) {
    return el.outerHTML
  } else {
    const container = document.createElement('div')
    container.appendChild(el.cloneNode(true))
    return container.innerHTML
  }
}

Vue.compile = compileToFunctions

export default Vue as GlobalAPI

Domain

Subdomains

Functions

Dependencies

Imported By

Source

Frequently Asked Questions

What does runtime-with-compiler.ts do?
runtime-with-compiler.ts is a source file in the vue codebase, written in typescript. It belongs to the WebPlatform domain, WebCompiler subdomain.
What functions are defined in runtime-with-compiler.ts?
runtime-with-compiler.ts defines 3 function(s): $mount, getOuterHTML, idToTemplate.
What does runtime-with-compiler.ts depend on?
runtime-with-compiler.ts imports 10 module(s): compat.ts, component, config, global-api, index, index.ts, index.ts, index.ts, and 2 more.
What files import runtime-with-compiler.ts?
runtime-with-compiler.ts is imported by 2 file(s): entry-runtime-with-compiler-esm.ts, entry-runtime-with-compiler.ts.
Where is runtime-with-compiler.ts in the architecture?
runtime-with-compiler.ts is located at src/platforms/web/runtime-with-compiler.ts (domain: WebPlatform, subdomain: WebCompiler, directory: src/platforms/web).

Analyze Your Own Codebase

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

Try Supermodel Free