monaco editor vue2项目简记

note: vue2项目不支持monaco editor@0.34.0最新版本，vue2项目对应我使用的版本号如下：

"monaco-editor": "^0.28.1",
 "monaco-editor-webpack-plugin": "^4.2.0",
  "vue": "^2.2.2",

1.安装依赖：

npm install monaco-editor-webpack-plugin@4.2.0 --save
 npm install monaco-editor@0.28.1 --save

2.vue.config.js配置

const MonacoWebpackPlugin = require('monaco-editor-webpack-plugin')
chainWebpack: config => {
    config.plugin('monaco').use(new MonacoWebpackPlugin({ languages: ['python'] })); // monaco编辑器
}

3.页面使用：
（1）引入插件

// 使用下面的方式引入
import * as monaco from 'monaco-editor/esm/vs/editor/editor.api.js'
// 1. 引入monaco-editor中的python文件
import { language as pythonLanguage } from "monaco-editor/esm/vs/basic-languages/python/python.js";
import 'monaco-editor/esm/vs/basic-languages/javascript/javascript.contribution' // 代码高亮
import 'monaco-editor/esm/vs/editor/contrib/find/findController.js'; // 查找控件

（2）提供容器

<template>
  <div
    ref="container"
    class="monaco-editor"
  ></div>
</template>

（3）变量定义

 // 主要配置
      defaultOpts: {
        value: "",
        language: "python", // 语言类型
        fontSi