vue-code

This package is deprecated in favor of vueleton.

A code editor based on Vue.js and CodeMirror.

Installation

$ npm i vue-code

Usage

<vue-code v-model="code" :options="options" @ready="onReady"></vue-code>

import Vue from 'vue';
import VueCode from 'vue-code';

// require additional CodeMirror files
import 'codemirror/lib/codemirror.css';
import 'codemirror/mode/javascript/javascript';

new Vue({
  el: '#my-selector',
  components: {
    VueCode,
  },
  data: {
    code: 'console.log("hello, world");',
    options: {
      mode: 'javascript',
    },
  },
  methods: {
    onReady(cm) {
      console.log('Oh, you got the CodeMirror instance:', cm);
    },
  },
});

For more detailed usage, please see demo.

Document

Content is passed to the component by v-model.

• Props:

  • options

    An object to be passed directly to CodeMirror.

• Events:

  • ready

    Emitted when CodeMirror instance is ready and passed as the only argument.

Snapshots