perf(monaco-editor): 优化编辑器另存为选项 | Optimize editor save as option.

Zuoqiu-Yingyi · Jul 19, 2023 · f03bc1e · f03bc1e
1 parent a49f049
commit f03bc1e
Show file tree

Hide file tree

Showing 2 changed files with 41 additions and 15 deletions.
diff --git a/src/components/Editor.svelte b/src/components/Editor.svelte
@@ -98,22 +98,22 @@
     })();
 
     function updateOptions(options: IStandaloneEditorOptions) {
-        if (inited) {
+        if (inited && options) {
             updateOriginalOptions(options);
             updateModifiedOptions(options);
         }
     }
 
     function updateOriginalOptions(options: IStandaloneEditorOptions) {
-        if (inited) {
+        if (inited && options) {
             if (diff) {
                 diffEditor?.getOriginalEditor().updateOptions(options);
             }
         }
     }
 
     function updateModifiedOptions(options: IStandaloneEditorOptions) {
-        if (inited) {
+        if (inited && options) {
             if (diff) {
                 diffEditor?.getModifiedEditor().updateOptions(options);
             } else {
@@ -137,18 +137,18 @@
                 if (diffEditor && languages) {
                     monaco.editor.setModelLanguage(
                         diffEditor.getOriginalEditor().getModel(), //
-                        languages.map(original.language), //
+                        languages.map(original?.language ?? ""), //
                     );
                     monaco.editor.setModelLanguage(
                         diffEditor.getModifiedEditor().getModel(), //
-                        languages.map(modified.language), //
+                        languages.map(modified?.language ?? ""), //
                     );
                 }
             } else {
                 if (editor && languages) {
                     monaco.editor.setModelLanguage(
                         editor.getModel(), //
-                        languages.map(modified.language), //
+                        languages.map(modified?.language ?? ""), //
                     );
                 }
             }
@@ -161,10 +161,10 @@
         if (inited) {
             changable = false; // 避免触发 changed 监听器
             if (diff) {
-                diffEditor.getOriginalEditor().setValue(original.value);
-                diffEditor.getModifiedEditor().setValue(modified.value);
+                original && diffEditor.getOriginalEditor().setValue(original.value);
+                modified && diffEditor.getModifiedEditor().setValue(modified.value);
             } else {
-                editor.setValue(modified.value);
+                modified && editor.setValue(modified.value);
             }
             changable = temp;
         }
@@ -249,20 +249,27 @@
                 diffEditor.setModel({
                     original: monaco.editor.createModel(
                         original.value, //
-                        languages.map(original.language), //
+                        languages.map(original?.language ?? ""), //
                     ),
                     modified: monaco.editor.createModel(
                         modified.value, //
-                        languages.map(modified.language), //
+                        languages.map(modified?.language ?? ""), //
                     ),
                 });
                 editor = diffEditor.getModifiedEditor();
             } else {
                 // 常规编辑器
-                editor = monaco.editor.create(
-                    editorElement, //
-                    merge(options, modified, { language: languages.map(modified.language) }), //
-                );
+                if (modified) {
+                    editor = monaco.editor.create(
+                        editorElement, //
+                        merge(options, modified, { language: languages.map(modified.language) }), //
+                    );
+                } else {
+                    editor = monaco.editor.create(
+                        editorElement, //
+                        options, //
+                    );
+                }
             }
 
             /**
@@ -314,6 +321,7 @@
                 run: () => {
                     SaveFileAs({
                         data: editor.getValue(),
+                        filetype: languages.getMimeType(editor.getModel().getLanguageId()),
                     });
                 },
             });

diff --git a/src/utils/language.ts b/src/utils/language.ts
@@ -47,6 +47,8 @@ export class Languages {
     protected readonly _map_alias_id = new Map<string, string>(); // 语言别名 -> ID
     protected readonly _map_extension_id = new Map<string, string>(); // 语言文件扩展名 -> ID
     protected readonly _map_mimetype_id = new Map<string, string>(); // 语言 mine-type -> ID
+    protected readonly _map_id_extension = new Map<string, string>(); // 语言 ID -> 文件扩展名
+    protected readonly _map_id_mimetype = new Map<string, string>(); // 语言 ID -> mine-type
 
     constructor(langs: languages.ILanguageExtensionPoint[]) {
         langs.forEach(lang => {
@@ -62,11 +64,17 @@ export class Languages {
                 lang.extensions.forEach(extension => {
                     this._map_extension_id.set(this.wash(extension), id);
                 });
+                if (lang.extensions.length > 0) {
+                    this._map_id_extension.set(id, this.wash(lang.extensions.at(0)));
+                }
             }
             if (lang.mimetypes) {
                 lang.mimetypes.forEach(mimetype => {
                     this._map_mimetype_id.set(this.wash(mimetype), id);
                 });
+                if (lang.mimetypes.length > 0) {
+                    this._map_id_mimetype.set(id, this.wash(lang.mimetypes.at(0)));
+                }
             }
         });
     }
@@ -75,6 +83,16 @@ export class Languages {
         return lang.trim().toLowerCase();
     }
 
+    public getExtension(lang: string): string {
+        lang = this.wash(lang);
+        return this._map_id_extension.get(lang) ?? lang;
+    }
+
+    public getMimeType(lang: string): string {
+        lang = this.wash(lang);
+        return this._map_id_mimetype.get(lang) ?? lang;
+    }
+
     /* 将语言映射到语言 ID */
     public map(lang: string): string {
         lang = this.wash(lang);