monaco-code v0.0.2

monaco-code

基于 monaco-editor Vue 版本编辑器

在线示例

请查看

monaco-code

安装

cnpm i monaco-code

使用方法

<template>
  <MonacoCodeEditor :value="...">
</template>

<script>
  import MonacoCode from "monaco-code"
  Vue.use(MonacoCode)
</script>

or

<template>
  <MonacoCodeEditor :value="...">
</template>

<script>
  import { MonacoCodeEditor } from "monaco-code"
  Vue.component("MonacoCodeEditor", MonacoCodeEditor)
</script>

参数说明

value, language, theme 这些参数优先级更高，会覆盖 options 里相同字段

options 参数

方法说明

可供外部调用的方法

Vue 插件配置

需要配置插件monaco-editor-webpack-plugin才可以使用

npm i monaco-editor-webpack-plugin -D

const MonacoWebpackPlugin = require("monaco-editor-webpack-plugin")

module.exports = {
  ...
  configureWebpack: {
    plugins: [
      new MonacoWebpackPlugin({
        languages: ["javascript", "css", "html", "typescript", "json", "xml"]
      })
    ]
  }
  ...
}