Is there a way to enable both syntax highlighting and correct indentation support JSX/React org-mode code blocks?
When opening a .jsx buffer in Doom Emacs the RJSX major mode is used which has correct syntax highlighting and indentation support.
However in org-mode there is no syntax support for jsx code blocks because there is no jsx-mode for Emacs to find.
Manually pointing org-mode to use the rjsx-mode for jsx code blocks enables correct code indentation but there is no syntax highlighting.
(add-to-list 'org-src-lang-modes '("jsx" . rjsx)
What did you expect to happen?
To be able to enable syntax highlighting and code indentation for React/JSX code blocks in org-mode.
I found out that it is possible to get correct indentation and syntax highlighting by using
jsx code blocks.
(add-to-list 'org-src-lang-modes '("jsx" . js-jsx)
However I also use
mixed-pitch-mode which for some reason breaks the indentation.
(add-hook! 'org-mode-hook #'mixed-pitch-mode)
This only happens for the
jsx code blocks that use the
js-jsx-mode. I use
mixed-pitch-mode because I prefer to use a variable font for my normal org-mode text as opposed to having the fixed-pitch font everywhere.
Is this the recommended way in Doom Emacs to get
jsx syntax-highlighting working for React code blocks in org-mode files? I can find very little information on this online and only figured this out by experimenting with the settings. If so would it be possible to prevent the indentation from breaking in combination with