genStyle() — vue Function Reference

Architecture documentation for the genStyle() function in style.ts from the vue codebase.

Function typescript ServerRenderer BundleRenderer calls 1 called by 2

Entity Profile

ServerRenderer→ BundleRenderer→ genStyle() — vue Function Reference

Dependency Diagram

graph TD
  d65b6996_21b9_cf8b_c2a3_bb672265ca22["genStyle()"]
  c01b07ad_2199_7af3_fd2a_5838ed01d0ef["style.ts"]
  d65b6996_21b9_cf8b_c2a3_bb672265ca22 -->|defined in| c01b07ad_2199_7af3_fd2a_5838ed01d0ef
  1125abc0_f3cf_1310_e2ba_6b08a2d3a0ac["renderStyle()"]
  1125abc0_f3cf_1310_e2ba_6b08a2d3a0ac -->|calls| d65b6996_21b9_cf8b_c2a3_bb672265ca22
  d12ae3fa_7567_1412_6715_a4bf3fc59ec8["renderSSRStyle()"]
  d12ae3fa_7567_1412_6715_a4bf3fc59ec8 -->|calls| d65b6996_21b9_cf8b_c2a3_bb672265ca22
  020da259_16a9_6e73_47be_c30d86ef2b0a["normalizeValue()"]
  d65b6996_21b9_cf8b_c2a3_bb672265ca22 -->|calls| 020da259_16a9_6e73_47be_c30d86ef2b0a
  style d65b6996_21b9_cf8b_c2a3_bb672265ca22 fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

packages/server-renderer/src/modules/style.ts lines 6–20

export function genStyle(style: Object): string {
  let styleText = ''
  for (const key in style) {
    const value = style[key]
    const hyphenatedKey = hyphenate(key)
    if (Array.isArray(value)) {
      for (let i = 0, len = value.length; i < len; i++) {
        styleText += normalizeValue(hyphenatedKey, value[i])
      }
    } else {
      styleText += normalizeValue(hyphenatedKey, value)
    }
  }
  return styleText
}