背景
利用monaco editor这款编辑器做代码比较,支持sql、shell、python脚本及json字符串
效果图
代码
CodeDiffEditor.vue
<template>
<div class="the-code-diff-editor-container" ref="diffContainer">
</div>
</template>
<script>
import * as monaco from 'monaco-editor/esm/vs/editor/editor.api'
import 'monaco-editor/esm/vs/basic-languages/shell/shell.contribution'
import 'monaco-editor/esm/vs/basic-languages/sql/sql.contribution'
import 'monaco-editor/esm/vs/basic-languages/python/python.contribution'
import 'monaco-editor/esm/vs/editor/contrib/find/findController.js'
export default {
name: 'codeDiffEditor',
props: {
language