Installations

npm install vue-ckeditor2

Developer Guide

BETA

Typescript

No

Module System

CommonJS

Node Version

11.12.0

NPM Version

6.7.0 Score

52.3

Supply Chain

97.7

Quality

75.5

Maintenance

100

Vulnerability

98.9

License

Pull Requests

Open

0

Total

22

Closed

2

Merged

20

Issues

Open

17

Total

87

Closed

70

Releases

13

v2.1.5

Updated on Apr 02, 2019

v2.1.4

Updated on Mar 07, 2019

v2.1.3

Updated on Mar 07, 2019

v2.1.2

Updated on Mar 06, 2019

v2.1.1

Updated on Oct 24, 2018

v2.1.0

Updated on Oct 24, 2018

View All 13 releases

Languages

3

Vue

JavaScript

Shell

Vue (91.83%)

JavaScript (6.81%)

Shell (1.36%)

Developer

dangvanthanh

Download Statistics

Total Downloads

0

Last Day

0

Last Week

0

Last Month

0

Last Year

0

GitHub Statistics

MIT License

168 Stars

161 Commits

64 Forks

9 Watchers

4 Branches

14 Contributors

Updated on Apr 02, 2025

Maintainers

1

View All 14 Contributors

Package Meta Information

Latest Version

2.1.5

Package Id

vue-ckeditor2@2.1.5

Unpacked Size

66.51 kB

Size

33.04 kB

File Count

12

NPM Version

6.7.0

Node Version

11.12.0

Total Downloads

Cumulative downloads

Total Downloads

NaN

Last Day

0%

NaN

Compared to previous day

Last Week

0%

NaN

Compared to previous week

Last Month

0%

NaN

Compared to previous month

Last Year

0%

NaN

Compared to previous year

Weekly Downloads

Monthly Downloads

Yearly Downloads

Peer Dependencies

2

vue ckeditor

Dev Dependencies

6

bili husky lint-staged prettier rollup-plugin-vue vue-template-compiler

vue-ckeditor

Ckeditor using for Vue.js 2

Requirements

Ckeditor >= 4
Vue.js >= 2

Install

CDN

1<script src="https://unpkg.com/vue-ckeditor2"></script>

NPM

$ npm install vue-ckeditor2 --save

Usage

This document applies to v2.0+. If you are looking for older versions, docs are here

Component

Then in your component:

1<template>
2  <div>
3    <vue-ckeditor 
4      v-model="content" 
5      :config="config" 
6      @blur="onBlur($event)" 
7      @focus="onFocus($event)"
8      @contentDom="onContentDom($event)"
9      @dialogDefinition="onDialogDefinition($event)"
10      @fileUploadRequest="onFileUploadRequest($event)"
11      @fileUploadResponse="onFileUploadResponse($event)" />
12  </div>
13</template>
14
15<script>
16import VueCkeditor from 'vue-ckeditor2';
17
18export default {
19  components: { VueCkeditor },
20  data() {
21    return {
22      content: '',
23      config: {
24        toolbar: [
25          ['Bold', 'Italic', 'Underline', 'Strike', 'Subscript', 'Superscript']
26        ],
27        height: 300
28      }
29    };
30  },
31  methods: {
32    onBlur(evt) {
33      console.log(evt);
34    },
35    onFocus(evt) {
36      console.log(evt);
37    },
38    onContentDom(evt) {
39      console.log(evt);
40    },
41    onDialogDefinition(evt) {
42      console.log(evt);
43    },
44    onFileUploadRequest(evt) {
45      console.log(evt);
46    },
47    onFileUploadResponse(evt) {
48      console.log(evt);
49    }
50  }
51};
52</script>

Props

Name	Type	Description
`name`	`String`	Name of instance ckedior. Default: editor-
`id`	`String`	Id of instance ckedior. Default: editor-1
`types`	`String`	Types of ckedior. Default: classic
`config`	`Object`	All configuration of ckeditor. Default: {}
`instanceReadyCallback`	`Function`	Optional function that will be attached to CKEditor instanceReady event.
`readOnlyMode`	`Boolean`	Option setReadOnly editor initializes in the proper mode. Default: false

Events

Name	Description
`blur`	Fired when the editor instance loses the input focus.
`focus`	Fired when the editor instance receives the input focus.
`contentDom`	Event fired when the editor content (its DOM structure) is ready
`dialogDefinition`	Event fired when a dialog definition is about to be used to create a dialog into an editor instance
`fileUploadRequest`	Event fired when the file loader should send XHR
`fileUploadResponse`	Event fired when the file loader response is received and needs to be parsed

Build Setup

You can use vue-cli with vue-rollup-boilerplate templates or other vue templates

Created By

Dang Van Thanh

Thanks to:

License

No vulnerabilities found.

10

Binary-Artifacts

Determines if the project has generated executable (binary) artifacts in the source repository.

10

License

Determines if the project has defined a license.

1

Code-Review

Determines if the project requires human code review before pull requests (aka merge requests) are merged.

0

Maintained

Determines if the project is "actively maintained".

0

CII-Best-Practices

Determines if the project has an OpenSSF (formerly CII) Best Practices Badge.

0

Security-Policy

Determines if the project has published a security policy.

0

Fuzzing

Determines if the project uses fuzzing.

0

Branch-Protection

Determines if the default and release branches are protected with GitHub's branch protection settings.

0

SAST

Determines if the project uses static code analysis.

0

Vulnerabilities

Determines if the project has open, known unfixed vulnerabilities.

Score

1.9

/10

Last Scanned on 2025-07-07

The Open Source Security Foundation is a cross-industry collaboration to improve the security of open source software (OSS). The Scorecard provides security health metrics for open source projects.

Learn More