tinymce / tinymce-vue

Official TinyMCE Vue component
MIT License
2.08k stars 208 forks source link

Failed to load plugin #409

Closed srabieb closed 3 months ago

srabieb commented 7 months ago

hi, I have next problems when install tinymce-vue version 5.1.1 Screenshot from 2024-04-17 11-41-33

import Editor from '@tinymce/tinymce-vue'
import 'tinymce'
import 'tinymce/icons/default';
import 'tinymce/themes/silver';
import 'tinymce/skins/ui/oxide/skin.css';
import 'tinymce/plugins/advlist';
import 'tinymce/plugins/code';
import 'tinymce/plugins/emoticons';
import 'tinymce/plugins/emoticons/js/emojis';
import 'tinymce/plugins/link';
import 'tinymce/plugins/lists';
import 'tinymce/plugins/autolink';
import 'tinymce/plugins/image';
import 'tinymce/plugins/charmap';
import 'tinymce/plugins/preview';
import 'tinymce/plugins/anchor';
import 'tinymce/plugins/searchreplace';
import 'tinymce/plugins/visualblocks';
import 'tinymce/plugins/fullscreen';
import 'tinymce/plugins/insertdatetime';
import 'tinymce/plugins/media';
import 'tinymce/plugins/table';
import 'tinymce/plugins/help';
import 'tinymce/plugins/wordcount';
import 'tinymce/plugins/pagebreak';
import 'tinymce/plugins/print';
import 'tinymce/plugins/paste';

import contentUiCss from 'tinymce/skins/ui/oxide/content.css';
import "tinymce/skins/ui/oxide/skin.css";

editorOptions: {
                height: this.height,
                fontsize_formats: "8px 10px 12px 14px 16px 18px 20px 22px 24px 36px 48px",
                menubar: false,
                toolbar_mode: 'wrap',
                allow_script_urls: true,
                remove_script_host: false,
                relative_urls: false,
                valid_elements: "*[*]",
                language_url: this.$i18n.locale === 'en' ? false : `/assets/tinymce-lang/${this.$i18n.locale}.js`,
                plugins: [
                    'advlist autolink lists link image charmap print preview anchor',
                    'searchreplace visualblocks code fullscreen',
                    'insertdatetime media table paste code help wordcount pagebreak'
                ],
                toolbar:
                    `undo redo | fontselect fontsizeselect formatselect | ${this.contractElements ? `customSelect` : ''} | bold italic forecolor backcolor |
            alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | blockquote |
            removeformat | table | link | image media ${this.customFileUpload ? `fileupload` : ''} | code | pagebreak | ${this.accordion ? `accordion` : ''}`,
                contextmenu: 'link | customUploadContext',
                images_upload_handler: uploadSingFile,
                language: this.$i18n.locale === "kz" ? "kk" : this.$i18n.locale,
                skin: false,
                content_css: false,
                content_style: contentUiCss
}

it's my config

kemister85 commented 4 months ago

Hi @srabieb After taking a look at your config, It looks like you've given an improper type to the plugins array, which is why the plugins are failing to load. It expects this vue-ref/#plugins.

Expected: <editor plugins="lists code" />

Incorrect implementation: editorOptions: { plugins: [ 'lists code' ],

tiny-stale-bot commented 3 months ago

This issue is stale because it has been open 30 days with no activity. Please comment if you wish to keep this issue open or it will be closed in 7 days.

tiny-stale-bot commented 3 months ago

This issue was closed because it has been stalled for 7 days with no activity.