// 설치
npm i --save @ckeditor/ckeditor5-vue @ckeditor/ckeditor5-build-classic

// package.json 확인
    "dependencies": {
        "@ckeditor/ckeditor5-build-classic": "^16.0.0",
        "@ckeditor/ckeditor5-vue": "^1.0.1"
    }

// template 파일 샘플
<template>
    <ckeditor :editor="editor"
              v-model="editorData"
              :config="editorConfig"
    />
</template>

<script>
    import ClassicEditor from '@ckeditor/ckeditor5-build-classic'
    import CKEditor from '@ckeditor/ckeditor5-vue'
    
    export default {
        name: 'CKEditor',
        components: {
            ckeditor: CKEditor.component
        },
        data: () => ({
            editor: ClassicEditor,
            editorData: '<p>Content of the editor.</p>',
            editorConfig: {
                // The configuration of the editor.
                height: '500px',
                language: 'ko'
            }
        })
    }
</script>

참조 URL : https://ckeditor.com/docs/ckeditor5/latest/builds/guides/integration/frameworks/vuejs.html


WRITTEN BY
비트센스
뷰파인더로 보는 프로그래머의 세상 페이스북 @bitsense 트위터 @picory 스카이프 picory MSN drawhalf@dreamwiz.com

트랙백  0 , 댓글  0개가 달렸습니다.
secret