FRAMEWORK/VUE

[vue.js] ckeditor4 사용하기

나나나나나나나ㅏ나난ㄴ나ㅏ나나 2021. 1. 13. 14:11
728x90

ckeditor 설치

 npm install ckeditor4-vue

 

vue 선언한곳에 사용하기 (main.js)

import CKEditor from 'ckeditor4-vue';
Vue.use( CKEditor );

 

vue 파일에서 사용하기

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

<script>
export default{
	data(){
    	return {
        	editorData: '',
            editorConfig: {
            	// The configuration of the editor.
            }
    	}
    }
}
</script>

 

원래는 editor5 쓰려고했는데 계속 오류가 발생해서 editor4로 변경하여 하니 한번에 바로 되었다!

 

#공식사이트

ckeditor.com/docs/ckeditor4/latest/guide/dev_vue.html

 

Vue Integration - CKEditor 4 Documentation

Learn how to install, integrate and configure CKEditor 4. More complex aspects, like creating plugins, widgets and skins are explained here, too. API reference and examples included.

ckeditor.com

 

728x90