Code Viewer and Editor

NCodemirror

CodeMirror is a wonderful utility for highlighting code This component provides a way to render a piece of code in a human readable way. By default, the code will be editable by the user; to make it a read-only, use the readOnly config option

Name
Type
Default
Description
options
Object
function() { return { tabSize: 2, lineNumbers: true, lineWrapping: false, line: true, }; }

CodeMirror Config Options See the docs

modes
Array
function() { return ['htmlmixed']; }

CodeMirror modes See the docs

Installation

import Vue from 'vue';
import NCodemirror from '@arckinteractive/noah-ui/src/extensions/NCodemirror';

Vue.use(NCodemirror);

Usage