https://github.com/alexiej/editorjs-codemirror

CodeMiirror for EditorJS
https://github.com/alexiej/editorjs-codemirror

Last synced: 26 days ago
JSON representation

CodeMiirror for EditorJS

• Host: GitHub
• URL: https://github.com/alexiej/editorjs-codemirror
• Owner: alexiej
• License: mit
• Created: 2020-02-19T20:30:32.000Z (almost 5 years ago)
• Default Branch: master
• Last Pushed: 2022-12-05T09:21:01.000Z (about 2 years ago)
• Last Synced: 2024-08-03T17:08:53.440Z (4 months ago)
• Language: JavaScript
• Size: 1.27 MB
• Stars: 16
• Watchers: 3
• Forks: 9
• Open Issues: 15
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

• awesome-editorjs - editorjs-codemirror

README

        
![](https://badgen.net/badge/Editor.js/v2.0/blue)

# CodeMirror Tool for Editor.js

Code Mirror for the [Editor.js](https://ifmo.su/editor) allows to include code examples in your articles.

![image-20200219214508250](assets/image-20200219214508250.png) [README.md](README.md) 

## Know Bugs

* On focus, when cursor is blinking, the ediitor always activate event  'OnChange'.

## Installation

### Install via NPM

**TODO:**

###  Download to your project's source dir

1. Upload folder `dist` from repository

2. Add `dist/bundle.js` file to your page.

### Load from source

Require this script on a page with Editor.js.

```html

```

## Usage

Add a new Tool to the `tools` property of the Editor.js initial config.

```javascript

var editor = EditorJS({

  ...

  

  tools: {

    ...

    code: CodeMirror,

  }

  

  ...

});

```

## Config Params

| Field       | Type     | Description                    |

| ----------- | -------- | -------------------------------|

| placeholder | `string` | Code Tool's placeholder string |

## Output data

This Tool returns code.

```json

{

    "type" : "code",

    "data" : {

        "code": "body {\n font-size: 14px;\n line-height: 16px;\n}",

    }

}

```