blackteay/go-view
1
0
Fork 0
mirror of https://gitee.com/dromara/go-view.git synced 2025-10-16 15:22:07 +08:00
Code Issues Projects Releases Wiki Activity

perf: MonacoEditor组件修改，避免全量引入

Browse Source
This commit is contained in:
yangmi 2022-07-24 19:43:58 +08:00
parent a4bd736a8c
commit b78a78b3a5
3 changed files with 4066 additions and 1134 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5189
pnpm-lock.yaml generated
View File

File diff suppressed because it is too large Load Diff

1
src/components/Pages/MonacoEditor/EditorWorker.vue
View File

@ -1,7 +1,6 @@
<template></template> <template></template>
<script setup> <script setup>
import * as monaco from 'monaco-editor'
import editorWorker from 'monaco-editor/esm/vs/editor/editor.worker?worker' import editorWorker from 'monaco-editor/esm/vs/editor/editor.worker?worker'
import jsonWorker from 'monaco-editor/esm/vs/language/json/json.worker?worker' import jsonWorker from 'monaco-editor/esm/vs/language/json/json.worker?worker'
import tsWorker from 'monaco-editor/esm/vs/language/typescript/ts.worker?worker' import tsWorker from 'monaco-editor/esm/vs/language/typescript/ts.worker?worker'

10
src/components/Pages/MonacoEditor/index.hook.ts
View File

@ -1,11 +1,11 @@
import { ref, onBeforeUnmount, nextTick } from 'vue' import { ref, onBeforeUnmount, nextTick } from 'vue'
import { useDesignStore } from '@/store/modules/designStore/designStore' import { useDesignStore } from '@/store/modules/designStore/designStore'
import * as monaco from 'monaco-editor/esm/vs/editor/editor.api.js' import { editor } from 'monaco-editor/esm/vs/editor/editor.api.js'
export const useMonacoEditor = (language = 'javascript') => { export const useMonacoEditor = (language = 'javascript') => {
const designStore = useDesignStore() const designStore = useDesignStore()
let monacoEditor: monaco.editor.IStandaloneCodeEditor | null = null let monacoEditor: editor.IStandaloneCodeEditor | null = null
let initReadOnly = false let initReadOnly = false
const el = ref<HTMLElement | null>(null) const el = ref<HTMLElement | null>(null)
@ -25,12 +25,12 @@ const designStore = useDesignStore()
} }
// 创建实例 // 创建实例
const createEditor = (editorOption: monaco.editor.IStandaloneEditorConstructionOptions = {}) => { const createEditor = (editorOption: editor.IStandaloneEditorConstructionOptions = {}) => {
if (!el.value) return if (!el.value) return
const javascriptModel = monaco.editor.createModel('', language) const javascriptModel = editor.createModel('', language)
initReadOnly = !!editorOption.readOnly initReadOnly = !!editorOption.readOnly
// 创建 // 创建
monacoEditor = monaco.editor.create(el.value, { monacoEditor = editor.create(el.value, {
model: javascriptModel, model: javascriptModel,
// 是否启用预览图 // 是否启用预览图
minimap: { enabled: false }, minimap: { enabled: false },