Я использую Ckeditor5 для vue в Laravel. Следуя документации Я установил модули с использованием npm install --save @ckeditor/ckeditor5-vue @ckeditor/ckeditor5-build-classic
и включил Ckeditor в ресурсах / js / app. js file
import CKEditor from '@ckeditor/ckeditor5-vue';
Vue.use( CKEditor );
const app = new Vue({
el: '#app',
});
После этого я импортировал ClassicEdditor в компонент vue
<template>
// A lot of code here
<div class="editor">
<ckeditor :editor="editor" v-model="editorData" :config="editorConfig"></ckeditor>
</div>
</template>
<script>
import Swal from 'sweetalert2';
import ClassicEditor from '@ckeditor/ckeditor5-build-classic';
import FontFamily from '@ckeditor/ckeditor5-font/src/fontfamily'; // <----- Here is the error
export default {
props: ['groups'],
mounted(){
},
data: function(){
return {
// My data
editor: ClassicEditor,
editorData: '',
editorConfig: {
// The configuration of the editor.
toolbar: {
items: [
'FontFamily',
'|',
'bold',
'italic',
'underline',
'subscript',
'superscript',
'|',
'List',
'Code',
'EasyImage',
'ImageUpload',
'|',
'link',
'undo',
'redo'
]
}
}
}
},
methods: {
// My methods here
}
</script>
После этого ckeditor показывает предупреждение в консоли
toolbarview-item-unavailable: запрошенный элемент панели инструментов недоступен {name: "FontFamily"}
In Коды ошибок На странице написано, что
Произошла ошибка при обработке конфигурации панели инструментов. Элемент с указанным именем не существует, поэтому он был опущен при рендеринге панели инструментов.
Поэтому я решил установить плагин через npm и импортировать в Vue компонент, но после
import FontFamily from '@ckeditor/ckeditor5-font/src/fontfamily';
Ckeditor выдает ошибку
Uncaught CKEditorError: ckeditor-duplicated-modules: Некоторые модули CKEditor 5 дублированы
Я переустановил ckeditor - то же выпуск