vue3-code-editor

Simple editor for vue3.

Usage no npm install needed!

<script type="module">
  import vue3CodeEditor from 'https://cdn.skypack.dev/vue3-code-editor';
</script>

README

vue3-code-editor

Simple editor for vue3.

Props:

  • lang:
type: String
default: 'text'
  • theme:
type: String
default: 'chrome'

Events:

  • init
  • chenge
  • chengeAnnotation
  • validate

Example

<template>
  <CodeEditor
    v-model="data"
    lang="javascript"
    theme="monokai"
    @init="init"
  ></CodeEditor>
</template>
<script>
import { defineComponent, ref } from "vue";
import CodeEditor from "vue3-code-editor";

export default defineComponent({
  components: {
    CodeEditor,
  },
  setup() {
    return {
      data: ref(""),

      init: function () {
        require("brace/theme/monokai");
        require("brace/mode/javascript");
      },
    };
  },
});
</script>