CodeFlask: A micro code-editor for awesome web pages.
You can install CodeFlask via npm:
npm install codeflask
Or use it directly in browser via cdn service:
https://unpkg.com/codeflask/build/codeflask.min.js
import CodeFlask from 'codeflask';
const flask = new CodeFlask('#my-selector', { language: 'js' });flask.onUpdate((code) => {
// do something with code here.
// this will trigger whenever the code
// in the editor changes.
});// This will also trigger .onUpdate()
flask.updateCode('const my_new_code_here = "Blabla"');const code = flask.getCode();import CodeFlask from 'codeflask';
const flask = new CodeFlask('#my-selector', {
language: 'js',
lineNumbers: true
});import CodeFlask from 'codeflask';
const flask = new CodeFlask('#my-selector', {
language: 'js',
rtl: true
});import CodeFlask from 'codeflask';
const flask = new CodeFlask('#my-selector', {
language: 'js',
readonly: true
});flask.addLanguage('ruby', options)This API is simply a proxy to add a new language to Prism itself (the code highlighter). The options parameter must be the same accepted in Prism. You can read more about it here.
By default, CodeFlask supports the following languages (which are also the default supported in Prism):
- Markup (HTML/XML);
- CSS;
- C-like;
- JavaScript;
By default, CodeFlask comes with a simple theme made from scratch called CodeNoon.
You can easily override this theme with your own by writting your own CSS and adding it to your project. If that's the case, you should also disable CodeNoon with the defaultTheme option:
import CodeFlask from 'codeflask';
const flask = new CodeFlask('#my-selector', {
language: 'js',
defaultTheme: false
});CodeFlask.js was made possible by awesome open-source projects such as Prism.js and Rollup.
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent