FormidableLabs / prism-react-renderer

🖌️ Renders highlighted Prism output to React (+ theming & vendored Prism)
MIT License
1.85k stars 152 forks source link

Unable to add additional languages #144

Closed SiegeSailor closed 7 months ago

SiegeSailor commented 2 years ago

Overview

I followed the FAQ How do I add more language highlighting support? on README.md to add additional languages other than the languages mentioned here. However, the error popped up:

Uncaught Error: Cannot find module './prism-latex'

Issue

I then went to check if the languages I wanted to add were in prism-react-renderer/prism, but none of them were found:

The version I am using is 1.3.1:

"dependencies": {
    "@docusaurus/core": "2.0.0-beta.15",
    "@docusaurus/preset-classic": "2.0.0-beta.15",
    "@docusaurus/theme-live-codeblock": "^2.0.0-beta.15",
    "@mdx-js/react": "^1.6.21",
    "@types/prettier": "^2.4.2",
    "clsx": "^1.1.1",
    "hast-util-is-element": "^1.1.0",
    "prettier": "^2.5.1",
    "prism-react-renderer": "^1.3.1",
    "react": "^17.0.1",
    "react-dom": "^17.0.1",
    "rehype-katex": "^4.0.0",
    "remark-math": "^3.0.1",
    "remark-mermaid-dataurl": "^1.0.2"
  },
  "devDependencies": {
    "@docusaurus/module-type-aliases": "2.0.0-beta.15",
    "@tsconfig/docusaurus": "^1.0.4",
    "typescript": "^4.5.2"
  },

I use prism-react-renderer in docusaurus. Here is my code in .md:

```latex
f(x)=
\left\{
\begin{matrix}
    x^{2} + 1, x \geq 0 \\
    x^{2} + 2, x < 0
\end{matrix}
\right.


## Expected Behavior

Add syntax highlighting support for **latex**, **tex**, and **context** (They are basically the same though).
Josh-Cena commented 2 years ago

@SiegeSailor Docusaurus offers a special API to declare additional languages. Please see our docs: https://docusaurus.io/docs/markdown-features/code-blocks#supported-languages

SiegeSailor commented 2 years ago

@Josh-Cena Thank you for your response. However, I did use the special API to declare additional languages. The error message Uncaught Error: Cannot find module './prism-latex' comes after I add languages such as latex to docusaurus.config.js.

Josh-Cena commented 2 years ago

Sorry, I can't reproduce it.

themeConfig: {
  prism: {
    additionalLanguages: ['latex'],
  },
}
```latex
\textit{Hello world!}


<img width="850" alt="image" src="https://user-images.githubusercontent.com/55398995/155845694-a094c09c-1753-4cd3-b16f-bd6de6ea0538.png">

Could you look into `node_modules/prismjs/components` and see if `prism-latex` exists?
SiegeSailor commented 2 years ago

@Josh-Cena Thank you for further research.

It looks like that prism-latex does exist in node_modules/prismjs/components:

Screen Shot 2022-02-27 at 03 00 20

But Uncaught Error: Cannot find module './prism-latex' pops up when I use the following config:

Screen Shot 2022-02-27 at 23 42 16 Screen Shot 2022-02-27 at 23 48 01

If I don't set up latex in themeConfig, then the syntax wouldn't be highlighted:

```latex
f(x)=
\left\{
\begin{matrix}
    x^{2} + 1, x \geq 0 \\
    x^{2} + 2, x < 0
\end{matrix}
\right.


<img width="623" alt="Screen Shot 2022-02-27 at 23 44 57" src="https://user-images.githubusercontent.com/39463416/155889523-e672ccc0-4d54-4dff-8185-e1909995e9d4.png">
Josh-Cena commented 2 years ago

Do you have a reproduction demo? Like your GitHub repo.

SiegeSailor commented 2 years ago

@Josh-Cena Here is the repository I am using Docusaurus.

SiegeSailor commented 2 years ago

Hi, @Josh-Cena.

Sorry for bothering you. Is there any update?

carbonrobot commented 7 months ago

Unable to reproduce this, please reopen in the docusaurus repo if needed.