Meituan-Dianping/mpvue · error

Inline-template components must have exactly one child eleme

Error message

Inline-template components must have exactly one child element.

What it means

Dev-only codegen warning from genInlineTemplate: an element with the inline-template attribute must contain exactly one element child, since that child AST becomes the component's template. Having multiple children or a text/interpolation node as the first child makes the inline template invalid and compilation of it unreliable.

Source

Thrown at src/compiler/codegen/index.js:314

        dir.value ? `,value:(${dir.value}),expression:${JSON.stringify(dir.value)}` : ''
      }${
        dir.arg ? `,arg:"${dir.arg}"` : ''
      }${
        dir.modifiers ? `,modifiers:${JSON.stringify(dir.modifiers)}` : ''
      }},`
    }
  }
  if (hasRuntime) {
    return res.slice(0, -1) + ']'
  }
}

function genInlineTemplate (el: ASTElement, state: CodegenState): ?string {
  const ast = el.children[0]
  if (process.env.NODE_ENV !== 'production' && (
    el.children.length > 1 || ast.type !== 1
  )) {
    state.warn('Inline-template components must have exactly one child element.')
  }
  if (ast.type === 1) {
    const inlineRenderFns = generate(ast, state.options)
    return `inlineTemplate:{render:function(){${
      inlineRenderFns.render
    }},staticRenderFns:[${
      inlineRenderFns.staticRenderFns.map(code => `function(){${code}}`).join(',')
    }]}`
  }
}

function genScopedSlots (
  slots: { [key: string]: ASTElement },
  state: CodegenState
): string {
  return `scopedSlots:_u([${
    Object.keys(slots).map(key => {
      return genScopedSlot(key, slots[key], state)

View on GitHub (pinned to 6c5d78ee04)

Solutions

  1. Wrap children in one root element when using inline-template
  2. Prefer removing inline-template and using scoped slots instead
Defensive patterns

Strategy: validation

When it happens

Trigger: Thrown at src/compiler/codegen/index.js:314 when the library encounters an invalid state.

Common situations: See trigger scenarios.


AI-assisted analysis of Meituan-Dianping/mpvue@6c5d78ee04 (2026-09-02). Data as JSON: /api/errors/22ee052da30d5841. Report an issue: GitHub.