libj-vue-comp-code-editing
v1.0.2
Published
CodeMirror.js wrapper for vue
Downloads
7
Readme
libj-vue-comp-code-editing
Part of libj tools
CodeMirror.js wrapper for vue
Needs jQuery and Vue to be available globally
Usage
npm install libj-vue-comp-code-editing
j-code-editor
props
- value (String) | default: '' html or js or css code
- canCopy (Boolean) | default: true can user copy the code using a button or not
- visible (Boolean) | default: false visibility of component
methods
- getHtml() => String returns current html
- setHtml(html) sets current html
With default theme
import 'libj-vue-comp-code-editing/dist/libj-vue-comp-code-editing.default.min.css'
import 'libj-vue-comp-code-editing'
//Now, j-code-editor is available globally
Customize theme
You'll need a separate .scss file
// Set variables here
.
.
.
@import 'libj-vue-comp-code-editing/index.scss';
// Now override classes
.
.
.
SCSS Variables:
$j-code-editor-height: 400px !default;
Test
- Run this in a separate command line to start node server
node server.js
- Run one of the following to re-create bundles
npm run dev
npm run dev:watch
- Navigate to http://localhost:3000
Build
npm run build
npm run build:watch