Nuxt.js 如何使用ssr在nuxt中添加ckeditor插件

我正在尝试在我的nuxt应用程序中添加ckeditor 5的对齐插件，该应用程序是通用的（SSR）

我试着在插件中这样做

import Vue from 'vue'
import ClassicEditor from '@ckeditor/ckeditor5-build-classic'
import VueCkeditor from 'vue-ckeditor5'

// import Alignment from '@ckeditor/ckeditor5-alignment/src/alignment'; <-- not working


const options = {

    editors: {
        classic: ClassicEditor,

    },
    name: 'ckeditor'
}

Vue.use(VueCkeditor.plugin, options);

---

我最终找到的最佳选择是制作自己的自定义构建npm包并像使用一样使用它

您可以在客户端导入/呈现CKEditor，只使用包含在客户端的插件的变通方法，该插件只为编辑器注册组件

numxt.config

plugins: [
  { src: '~/plugins/rich-editor', mode: 'client' },
],

ssr=false使插件不包括在服务器端构建中

plugins/rich editor.js

import Vue from 'vue'
import RichEditor from '@/components/RichEditor'

// register component from plugin to bypass SSR
Vue.component('rich-editor', RichEditor)

import CKEditor from '@ckeditor/ckeditor5-vue';

最后在RichEditor包装器中导入CKEditor

RichEditor.js

import Vue from 'vue'
import RichEditor from '@/components/RichEditor'

// register component from plugin to bypass SSR
Vue.component('rich-editor', RichEditor)

import CKEditor from '@ckeditor/ckeditor5-vue';

在服务器端将是空的div，它将在客户端呈现为CKEditor

---

或者，您也可以注册插件。

完整显示error@Aldarund你可能需要将它传输到@Aldarun，我从来没有使用过这个，我不知道这是什么，你能告诉我如何修复这个吗？谢谢，我告诉过你，试着把它添加到transfile选项。U基本上是从传输的源导入的。你需要先编译它们这很好，但是你知道为什么当我重新加载页面（Cmd+R，fullreload）时，我得到的窗口没有定义吗？这不是我第一次进入这个页面。@Skoua我想你是不小心在服务器端导入了编辑器。