fix: 修复构建报错问题 (#1925) (#1926)

Author: GreatZPP

packages/devui-vue/devui/editor-md/src/composables/use-editor-md.ts

@@ -2,7 +2,7 @@ import cloneDeep from 'lodash/cloneDeep';
 import { computed, nextTick, onMounted, reactive, Ref, ref, SetupContext, toRefs, watch, onBeforeUnmount } from 'vue';
 import { debounce } from '../../../shared/utils';
 import { EditorMdProps, Mode } from '../editor-md-types';
-import { ALT_KEY, DEFAULT_TOOLBARS } from '../toolbar-config';
+import { DEFAULT_TOOLBARS, GET_ALT_KEY } from '../toolbar-config';
 import { parseHTMLStringToDomList } from '../utils';
 import { refreshEditorCursor, _enforceMaxLength } from './helper';
 import { throttle } from 'lodash';
@@ -326,7 +326,7 @@ export function useEditorMd(props: EditorMdProps, ctx: SetupContext) {
         keyCombination += '⌘-';
       }
       if (e.altKey) {
-        keyCombination += `${ALT_KEY}-`;
+        keyCombination += `${GET_ALT_KEY()}-`;
       }
       if (e.shiftKey) {
         keyCombination += 'Shift-';

packages/devui-vue/devui/editor-md/src/toolbar-config.ts

@@ -278,107 +278,115 @@ class ToolBarHandler {
   static color = (): void => {};
 }
 
-export const CTRL_KEY = navigator?.platform?.indexOf('Mac') !== -1 ? '⌘' : 'Ctrl';
-export const ALT_KEY = navigator?.platform?.indexOf('Mac') !== -1 ? '⌥' : 'Alt';
+export const GET_CTRL_KEY = () => {
+  if (typeof window !== 'undefined') {
+    return navigator?.platform?.indexOf('Mac') !== -1 ? '⌘' : 'Ctrl';
+  }
+}
+export const GET_ALT_KEY = () => {
+  if (typeof window !== 'undefined') {
+    return navigator?.platform?.indexOf('Mac') !== -1 ? '⌥' : 'Alt';
+  }
+}
 
 export const DEFAULT_TOOLBARS: Record<string, IToolbarItemConfig> = {
   undo: {
     id: 'undo',
     name: 'undo',
     type: 'button',
     icon: UNDO_ICON,
-    shortKey: `${CTRL_KEY}+Z`,
-    shortKeyWithCode: `${CTRL_KEY}+90`,
+    shortKey: `${GET_CTRL_KEY()}+Z`,
+    shortKeyWithCode: `${GET_CTRL_KEY()}+90`,
     handler: ToolBarHandler.undo,
   },
   redo: {
     id: 'redo',
     name: 'redo',
     type: 'button',
     icon: REDO_ICON,
-    shortKey: `${CTRL_KEY}+Y`,
-    shortKeyWithCode: `${CTRL_KEY}+89`,
+    shortKey: `${GET_CTRL_KEY()}+Y`,
+    shortKeyWithCode: `${GET_CTRL_KEY()}+89`,
     handler: ToolBarHandler.redo,
   },
   bold: {
     id: 'bold',
     name: 'bold',
     type: 'button',
     icon: BOLD_ICON,
-    shortKey: `${CTRL_KEY}+B`,
-    shortKeyWithCode: `${CTRL_KEY}+66`,
+    shortKey: `${GET_CTRL_KEY()}+B`,
+    shortKeyWithCode: `${GET_CTRL_KEY()}+66`,
     handler: ToolBarHandler.bold,
   },
   italic: {
     id: 'italic',
     name: 'italic',
     type: 'button',
     icon: ITALIC_ICON,
-    shortKey: `${CTRL_KEY}+I`,
-    shortKeyWithCode: `${CTRL_KEY}+73`,
+    shortKey: `${GET_CTRL_KEY()}+I`,
+    shortKeyWithCode: `${GET_CTRL_KEY()}+73`,
     handler: ToolBarHandler.italic,
   },
   strike: {
     id: 'strike',
     name: 'strike',
     type: 'button',
     icon: STRIKE_ICON,
-    shortKey: `${CTRL_KEY}+D`,
-    shortKeyWithCode: `${CTRL_KEY}+68`,
+    shortKey: `${GET_CTRL_KEY()}+D`,
+    shortKeyWithCode: `${GET_CTRL_KEY()}+68`,
     handler: ToolBarHandler.strike,
   },
   h1: {
     id: 'h1',
     name: 'h1',
     type: 'button',
     icon: H1_ICON,
-    shortKey: `${CTRL_KEY}+1`,
-    shortKeyWithCode: `${CTRL_KEY}+49`,
+    shortKey: `${GET_CTRL_KEY()}+1`,
+    shortKeyWithCode: `${GET_CTRL_KEY()}+49`,
     handler: ToolBarHandler.h1,
   },
   h2: {
     id: 'h2',
     name: 'h2',
     type: 'button',
     icon: H2_ICON,
-    shortKey: `${CTRL_KEY}+2`,
-    shortKeyWithCode: `${CTRL_KEY}+50`,
+    shortKey: `${GET_CTRL_KEY()}+2`,
+    shortKeyWithCode: `${GET_CTRL_KEY()}+50`,
     handler: ToolBarHandler.h2,
   },
   ul: {
     id: 'ul',
     name: 'unorderedlist',
     type: 'button',
     icon: LIST_UNORDERED_ICON,
-    shortKey: `${CTRL_KEY}+U`,
-    shortKeyWithCode: `${CTRL_KEY}+85`,
+    shortKey: `${GET_CTRL_KEY()}+U`,
+    shortKeyWithCode: `${GET_CTRL_KEY()}+85`,
     handler: ToolBarHandler.ul,
   },
   ol: {
     id: 'ol',
     name: 'orderedlist',
     type: 'button',
     icon: LIST_ORDERED_ICON,
-    shortKey: `${CTRL_KEY}+O`,
-    shortKeyWithCode: `${CTRL_KEY}+79`,
+    shortKey: `${GET_CTRL_KEY()}+O`,
+    shortKeyWithCode: `${GET_CTRL_KEY()}+79`,
     handler: ToolBarHandler.ol,
   },
   checklist: {
     id: 'checklist',
     name: 'checklist',
     type: 'button',
     icon: LIST_CHECK_ICON,
-    shortKey: `${CTRL_KEY}+${ALT_KEY}+C`,
-    shortKeyWithCode: `${CTRL_KEY}+${ALT_KEY}+67`,
+    shortKey: `${GET_CTRL_KEY()}+${GET_ALT_KEY()}+C`,
+    shortKeyWithCode: `${GET_CTRL_KEY()}+${GET_ALT_KEY()}+67`,
     handler: ToolBarHandler.checkList,
   },
   underline: {
     id: 'underline',
     name: 'underline',
     type: 'button',
     icon: UNDERLINE_ICON,
-    shortKey: `${CTRL_KEY}+R`,
-    shortKeyWithCode: `${CTRL_KEY}+82`,
+    shortKey: `${GET_CTRL_KEY()}+R`,
+    shortKeyWithCode: `${GET_CTRL_KEY()}+82`,
     handler: ToolBarHandler.underline,
   },
   font: {
@@ -394,17 +402,17 @@ export const DEFAULT_TOOLBARS: Record<string, IToolbarItemConfig> = {
     name: 'link',
     type: 'button',
     icon: LINK_ICON,
-    shortKey: `${CTRL_KEY}+L`,
-    shortKeyWithCode: `${CTRL_KEY}+76`,
+    shortKey: `${GET_CTRL_KEY()}+L`,
+    shortKeyWithCode: `${GET_CTRL_KEY()}+76`,
     handler: ToolBarHandler.link,
   },
   image: {
     id: 'image',
     name: 'image',
     type: 'button',
     icon: IMAGE_ICON,
-    shortKey: `${CTRL_KEY}+G`,
-    shortKeyWithCode: `${CTRL_KEY}+71`,
+    shortKey: `${GET_CTRL_KEY()}+G`,
+    shortKeyWithCode: `${GET_CTRL_KEY()}+71`,
     params: { imageUploadToServer: false },
     handler: ToolBarHandler.image,
   },
@@ -414,26 +422,26 @@ export const DEFAULT_TOOLBARS: Record<string, IToolbarItemConfig> = {
     type: 'button',
     icon: FILE_ICON,
     params: {},
-    shortKey: `${CTRL_KEY}+F`,
-    shortKeyWithCode: `${CTRL_KEY}+70`,
+    shortKey: `${GET_CTRL_KEY()}+F`,
+    shortKeyWithCode: `${GET_CTRL_KEY()}+70`,
     handler: ToolBarHandler.file,
   },
   code: {
     id: 'code',
     name: 'code',
     type: 'button',
     icon: CODE_ICON,
-    shortKey: `${CTRL_KEY}+K`,
-    shortKeyWithCode: `${CTRL_KEY}+75`,
+    shortKey: `${GET_CTRL_KEY()}+K`,
+    shortKeyWithCode: `${GET_CTRL_KEY()}+75`,
     handler: ToolBarHandler.code,
   },
   table: {
     id: 'table',
     name: 'table',
     type: 'button',
     icon: TABLE_ICON,
-    shortKey: `${CTRL_KEY}+${ALT_KEY}+T`,
-    shortKeyWithCode: `${CTRL_KEY}+${ALT_KEY}+84`,
+    shortKey: `${GET_CTRL_KEY()}+${GET_ALT_KEY()}+T`,
+    shortKeyWithCode: `${GET_CTRL_KEY()}+${GET_ALT_KEY()}+84`,
     handler: ToolBarHandler.table,
   },
   fullscreen: {