{"record":{"id":"1624c3583a0bdb39","repo":"vuejs/core","slug":"vue-compiler-sfc-template-preprocessing-in-the","errorCode":null,"errorMessage":"[@vue/compiler-sfc] Template preprocessing in the browser build must provide the `preprocessCustomRequire` option to return the in-browser version of the preprocessor in the shape of { render(): string }.","messagePattern":"\\[@vue/compiler-sfc\\] Template preprocessing in the browser build must provide the `preprocessCustomRequire` option to return the in-browser version of the preprocessor in the shape of (.+?)\\.","errorType":"exception","errorClass":"Error","httpStatus":null,"severity":"error","filePath":"packages/compiler-sfc/src/compileTemplate.ts","lineNumber":115,"sourceCode":"      res = _res\n    },\n  )\n\n  if (err) throw err\n  return res\n}\n\nexport function compileTemplate(\n  options: SFCTemplateCompileOptions,\n): SFCTemplateCompileResults {\n  const { preprocessLang, preprocessCustomRequire } = options\n\n  if (\n    (__ESM_BROWSER__ || __GLOBAL__) &&\n    preprocessLang &&\n    !preprocessCustomRequire\n  ) {\n    throw new Error(\n      `[@vue/compiler-sfc] Template preprocessing in the browser build must ` +\n        `provide the \\`preprocessCustomRequire\\` option to return the in-browser ` +\n        `version of the preprocessor in the shape of { render(): string }.`,\n    )\n  }\n\n  const preprocessor = preprocessLang\n    ? preprocessCustomRequire\n      ? preprocessCustomRequire(preprocessLang)\n      : __ESM_BROWSER__\n        ? undefined\n        : consolidate[preprocessLang as keyof typeof consolidate]\n    : false\n  if (preprocessor) {\n    try {\n      return doCompileTemplate({\n        ...options,\n        source: preprocess(options, preprocessor),","sourceCodeStart":97,"sourceCodeEnd":133,"githubUrl":"https://github.com/vuejs/core/blob/a2b40db9a83b36ed9da3a16403cf8f040262d73f/packages/compiler-sfc/src/compileTemplate.ts#L97-L133","documentation":"Thrown by compileTemplate in @vue/compiler-sfc when template preprocessing is requested in a browser build (__ESM_BROWSER__ or __GLOBAL__), a preprocessLang is set, but no preprocessCustomRequire is given. The browser build cannot Node-require consolidate preprocessors, so the caller must return an object shaped { render(): string }. The guard at compileTemplate.ts:115 fires before resolving the preprocessor.","triggerScenarios":"Calling compileTemplate({ preprocessLang: 'pug', source }) from the browser/global build of @vue/compiler-sfc without preprocessCustomRequire; an in-browser SFC compiler playground that allows pug/handlebars/etc. templates.","commonSituations":"Shipping a runtime template compiler to the browser; bundlers accidentally resolving the browser entry of compiler-sfc for a Node build pipeline that expected consolidate.","solutions":["Supply preprocessCustomRequire(preprocessLang) returning { render(): string } for each supported language (e.g. bundle pug for the browser).","Pre-compile templates at build time so the browser never needs to preprocess.","Resolve @vue/compiler-sfc to its Node build in your bundler config so consolidate can be required."],"exampleFix":"// before (browser build)\ncompileTemplate({ filename: 'x.vue', source: 'div#x hello', preprocessLang: 'pug' })\n\n// after\ncompileTemplate({\n  filename: 'x.vue',\n  source: 'div#x hello',\n  preprocessLang: 'pug',\n  preprocessCustomRequire: lang => (lang === 'pug' ? bundledPug : undefined),\n})","handlingStrategy":"validation","validationCode":"// Require preprocessCustomRequire for browser template preprocessing.\nfunction safeCompileTemplateBrowser(opts) {\n  if (opts.preprocessLang && !opts.preprocessCustomRequire && isBrowserBuild) {\n    throw new Error('preprocessCustomRequire required for browser template preprocessing')\n  }\n  return compileTemplate(opts)\n}","typeGuard":"function templatePreprocessReadyBrowser(opts: unknown): boolean {\n  if (!opts) return true\n  const o = opts as any\n  if (!o.preprocessLang) return true\n  return typeof o.preprocessCustomRequire === 'function'\n}","tryCatchPattern":null,"preventionTips":["Pre-compile templates (SFC <template>) at build time so the browser never preprocesses.","If you support pug/handlebars in the browser, bundle each and return it from preprocessCustomRequire.","Resolve @vue/compiler-sfc to the Node build for any pipeline that can require() consolidate."],"tags":["vue","compiler-sfc","template-preprocessor","browser-build","configuration"],"backgroundTag":null,"analyzedSha":"a2b40db9a83b36ed9da3a16403cf8f040262d73f","analyzedAt":"2026-08-12T14:21:14.989Z","schemaVersion":2},"datasetVersion":"2026-08-12T18:17:37.767Z"}