hbitmp/m-monaco-editor

A monaco-editor component for vue.（基于cdn版本）

m-monaco-editor

A monaco-editor component for vue.

npm

npm install -S vue-m-monaco-editor

use

import MMonacoEditor from 'vue-m-monaco-editor'

Vue.use(MMonacoEditor) // 注册 m-monaco-editor 组件

<m-monaco-editor v-model="code" :mode="mode" :theme="theme"></m-monaco-editor>

MMonacoEditor Attributes

参数	说明	类型	可选值	默认值
value	内容	string	—	—
theme	主题	string	vs/vs-dark/hc-dark	vs
mode	语言类型	string	languages	—
cdnUrl	monaco-editor文件链接	string	—	https://cdn.bootcss.com/monaco-editor/0.13.1/min/vs
requireConfig	monaco-editor loader.js 配置	object	—	—
syncInput	同步内容到value	boolean	true/false	false
readOnly	仅读	boolean	true/false	false
fontSize	字体大小	number	—	—
renderLineHighlight	高亮当前行	string	"none"	"gutter"

如果是内网的项目，请指定 cdnUrl 到内网可以访问的 monaco-editor 目录。

MMonacoEditor Event

参数	说明	参数
init	初始化	editer,editorDom,monaco
blur	失去焦点	—
focus	获取焦点	—
layout-change	布局改变	—

更多配置信息，可以在init事件后使用 monaco-editor api

Other

monaco-editor

monaco-editor docs