createTemplate() — vite Function Reference

Architecture documentation for the createTemplate() function in overlay.ts from the vite codebase.

Function typescript HMRClient HotRuntime called by 1

Entity Profile

HMRClient→ HotRuntime→ createTemplate() — vite Function Reference

Dependency Diagram

graph TD
  bca28782_43fc_ee07_4592_1eafaafdeb18["createTemplate()"]
  e11865a0_84fe_cc5a_9b23_3f69f2300ca4["overlay.ts"]
  bca28782_43fc_ee07_4592_1eafaafdeb18 -->|defined in| e11865a0_84fe_cc5a_9b23_3f69f2300ca4
  fa7ed98c_b01d_f7ac_6336_e938d321dd76["constructor()"]
  fa7ed98c_b01d_f7ac_6336_e938d321dd76 -->|calls| bca28782_43fc_ee07_4592_1eafaafdeb18
  style bca28782_43fc_ee07_4592_1eafaafdeb18 fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

packages/vite/src/client/overlay.ts lines 175–208

const createTemplate = () =>
  h(
    'div',
    { class: 'backdrop', part: 'backdrop' },
    h(
      'div',
      { class: 'window', part: 'window' },
      h(
        'pre',
        { class: 'message', part: 'message' },
        h('span', { class: 'plugin', part: 'plugin' }),
        h('span', { class: 'message-body', part: 'message-body' }),
      ),
      h('pre', { class: 'file', part: 'file' }),
      h('pre', { class: 'frame', part: 'frame' }),
      h('pre', { class: 'stack', part: 'stack' }),
      h(
        'div',
        { class: 'tip', part: 'tip' },
        'Click outside, press ',
        h('kbd', {}, 'Esc'),
        ' key, or fix the code to dismiss.',
        h('br'),
        'You can also disable this overlay by setting ',
        h('code', { part: 'config-option-name' }, 'server.hmr.overlay'),
        ' to ',
        h('code', { part: 'config-option-value' }, 'false'),
        ' in ',
        h('code', { part: 'config-file-name' }, hmrConfigName),
        '.',
      ),
    ),
    h('style', { nonce: cspNonce }, templateStyle),
  )