增加electron 热更新，更新相关配置

main.js

@@ -38,21 +38,24 @@ const showLoading = () => {
 // 创建主程序 窗口
 const createWindow = () => {
   win = new BrowserWindow({
-    maxWidth: 1920,
-    maxHeight: 1080,
     minWidth: 1620,
     minHeight: 900,
     webPreferences: {
-      contextIsolation: false,
+      contextIsolation: true,
       nodeIntegration: true,
-      webSecurity: false // 去掉跨越
+      webSecurity: false, 
+      preload: path.join(__dirname, 'preload.js')
     },
     show: false
   })// 创建一个窗口
-  // 在窗口内要展示的内容index.html 就是打包生成的index.html
-  win.loadFile('dist/index.html')
-  // 开启调试工具
-  // win.webContents.openDevTools();
+
+    // 不同环境加载不同文件
+    if (app.isPackaged) {
+      win.loadFile('dist/index.html')
+    } else {
+      win.loadURL('http://localhost:6547/')
+    }
+
   // 事件监听
   win.on('close', () => {
     // 回收BrowserWindow对象
@@ -69,6 +72,11 @@ app.on('ready', async () => {
     loadingWin.close()
     win.show()
   })
+
+    // 在BrowserWindow创建完成后，注册全局快捷键
+    globalShortcut.register('Control+F12', () => {
+      win.webContents.toggleDevTools()
+    })
 })
 
 app.on('window-all-closed', () => {

package.json

@@ -5,9 +5,9 @@
   "author": "Caner",
   "description": "控制端",
   "scripts": {
-    "dev": "vite",
-    "edev": "yarn build && electron .",
-    "build": "vue-tsc --noEmit && vite build",
+    "dev": "vite & yarn edev",
+    "build": "vue-tsc --noEmit && vite build && yarn pmake",
+    "edev": "electron .",
     "make": "electron-forge make",
     "pmake": "electron-forge package"
   },

preload.js

@@ -0,0 +1,7 @@
+const { contextBridge, ipcRenderer } = require('electron')
+
+contextBridge.exposeInMainWorld('$electron', {
+  send: (channel, args) => ipcRenderer.send(channel, args),
+  once: (channel, listener) => ipcRenderer.once(channel, listener),
+  on: (channel, listener) => ipcRenderer.on(channel, listener)
+})

public/loader.js

@@ -1,2 +0,0 @@
-const electron = require('electron');//引入electron
-window['$electron'] = electron

src/App.vue

@@ -1,20 +1,14 @@
 <template>
-  <loading v-if="showLoading" />
-  <router-view
-    v-else
-    v-resize
-  />
+  <router-view />
 </template>
 <script setup lang='ts'>
-import { ref, onMounted } from 'vue'
-import loading from '@/components/loading.vue'
+import { onMounted } from 'vue'
 
-const showLoading = ref(false)
 onMounted(() => {
   // 通知主进程是否完成渲染
   const electron = window.$electron || null
   if (electron) {
-    electron.ipcRenderer.send('close-loading')
+    electron.send('close-loading')
   }
 })
 </script>

vite.config.ts

@@ -25,7 +25,7 @@ export default () => defineConfig({
   server: {
     host: '0.0.0.0',
     port: 6547,
-    open: true,
+    open: false,
     strictPort: false,
     https: false,
   },