pourquoi / ckeditor5-simple-upload

32 stars 22 forks source link

TypeError: this.loader.file.then is not a function #16

Closed minasm closed 5 years ago

minasm commented 5 years ago

I am trying to implement this uploader however I got this error:

TypeError: this.loader.file.then is not a function I think file repo related issue but could not find the source.

Also which is the Image plugin you are referring to? I added import ImageUpload from '@ckeditor/ckeditor5-image/src/imageupload';

ClassicEditor.builtinPlugins = [
    Essentials,
    UploadAdapter,
    Autoformat,
    Bold,
    Italic,
    BlockQuote,
//  CKFinder,
//  EasyImage,
    Heading,
    Image,
    SimpleuploadPlugin
    // ...
]
pourquoi commented 5 years ago

You are using an older ckeditor version (prior to v12.0.0)

minasm commented 5 years ago

Thanks for the reply, these are my packages.

    "@ckeditor/ckeditor5-basic-styles": "^11.1.3",
    "@ckeditor/ckeditor5-dev-utils": "latest",
    "@ckeditor/ckeditor5-dev-webpack-plugin": "latest",
    "@ckeditor/ckeditor5-editor-balloon": "^12.2.1",
    "@ckeditor/ckeditor5-essentials": "^11.0.4",
    "@ckeditor/ckeditor5-image": "^12.0.0",
    "@ckeditor/ckeditor5-list": "^12.0.4",
    "@ckeditor/ckeditor5-paragraph": "^11.0.4",
    "@ckeditor/ckeditor5-theme-lark": "^14.1.1",
    "@ckeditor/ckeditor5-upload": "^10.0.0",
    "@ckeditor/ckeditor5-vue": "^1.0.0-beta.2",
    "ckeditor5-simple-upload": "^1.0.6",

This is my custom component,

<template>
    <ckeditor :editor="editor" v-model="editorData" :config="editorConfig"></ckeditor>
</template>

<script>
    import ClassicEditor from '@ckeditor/ckeditor5-editor-classic/src/classiceditor';

    import EssentialsPlugin from '@ckeditor/ckeditor5-essentials/src/essentials';
    import BoldPlugin from '@ckeditor/ckeditor5-basic-styles/src/bold';

    import ItalicPlugin from '@ckeditor/ckeditor5-basic-styles/src/italic';
    import ParagraphPlugin from '@ckeditor/ckeditor5-paragraph/src/paragraph';
    import ImagePlugin from '@ckeditor/ckeditor5-image/src/image';
    import ImageCaptionPlugin from '@ckeditor/ckeditor5-image/src/imagecaption';
    import ImageStylePlugin from '@ckeditor/ckeditor5-image/src/imagestyle';
    import ImageUpload from '@ckeditor/ckeditor5-image/src/imageupload';
    import SimpleuploadPlugin from 'ckeditor5-simple-upload/src/simpleupload'

    export default {
        name: 'ckeditor-custom',
        data() {
            return {
                editor: ClassicEditor,
                editorData: '<p>Hello World</p>',
                editorConfig: {
                    plugins: [
                        EssentialsPlugin,
                        BoldPlugin,
                        ItalicPlugin,
                        ParagraphPlugin,
                        ImagePlugin,
                        ImageCaptionPlugin,
                        ImageStylePlugin,
                        ImageUpload,
                        SimpleuploadPlugin

                    ],
                    simpleUpload: {
                        uploadUrl: 'http://127.0.0.1/my-upload-endpoint'
                    },
                    toolbar: {
                        items: [
                            'heading',
                            '|',
                            'bold',
                            'italic',

                            'imageUpload',

                            'undo',
                            'redo'
                        ]
                    },

                }
            };
        }
    };
</script>
pourquoi commented 5 years ago

Can you try with the latest version of this plugin (1.0.7)

minasm commented 5 years ago

Thanks for your reply @pourquoi but still no luck:(

minasm commented 5 years ago

I am closing this ticket as I am now using Trix instead of Ckeditor. Just noting here so if anyone needs they can find it.