From 615d1b32fc9ed8727654799cc189bf391a769dbf Mon Sep 17 00:00:00 2001 From: shenjunjian <40288193@qq.com> Date: Tue, 24 Oct 2023 18:44:32 -0700 Subject: [PATCH 1/2] fix(rich-text-editor): remove Collaboration function, remove the dependence and avoid the sideEffects --- .../renderless/src/rich-text-edtior/vue.ts | 50 +++++++------------ .../vue/src/rich-text-editor/package.json | 5 +- .../rich-text-editor/src/code-highlight.tsx | 41 --------------- packages/vue/src/rich-text-editor/src/pc.vue | 39 +++++++-------- 4 files changed, 38 insertions(+), 97 deletions(-) delete mode 100644 packages/vue/src/rich-text-editor/src/code-highlight.tsx diff --git a/packages/renderless/src/rich-text-edtior/vue.ts b/packages/renderless/src/rich-text-edtior/vue.ts index 7b60e779aa..f51d7156ba 100644 --- a/packages/renderless/src/rich-text-edtior/vue.ts +++ b/packages/renderless/src/rich-text-edtior/vue.ts @@ -32,10 +32,6 @@ export const renderless = ( { vm, emit, parent }, { Editor, - Collaboration, - CodehighComp, - Y, - WebrtcProvider, StarterKit, Table, TableCell, @@ -57,9 +53,10 @@ export const renderless = ( CodeBlockLowlight, lowlight, VueNodeViewRenderer, - NodeViewContent, - nodeViewProps, - NodeViewWrapper, + // CodehighComp, + // NodeViewContent, + // nodeViewProps, + // NodeViewWrapper, Placeholder, codeHighlight } @@ -140,9 +137,9 @@ export const renderless = ( return { setP: (attributes) => - ({ commands }) => { - return commands.setNode(this.name, attributes) - } + ({ commands }) => { + return commands.setNode(this.name, attributes) + } } } }) @@ -168,9 +165,9 @@ export const renderless = ( return { setSize: (attributes) => - ({ commands }) => { - return commands.setNode(this.name, attributes) - } + ({ commands }) => { + return commands.setNode(this.name, attributes) + } } } }) @@ -179,24 +176,24 @@ export const renderless = ( return { bgColor: { default: null, - renderHTML: attributes => { + renderHTML: (attributes) => { if (!attributes.bgColor) { return {} } return { - style: `background: ${attributes.bgColor}`, + style: `background: ${attributes.bgColor}` } - }, + } } } }, addCommands() { return { setBackColor: - attributes => - ({ commands }) => { - return commands.setMark(this.name, attributes) - } + (attributes) => + ({ commands }) => { + return commands.setMark(this.name, attributes) + } } } }) @@ -281,18 +278,7 @@ export const renderless = ( }, ...props.options } - if (props.Collaboration) { - if (!window._yDoc) { - window._yDoc = new Y.Doc() - } - ydoc = window._yDoc - provider = new WebrtcProvider('tiny-examsple-document', ydoc) - defaultOptions.extensions.push( - Collaboration?.configure({ - document: ydoc - }), - ) - } + let options = props.options ? Object.assign(defaultOptions, props.options) : defaultOptions const editor = new Editor(options) diff --git a/packages/vue/src/rich-text-editor/package.json b/packages/vue/src/rich-text-editor/package.json index 6928e98694..f2b1264382 100644 --- a/packages/vue/src/rich-text-editor/package.json +++ b/packages/vue/src/rich-text-editor/package.json @@ -40,9 +40,6 @@ "@tiptap/vue-2": "^2.1.10", "@tiptap/vue-3": "^2.0.4", "highlight.js": "^11.8.0", - "lowlight": "^2.9.0", - "y-prosemirror": "^1.2.1", - "y-webrtc": "^10.2.5", - "yjs": "^13.6.7" + "lowlight": "^2.9.0" } } diff --git a/packages/vue/src/rich-text-editor/src/code-highlight.tsx b/packages/vue/src/rich-text-editor/src/code-highlight.tsx deleted file mode 100644 index 879abfe6a5..0000000000 --- a/packages/vue/src/rich-text-editor/src/code-highlight.tsx +++ /dev/null @@ -1,41 +0,0 @@ -export default function (NodeViewContent, nodeViewProps, NodeViewWrapper) { - return { - name: 'CodeHighlight', - components: { - NodeViewWrapper, - NodeViewContent, - }, - props: nodeViewProps, - data() { - return { - languages: this.extension.options.lowlight.listLanguages(), - } - }, - computed: { - selectedLanguage: { - get() { - return this.node.attrs.language - }, - set(language) { - this.updateAttributes({ language }) - }, - }, - }, - render() { - return ( - - -
- - ) - }, - } -} \ No newline at end of file diff --git a/packages/vue/src/rich-text-editor/src/pc.vue b/packages/vue/src/rich-text-editor/src/pc.vue index 59d411fa7f..4b220ff93f 100644 --- a/packages/vue/src/rich-text-editor/src/pc.vue +++ b/packages/vue/src/rich-text-editor/src/pc.vue @@ -287,10 +287,10 @@ import { Editor, EditorContent, BubbleMenu, - VueNodeViewRenderer, - NodeViewContent, - nodeViewProps, - NodeViewWrapper + VueNodeViewRenderer + // NodeViewContent, + // nodeViewProps, + // NodeViewWrapper } from '@tiptap/vue' import StarterKit from '@tiptap/starter-kit' // 段落包 @@ -327,21 +327,23 @@ import js from 'highlight.js/lib/languages/javascript' import ts from 'highlight.js/lib/languages/typescript' import html from 'highlight.js/lib/languages/xml' import { lowlight } from 'lowlight' -lowlight.registerLanguage('html', html) -lowlight.registerLanguage('css', css) -lowlight.registerLanguage('js', js) -lowlight.registerLanguage('ts', ts) + +function initLowLight() { + lowlight.registerLanguage('html', html) + lowlight.registerLanguage('css', css) + lowlight.registerLanguage('js', js) + lowlight.registerLanguage('ts', ts) +} +/* @__PURE__ */ +initLowLight() + // Placeholder import Placeholder from '@tiptap/extension-placeholder' -// collaboration 包 -import Collaboration from '@tiptap/extension-collaboration' -import * as Y from 'yjs' -import { WebrtcProvider } from 'y-webrtc' import { props, setup, defineComponent, $prefix } from '@opentiny/vue-common' import { t } from '@opentiny/vue-locale' import '@opentiny/vue-theme/rich-text-editor/index.less' -import Codehighlight from './code-highlight' +// import Codehighlight from './code-highlight.vue' export default defineComponent({ name: $prefix + 'RichTextEditor', @@ -417,10 +419,7 @@ export default defineComponent({ mono: true, extendOptions: { Editor, - Collaboration, StarterKit, - Y, - WebrtcProvider, Table, TableCell, TableHeader, @@ -441,10 +440,10 @@ export default defineComponent({ CodeBlockLowlight, lowlight, VueNodeViewRenderer, - CodehighComp: VueNodeViewRenderer(Codehighlight(NodeViewContent, nodeViewProps, NodeViewWrapper)), - NodeViewContent, - nodeViewProps, - NodeViewWrapper, + // CodehighComp: VueNodeViewRenderer(Codehighlight(NodeViewContent, nodeViewProps, NodeViewWrapper)), + // NodeViewContent, + // nodeViewProps, + // NodeViewWrapper, Placeholder, codeHighlight } From 3902f1f95f87e1f1f56b702fdcb1645deca5622e Mon Sep 17 00:00:00 2001 From: shenjunjian <40288193@qq.com> Date: Tue, 24 Oct 2023 19:21:19 -0700 Subject: [PATCH 2/2] fix(rich-text-editor): fix --- packages/renderless/src/rich-text-edtior/vue.ts | 2 -- 1 file changed, 2 deletions(-) diff --git a/packages/renderless/src/rich-text-edtior/vue.ts b/packages/renderless/src/rich-text-edtior/vue.ts index f51d7156ba..9a10b6bec0 100644 --- a/packages/renderless/src/rich-text-edtior/vue.ts +++ b/packages/renderless/src/rich-text-edtior/vue.ts @@ -95,8 +95,6 @@ export const renderless = ( if (props.customToolBar) { toolBar = props.customToolBar } - let ydoc = null - let provider = null // 自定义图片 const CustomImage = Image.extend({ addAttributes() {