{"record":{"id":"d8ef0ff332cdf970","repo":"vuejs/vue","slug":"n-31m-err-trace-39m-n","errorCode":null,"errorMessage":"\\n\u001b[31m${err}${trace}\u001b[39m\\n","messagePattern":"\\\\n\u001b\\[31m(.+?)(.+?)\u001b\\[39m\\\\n","errorType":"exception","errorClass":"Error","httpStatus":null,"severity":"error","filePath":"packages/server-renderer/src/render.ts","lineNumber":30,"sourceCode":"  createComponent,\n  createComponentInstanceForVnode\n} from 'core/vdom/create-component'\nimport VNode from 'core/vdom/vnode'\nimport type { VNodeDirective } from 'types/vnode'\nimport type { Component } from 'types/component'\n\nlet warned = Object.create(null)\nconst warnOnce = msg => {\n  if (!warned[msg]) {\n    warned[msg] = true\n    // eslint-disable-next-line no-console\n    console.warn(`\\n\\u001b[31m${msg}\\u001b[39m\\n`)\n  }\n}\n\nconst onCompilationError = (err, vm) => {\n  const trace = vm ? generateComponentTrace(vm) : ''\n  throw new Error(`\\n\\u001b[31m${err}${trace}\\u001b[39m\\n`)\n}\n\nconst normalizeRender = vm => {\n  const { render, template, _scopeId } = vm.$options\n  if (isUndef(render)) {\n    if (template) {\n      const compiled = ssrCompileToFunctions(\n        template,\n        {\n          scopeId: _scopeId,\n          warn: onCompilationError\n        },\n        vm\n      )\n\n      vm.$options.render = compiled.render\n      vm.$options.staticRenderFns = compiled.staticRenderFns\n    } else {","sourceCodeStart":12,"sourceCodeEnd":48,"githubUrl":"https://github.com/vuejs/vue/blob/9e88707940088cb1f4cd7dd210c9168a50dc347c/packages/server-renderer/src/render.ts#L12-L48","documentation":"This is the onCompilationError callback wired into ssrCompileToFunctions during SSR. When a component's template fails to compile at render time, the compiler's warn hook routes the error here, which wraps it in a new Error with red ANSI color codes (\\u001b[31m / \\u001b[39m) and a component trace generated by generateComponentTrace. It is re-thrown so the SSR render pipeline surfaces it to the caller's callback.","triggerScenarios":"Any in-browser template that fails SSR compilation: invalid template syntax, unsupported directive in SSR, a template referencing compiler options that don't exist in the SSR compiler. Triggered inside normalizeRender when ssrCompileToFunctions emits a warning that is actually fatal.","commonSituations":"A component uses a template string with a syntax error (unclosed tag, invalid expression). A component relies on a client-only template feature the SSR compiler doesn't support. A dynamic template string constructed at runtime contains user input that breaks parsing.","solutions":["Read the wrapped error message (it includes the original compilation error) and fix the template syntax in the named component.","If the template is dynamic, validate/sanitize it before assignment to vm.$options.template.","Pre-compile templates at build time (vue-loader) instead of runtime compilation to catch errors earlier.","Check the component trace to find which nested component's template failed."],"exampleFix":"// before — runtime template with syntax error\n{ template: '<div><p>{{ msg }</div>' }\n\n// after — valid template\n{ template: '<div><p>{{ msg }}</p></div>' }","handlingStrategy":"try-catch","validationCode":"// Pre-validate component templates before SSR using the SSR compiler in isolation.\nimport { compile } from 'vue-template-compiler'\n\nfunction templateCompiles(template: string): boolean {\n  const res = compile(template)\n  return !res.errors || res.errors.length === 0\n}\n\n// during component registration:\nif (vm.$options.template && !templateCompiles(vm.$options.template)) {\n  console.error(`Bad template in ${vm.$options.name}`)\n}","typeGuard":"// No type guard — runtime template strings are not statically checkable.\n// Use build-time precompilation instead.","tryCatchPattern":"renderer.renderToString(app, (err, html) => {\n  if (err && err.message.includes('\\u001b[31m')) {\n    // strip ANSI for logging\n    const clean = err.message.replace(/\\u001b\\[\\d+m/g, '')\n    logger.error('SSR template compile error:', clean)\n  }\n})","preventionTips":["Pre-compile all templates at build time with vue-loader so syntax errors surface in CI.","Avoid runtime template strings (vm.$options.template = ...) in SSR code paths.","If runtime templates are unavoidable, validate them with vue-template-compiler.compile before assignment.","Sanitize any user-provided template fragments."],"tags":["ssr","compilation","template","diagnostics","ansi"],"analyzedSha":"9e88707940088cb1f4cd7dd210c9168a50dc347c","analyzedAt":"2026-08-11T22:22:01.295Z","schemaVersion":2},"datasetVersion":"2026-08-12T04:17:13.124Z"}