Custom PrismJS Grammar Not Working in Docusaurus 3

78 views Asked by At

I am not a react dev so maybe I'm missing something. Any help is much appreciated. I have a Docusaurus 2.2 site in which I've implemented a Prism grammar for a DSL we use. In Docusaurus 2.2, everything works as expected. I am attempting to update Docusaurus to v3 but now the DSL syntax highlighting is not working. If I inspect my code blocks, none of the css classes that should be assigned to lines are there. Everything is token-line or token plain.

I followed the Docusaurus guide here and added the require statement to the new prism-include-languages.js file. My grammar hasn't changed from what was working previously.

import siteConfig from '@generated/docusaurus.config';

export default function prismIncludeLanguages(PrismObject) {
  const {
    themeConfig: {prism},
  } = siteConfig;
  const {additionalLanguages} = prism;
  // Prism components work on the Prism instance on the window, while prism-
  // react-renderer uses its own Prism instance. We temporarily mount the
  // instance onto window, import components to enhance it, then remove it to
  // avoid polluting global namespace.
  // You can mutate PrismObject: registering plugins, deleting languages... As
  // long as you don't re-assign it
  globalThis.Prism = PrismObject;
  additionalLanguages.forEach((lang) => {
    if (lang === 'php') {
      // eslint-disable-next-line global-require
      require('prismjs/components/prism-markup-templating.js');
    }
    // eslint-disable-next-line global-require, import/no-dynamic-require
    require(`prismjs/components/prism-${lang}`);
  });

  require('@site/src/components/prism-myLang');

  delete globalThis.Prism;
};

My DSL grammar file looks like this

import {Prism} from 'prism-react-renderer';
console.log('register myLang grammar');

Prism.languages.myLang = {
    //grammar rules/patterns
};

console.log("finished loading grammar");

From Chrome DevTools, I can see both of my log statements get printed and if I check the Prism object, it does contain my grammar.

0

There are 0 answers