vue-monaco-component v0.0.1

vue-monaco-component

Vue wrapper for the Monaco Editor

Demo

https://edit.withwax.com/

Installation

npm install --save-dev monaco-editor-webpack-plugin
npm install --save vue-monaco-component

npm package link

Setup & example

// webpack.config.js
const MonacoEditorPlugin = require("monaco-editor-webpack-plugin");

module.exports = {
  plugins: [new MonacoEditorPlugin()]
};

// Component.vue
<template>
  <monaco-editor
    v-model="code"
    language="handlebars"
    theme="vs-dark"
    style="width: 100%; height: 200px;"
  ></monaco-editor>
</template>

<script>
import MonacoEditor from "vue-monaco-component";
export default {
  data() {
    return {
      code: ""
    };
  },
  components: {
    MonacoEditor
  }
};
</script>

Powered by

• Babel 7
• Webpack 4

License

MIT

Twitter

Follow me on Twitter