Skip to content

CKEditor5 component for Nuxt.js framework. All free official plugins included.

Notifications You must be signed in to change notification settings

lightdelusion/ckeditor-nuxt

 
 

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

11 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

ckeditor-nuxt

CKEditor 5 editor for nuxt apps. The component includes all free available plugins (except CKFinder, instead simple upload adapter used) Simpliest fork of @blowstack (Thanks, man!)

Requirements

yarn add nuxt # OR npm i nuxt

Component integration

yarn add @lightdelusion/ckeditor-nuxt # OR npm install --save @lightdelusion/ckeditor-nuxt

List of included plugins

  • Alignment,
  • Base64UploadAdapter,
  • Autoformat,
  • Autolink,
  • Autosave,
  • BlockQuote,
  • Bold,
  • Code,
  • CodeBlock,
  • Essentials,
  • FontBackgroundColor,
  • FontColor,
  • FontFamily,
  • FontSize,
  • Heading,
  • Highlight,
  • HorizontalLine,
  • Image,
  • ImageCaption,
  • ImageInsert,
  • ImageResize,
  • ImageStyle,
  • ImageToolbar,
  • ImageUpload,
  • Indent,
  • IndentBlock,
  • Italic,
  • Link,
  • List,
  • ListStyle,
  • Markdown,
  • MathType,
  • MediaEmbed,
  • PageBreak,
  • Paragraph,
  • PasteFromOffice,
  • RemoveFormat,
  • SimpleUploadAdapter,
  • SpecialCharacters,
  • SpecialCharactersArrows,
  • SpecialCharactersCurrency,
  • SpecialCharactersEssentials,
  • SpecialCharactersLatin,
  • SpecialCharactersMathematical,
  • SpecialCharactersText,
  • Strikethrough,
  • Subscript,
  • Superscript,
  • Table,
  • TableCellProperties,
  • TableProperties,
  • TableToolbar,
  • TextTransformation,
  • Title,
  • TodoList,
  • Underline,
  • WordCount,

Usage

<template>
  <client-only placeholder="loading...">
    <ckeditor-nuxt v-model="contentHolder" :config="editorConfig"  />
  </client-only>
</template>

<script>
export default {
  components: {
    'ckeditor-nuxt': () => import('@lightdelusion/ckeditor-nuxt')
  },
  data() {
    return {
      editorConfig: {
        simpleUpload: {
          uploadUrl: 'path_to_image_controller',
          headers: {
            'Authorization': 'optional_token'
          }
        }
      },
      contentHolder: ""
    }
  }
}
</script>


About

CKEditor5 component for Nuxt.js framework. All free official plugins included.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages

  • Vue 64.6%
  • HTML 22.6%
  • JavaScript 12.8%