Merge branch 'main' into feat/add-embed-mode

Author: lecepin

src/Repl.vue

@@ -9,6 +9,7 @@ import {
   injectKeyProps,
 } from './types'
 import EditorContainer from './editor/EditorContainer.vue'
+import type * as monaco from 'monaco-editor-core'
 
 export interface Props {
   theme?: 'dark' | 'light'
@@ -37,6 +38,7 @@ export interface Props {
   }
   editorOptions?: {
     showErrorText?: string
+    monacoOptions?: monaco.editor.IStandaloneEditorConstructionOptions
   }
   splitPaneOptions?: {
     CodeTogglerButtonText?: string

src/monaco/Monaco.vue

@@ -35,7 +35,12 @@ const emit = defineEmits<{
 const containerRef = ref<HTMLDivElement>()
 const ready = ref(false)
 const editor = shallowRef<monaco.editor.IStandaloneCodeEditor>()
-const { store, autoSave, theme: replTheme } = inject(injectKeyProps)!
+const {
+  store,
+  autoSave,
+  theme: replTheme,
+  editorOptions,
+} = inject(injectKeyProps)!
 
 initMonaco(store.value)
 
@@ -67,6 +72,7 @@ onMounted(async () => {
       enabled: false,
     },
     fixedOverflowWidgets: true,
+    ...editorOptions.value.monacoOptions,
   })
   editor.value = editorInstance
 

src/monaco/env.ts

@@ -8,6 +8,7 @@ import type { CreateData } from './vue.worker'
 import vueWorker from './vue.worker?worker'
 import * as languageConfigs from './language-configs'
 import type { LanguageService } from '@vue/language-service'
+import { debounce } from '../utils'
 
 let initted = false
 export function initMonaco(store: Store) {
@@ -155,7 +156,12 @@ export function loadMonacoEnv(store: Store) {
   languages.setLanguageConfiguration('typescript', languageConfigs.ts)
   languages.setLanguageConfiguration('css', languageConfigs.css)
 
-  store.reloadLanguageTools = () => reloadLanguageTools(store)
+  let languageToolsPromise: Promise<void> | undefined
+  store.reloadLanguageTools = debounce(async () => {
+    ;(languageToolsPromise ||= reloadLanguageTools(store)).finally(() => {
+      languageToolsPromise = undefined
+    })
+  }, 250)
   languages.onLanguage('vue', () => store.reloadLanguageTools!())
 
   // Support for go to definition

test/main.ts

@@ -72,6 +72,11 @@ const App = {
         //   OutputTogglerButtonText: '输出 >',
         // },
         // isEmbedMode: true,
+        editorOptions: {
+          monacoOptions: {
+            // wordWrap: 'on',
+          },
+        },
       })
   },
 }