renderStyles() — vue Function Reference

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

Function typescript ServerRenderer TemplateRenderer calls 3 called by 2

Entity Profile

ServerRenderer→ TemplateRenderer→ renderStyles() — vue Function Reference

Dependency Diagram

graph TD
  f44f112c_5db8_7334_0114_a66283aafe69["renderStyles()"]
  a6b6f41b_6598_1b32_00b3_8bbaa08b8c64["TemplateRenderer"]
  f44f112c_5db8_7334_0114_a66283aafe69 -->|defined in| a6b6f41b_6598_1b32_00b3_8bbaa08b8c64
  c2756fe6_1f1e_29d1_4e0a_75be9f92ec3b["render()"]
  c2756fe6_1f1e_29d1_4e0a_75be9f92ec3b -->|calls| f44f112c_5db8_7334_0114_a66283aafe69
  d73c9526_09c0_71b5_ab46_cdd9dcf35673["start()"]
  d73c9526_09c0_71b5_ab46_cdd9dcf35673 -->|calls| f44f112c_5db8_7334_0114_a66283aafe69
  3884fbd0_8831_d753_c6b2_9634b8a270c5["getUsedAsyncFiles()"]
  f44f112c_5db8_7334_0114_a66283aafe69 -->|calls| 3884fbd0_8831_d753_c6b2_9634b8a270c5
  f1b8f870_93e5_29d3_5d61_fa5dfef06439["isCSS()"]
  f44f112c_5db8_7334_0114_a66283aafe69 -->|calls| f1b8f870_93e5_29d3_5d61_fa5dfef06439
  246138f2_f975_9a04_da8b_919aeca2ac4b["files()"]
  f44f112c_5db8_7334_0114_a66283aafe69 -->|calls| 246138f2_f975_9a04_da8b_919aeca2ac4b
  style f44f112c_5db8_7334_0114_a66283aafe69 fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

packages/server-renderer/src/template-renderer/index.ts lines 143–161

  renderStyles(context: Record<string, any>): string {
    const initial = this.preloadFiles || []
    const async = this.getUsedAsyncFiles(context) || []
    const cssFiles = initial.concat(async).filter(({ file }) => isCSS(file))
    return (
      // render links for css files
      (cssFiles.length
        ? cssFiles
            .map(
              ({ file }) =>
                `<link rel="stylesheet" href="${this.publicPath}${file}">`
            )
            .join('')
        : '') +
      // context.styles is a getter exposed by vue-style-loader which contains
      // the inline component styles collected during SSR
      (context.styles || '')
    )
  }