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

transformNode() — vue Function Reference

Architecture documentation for the transformNode() function in class.ts from the vue codebase.

Function typescript WebPlatform WebCompiler calls 3

Entity Profile

Dependency Diagram

graph TD
  b99b1c17_88bd_b28b_f216_7b2ce17de916["transformNode()"]
  b54f5bfb_1a4e_430d_f7d5_41f81c9a1ab3["getAndRemoveAttr()"]
  b99b1c17_88bd_b28b_f216_7b2ce17de916 -->|calls| b54f5bfb_1a4e_430d_f7d5_41f81c9a1ab3
  98ee1e5f_4546_f8dd_b03c_1579380b057f["parseText()"]
  b99b1c17_88bd_b28b_f216_7b2ce17de916 -->|calls| 98ee1e5f_4546_f8dd_b03c_1579380b057f
  2e03f8d2_4a5a_f1cd_1d7b_db95ba63549e["getBindingAttr()"]
  b99b1c17_88bd_b28b_f216_7b2ce17de916 -->|calls| 2e03f8d2_4a5a_f1cd_1d7b_db95ba63549e
  style b99b1c17_88bd_b28b_f216_7b2ce17de916 fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

src/platforms/web/compiler/modules/class.ts lines 5–27

function transformNode(el: ASTElement, options: CompilerOptions) {
  const warn = options.warn || baseWarn
  const staticClass = getAndRemoveAttr(el, 'class')
  if (__DEV__ && staticClass) {
    const res = parseText(staticClass, options.delimiters)
    if (res) {
      warn(
        `class="${staticClass}": ` +
          'Interpolation inside attributes has been removed. ' +
          'Use v-bind or the colon shorthand instead. For example, ' +
          'instead of <div class="{{ val }}">, use <div :class="val">.',
        el.rawAttrsMap['class']
      )
    }
  }
  if (staticClass) {
    el.staticClass = JSON.stringify(staticClass.replace(/\s+/g, ' ').trim())
  }
  const classBinding = getBindingAttr(el, 'class', false /* getStatic */)
  if (classBinding) {
    el.classBinding = classBinding
  }
}

Domain

Subdomains

Calls

Source

Frequently Asked Questions

What does transformNode() do?
transformNode() is a function in the vue codebase.
What does transformNode() call?
transformNode() calls 3 function(s): getAndRemoveAttr, getBindingAttr, parseText.

Analyze Your Own Codebase

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

Try Supermodel Free