{"record":{"id":"4045de3063cae47d","repo":"mantinedev/mantine","slug":"mantine-code-highlight-language-language","errorCode":null,"errorMessage":"[@mantine/code-highlight] Language `${language}` ${reason}, code is rendered as plain text.","messagePattern":"\\[@mantine/code-highlight\\] Language `(.+?)` (.+?), code is rendered as plain text\\.","errorType":"console","errorClass":null,"httpStatus":null,"severity":"warning","filePath":"packages/@mantine/code-highlight/src/CodeHighlightProvider/adapters/shiki-adapter.ts","lineNumber":61,"sourceCode":"  }\n\n  return ctx.getLoadedLanguages().includes(language);\n}\n\nexport const createShikiAdapter = (\n  loadShiki: () => Promise<any>,\n  { forceColorScheme, resolveLanguage }: CreateShikiAdapterOptions = {}\n): CodeHighlightAdapter => {\n  const warnedLanguages = new Set<string>();\n\n  const warnUnavailableLanguage = (language: string, reason: string) => {\n    if (getEnv() === 'production' || warnedLanguages.has(language)) {\n      return;\n    }\n\n    warnedLanguages.add(language);\n    // eslint-disable-next-line no-console\n    console.warn(\n      `[@mantine/code-highlight] Language \\`${language}\\` ${reason}, code is rendered as plain text.`\n    );\n  };\n\n  return {\n    loadContext: loadShiki,\n\n    loadLanguage: resolveLanguage\n      ? (ctx, language) => {\n          if (isLanguageAvailable(ctx, language)) {\n            return undefined;\n          }\n\n          const onLoadError = (error: any) => {\n            warnUnavailableLanguage(language, 'could not be loaded by the highlighter');\n            throw error;\n          };\n","sourceCodeStart":43,"sourceCodeEnd":79,"githubUrl":"https://github.com/mantinedev/mantine/blob/8a284e2c2c53a9cb6f39f5dc389bf41b7a2073f8/packages/@mantine/code-highlight/src/CodeHighlightProvider/adapters/shiki-adapter.ts#L43-L79","documentation":"A console.warn emitted by @mantine/code-highlight's shiki adapter when a requested language cannot be loaded, so the code is rendered as plain (unhighlighted) text. The hook/adapter degrades gracefully; rendering still works. The warning fires once per language per session (tracked in warnedLanguages) and is suppressed in production builds via getEnv().","triggerScenarios":"Passing a `language` prop to CodeHighlight that shiki does not have registered or cannot fetch — e.g. a typo ('javscript'), an unsupported/custom language, or a dynamic import of the shiki language bundle failing (network error, offline). Surfaced from onLoadError and during adapter creation.","commonSituations":"Typos in the language prop; using a niche language not included in the bundled shiki grammar set; CDN/offline environments where the language grammar fetch fails; upgrading @mantine/code-highlight where the shiki version and its language list changed; forgetting to register a custom language with the shiki instance.","solutions":["Fix the language prop value — check the exact string against shiki's supported languages (e.g. 'typescript', 'bash', not 'ts-script')","If using a custom/less-common language, register its grammar with your shiki instance before rendering","If the grammar fetch failed (offline/CDN block), ensure network access to the shiki language resources or bundle them locally","Verify your @mantine/code-highlight version's shiki dependency supports the language after upgrades"],"exampleFix":"// before\n<CodeHighlight language=\"javscript\" code={code} />\n\n// after\n<CodeHighlight language=\"javascript\" code={code} />","handlingStrategy":"validation","validationCode":"import { shikiBundledLanguages } from 'shiki';\n\nconst isSupportedLanguage = (lang: string): boolean =>\n  lang in shikiBundledLanguages;\n\n// before render\nconst safeLang = isSupportedLanguage(language) ? language : 'txt';","typeGuard":"const isSupportedLanguage = (lang: string, bundled: Record<string, unknown>): lang is string =>\n  Object.prototype.hasOwnProperty.call(bundled, lang);","tryCatchPattern":"// The adapter catches load errors internally; guard at the call site instead:\n<CodeHighlight\n  language={isSupportedLanguage(language) ? language : 'plaintext'}\n  code={code}\n/>","preventionTips":["Restrict the language prop to a union type of supported languages instead of string","Centralize language constants and reuse them instead of inline strings","Pin shiki-compatible versions when upgrading @mantine/code-highlight","Test render all supported languages in CI to catch typos/regressions"],"tags":["code-highlight","shiki","syntax-highlighting","language","warning"],"backgroundTag":"syntax-highlighter-language-unavailable","analyzedSha":"8a284e2c2c53a9cb6f39f5dc389bf41b7a2073f8","analyzedAt":"2026-08-28T10:25:51.087Z","schemaVersion":2},"datasetVersion":"2026-08-28T11:17:15.048Z"}