diff --git a/src/EditorFactory.js b/src/EditorFactory.js index dbd1ec5ce09..1a0c025cfd1 100644 --- a/src/EditorFactory.js +++ b/src/EditorFactory.js @@ -26,7 +26,7 @@ import 'proxy-polyfill' import { Editor } from '@tiptap/core' import { lowlight } from 'lowlight/lib/core.js' -import hljs from 'highlight.js' +import hljs from 'highlight.js/lib/core' import { logger } from './helpers/logger.js' import { Mention, PlainText, RichText } from './extensions/index.js' diff --git a/src/components/Editor.vue b/src/components/Editor.vue index 4528d5db8f2..30a9661f5b6 100644 --- a/src/components/Editor.vue +++ b/src/components/Editor.vue @@ -804,7 +804,7 @@ export default { .text-editor__wrapper { @import './../../css/prosemirror'; - &:not(.is-rich-editor) .ProseMirror { + .ProseMirror { pre { background-color: var(--color-main-background); diff --git a/src/extensions/RichText.js b/src/extensions/RichText.js index d34374170af..499f32abd0d 100644 --- a/src/extensions/RichText.js +++ b/src/extensions/RichText.js @@ -21,6 +21,7 @@ */ import { Extension } from '@tiptap/core' +import { lowlight } from 'lowlight' /* eslint-disable import/no-named-as-default */ import History from '@tiptap/extension-history' @@ -86,7 +87,9 @@ export default Extension.create({ Blockquote, CharacterCount, Code, - CodeBlock, + CodeBlock.configure({ + lowlight, + }), BulletList, HorizontalRule, OrderedList, diff --git a/src/nodes/CodeBlock.js b/src/nodes/CodeBlock.js index 967e54ac68c..46b92cbf645 100644 --- a/src/nodes/CodeBlock.js +++ b/src/nodes/CodeBlock.js @@ -1,7 +1,7 @@ -import TiptapCodeBlock from '@tiptap/extension-code-block' +import TiptapCodeBlockLowlight from '@tiptap/extension-code-block-lowlight' import { defaultMarkdownSerializer } from '@tiptap/pm/markdown' -const CodeBlock = TiptapCodeBlock.extend({ +const CodeBlock = TiptapCodeBlockLowlight.extend({ parseHTML() { return [