diff --git a/src/assets/js/monaco-editor.js b/src/assets/js/monaco-editor.js new file mode 100644 index 0000000..9d50854 --- /dev/null +++ b/src/assets/js/monaco-editor.js @@ -0,0 +1,21 @@ +import editorWorker from 'monaco-editor/esm/vs/editor/editor.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'; + +/** 初始化 MonacoEnvironment */ +export function initMonacoEnvironment() { + if (!self.MonacoEnvironment) { + // 配置编辑器环境(Service Worker 等) + self.MonacoEnvironment = { + getWorker(workerId, label) { + if (label === 'javascript' || label === 'typescript') { + return new tsWorker(); + } else if (label === 'json') { + return new jsonWorker(); + } else { + return new editorWorker(); + } + }, + }; + } +} diff --git a/src/views/ToolboxView/Edit/JsonEditor.vue b/src/views/ToolboxView/Edit/JsonEditor.vue index e2aa440..4c2ca8c 100644 --- a/src/views/ToolboxView/Edit/JsonEditor.vue +++ b/src/views/ToolboxView/Edit/JsonEditor.vue @@ -16,24 +16,12 @@ import { onBeforeUnmount, onMounted, } from 'vue'; +import { + initMonacoEnvironment, +} from '@/assets/js/monaco-editor'; + import * as monaco from 'monaco-editor'; -import editorWorker from 'monaco-editor/esm/vs/editor/editor.worker?worker'; -import jsonWorker from 'monaco-editor/esm/vs/language/json/json.worker?worker'; - -// 配置编辑器环境(Service Worker 等) -if (!self.MonacoEnvironment) { - self.MonacoEnvironment = { - getWorker(workerId, label) { - if (label === 'json') { - return new jsonWorker(); - } else { - return new editorWorker(); - } - }, - }; -} - /** 模块名称 */ const PREFIX = '[JsonEditor]'; @@ -126,6 +114,7 @@ function resetEditor() { } onMounted(() => { + initMonacoEnvironment(); initEditor(); window.addEventListener('resize', handleWindowResize); }); diff --git a/src/views/ToolboxView/Edit/TextEditor.vue b/src/views/ToolboxView/Edit/TextEditor.vue index d0ae83c..21731e6 100644 --- a/src/views/ToolboxView/Edit/TextEditor.vue +++ b/src/views/ToolboxView/Edit/TextEditor.vue @@ -47,21 +47,15 @@ import { useFileDialog, } from '@vueuse/core'; +import { + initMonacoEnvironment, +} from '@/assets/js/monaco-editor'; + import { $dialog, $message, } from '@/assets/js/naive-ui'; import * as monaco from 'monaco-editor'; -import editorWorker from 'monaco-editor/esm/vs/editor/editor.worker?worker'; - -// 配置编辑器环境(Service Worker 等) -if (!self.MonacoEnvironment) { - self.MonacoEnvironment = { - getWorker() { - return new editorWorker(); - }, - }; -} /** 模块名称 */ const PREFIX = '[TextEditor]'; @@ -220,6 +214,7 @@ fileOnChange((files) => { }); onMounted(() => { + initMonacoEnvironment(); initEditor(); window.addEventListener('resize', handleWindowResize); }); diff --git a/src/views/ToolboxView/Other/RunJavaScript.vue b/src/views/ToolboxView/Other/RunJavaScript.vue index 1475642..0f0a5e4 100644 --- a/src/views/ToolboxView/Other/RunJavaScript.vue +++ b/src/views/ToolboxView/Other/RunJavaScript.vue @@ -49,26 +49,15 @@ import { onBeforeUnmount, onMounted, } from 'vue'; +import { + initMonacoEnvironment, +} from '@/assets/js/monaco-editor'; + import { $dialog, $message, } from '@/assets/js/naive-ui'; import * as monaco from 'monaco-editor'; -import editorWorker from 'monaco-editor/esm/vs/editor/editor.worker?worker'; -import tsWorker from 'monaco-editor/esm/vs/language/typescript/ts.worker?worker'; - -// 配置编辑器环境(Service Worker 等) -if (!self.MonacoEnvironment) { - self.MonacoEnvironment = { - getWorker(workerId, label) { - if (label === 'javascript' || label === 'typescript') { - return new tsWorker(); - } else { - return new editorWorker(); - } - }, - }; -} /** 模块名称 */ const PREFIX = '[RunJavaScript]'; @@ -259,6 +248,7 @@ function updateEditorContent(text = '') { } onMounted(() => { + initMonacoEnvironment(); initEditor(); window.addEventListener('resize', handleWindowResize); });