From 21e4b04a03b0b498a1936439bc3c9ff1c2a57f20 Mon Sep 17 00:00:00 2001
From: Wuruipeng <wuruipeng123456@163.com>
Date: Fri, 10 May 2024 15:53:26 +0800
Subject: [PATCH] =?UTF-8?q?feat=EF=BC=9Aelectron=E5=BA=94=E7=94=A8?=
 =?UTF-8?q?=E6=89=93=E5=8C=85=E5=90=8E=E8=87=AA=E5=8A=A8=E5=8A=A0=E8=BD=BD?=
 =?UTF-8?q?=E6=89=93=E5=8C=85=E7=9A=84=E5=89=8D=E7=AB=AF=E8=B5=84=E6=BA=90?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 app/main.js                         | 43 +++++++++++++++++++----------
 package.json                        |  5 ++--
 src/styles/components/TitleBar.less |  5 +++-
 webpack.config.js                   |  6 +++-
 4 files changed, 41 insertions(+), 18 deletions(-)

diff --git a/app/main.js b/app/main.js
index 13feeeb..318e562 100644
--- a/app/main.js
+++ b/app/main.js
@@ -2,13 +2,14 @@
  * @Author: wuruipeng
  * @Date: 2024-03-06 17:39:06
  * @LastEditors: wuruipeng
- * @LastEditTime: 2024-05-09 17:55:48
+ * @LastEditTime: 2024-05-10 15:47:25
  * @description: 主进程配置
  */
 
 global.config = require('./utils/config.js')
 const { app, dialog, BrowserWindow } = require('electron')
 const path = require('path')
+const url = require('url')
 const { confirmExit } = require('./utils/common.js')
 require('./render/mainMenu.js') // 菜单配置
 
@@ -17,20 +18,34 @@ function initApp(rootPath) {
   // 基础窗口信息配置
   const createWindow = function () {
     const { mainWindow } = require('./render/mainWindow.js')
-    mainWindow.loadURL('http://localhost:3000') // 在线功能加载 React 服务的 URL
-    // 需要启动服务的项目，同时监听加载失败事件
-    mainWindow.webContents.on(
-      'did-fail-load',
-      (event, errorCode, errorDescription) => {
-        // 如果errorCode为-105（net::ERR_NAME_NOT_RESOLVED），则表示服务不可用
-        if (errorCode === -105) {
-          dialog.showErrorBox('Can not use this server')
-        } else {
-          dialog.showErrorBox(`Load Failed：${errorDescription}`)
+    // 如果为开发模式
+    if (rootPath === 'build') {
+      // 定位打包资源路径
+      const reactBuildPath = path.join(path.dirname(__dirname), 'build')
+      // 配置读取规则
+      const reactURL = url.format({
+        pathname: path.join(reactBuildPath, 'index.html'),
+        protocol: 'file:',
+        slashes: true
+      })
+      // 加载打包好的build资源目录
+      mainWindow.loadURL(reactURL)
+    } else {
+      mainWindow.loadURL('http://localhost:3000') // 在线功能加载 React 服务的 URL
+      // 需要启动服务的项目，同时监听加载失败事件
+      mainWindow.webContents.on(
+        'did-fail-load',
+        (event, errorCode, errorDescription) => {
+          // 如果errorCode为-105（net::ERR_NAME_NOT_RESOLVED），则表示服务不可用
+          if (errorCode === -105) {
+            dialog.showErrorBox('Can not use this server')
+          } else {
+            dialog.showErrorBox(`Load Failed：${errorDescription}`)
+          }
         }
-        mainWindow.loadFile(path.join(__dirname, '..', rootPath, 'index.html')) // 使用相对路径加载 HTML 文件
-      }
-    )
+      )
+    }
+
     // 窗口关闭前进行确认验证
     mainWindow.on('close', event => {
       confirmExit(event)
diff --git a/package.json b/package.json
index 967c343..ef20275 100644
--- a/package.json
+++ b/package.json
@@ -23,10 +23,11 @@
   "scripts": {
     "app": "electron .",
     "serve": "webpack serve --mode development",
-    "build": "webpack --mode development",
+    "serve:prod": "webpack serve --mode production",
+    "build": "webpack --mode production",
     "serve:build": "serve build",
     "pack": "electron-builder",
-    "pack:all": "npm run build && npm run pack && serve build",
+    "pack:all": "npm run build && npm run pack",
     "jest": "jest",
     "structure": "node config-structure.js",
     "test": "echo \"Error: no test specified\" && exit 1"
diff --git a/src/styles/components/TitleBar.less b/src/styles/components/TitleBar.less
index e28a699..beecf2b 100644
--- a/src/styles/components/TitleBar.less
+++ b/src/styles/components/TitleBar.less
@@ -6,7 +6,7 @@
 #title-bar,
 .title-bar {
   display: @title-bar-display;
-  grid-template-columns: 108px calc(100% - 108px - 160px) 160px;
+  grid-template-columns: 180px calc(100% - 180px - 160px) 160px;
   justify-content: space-between;
   position: fixed;
   top: 0;
@@ -43,6 +43,9 @@
           width: 100%;
           height: calc(@title-bar-height / 2);
           border: none;
+          &:focus {
+            outline: none;
+          }
           &:hover {
             background-color: #ccc;
             @{transprop}: @transvalue;
diff --git a/webpack.config.js b/webpack.config.js
index 4e55510..16183f9 100644
--- a/webpack.config.js
+++ b/webpack.config.js
@@ -3,8 +3,12 @@ const HtmlWebpackPlugin = require('html-webpack-plugin')
 const CopyWebpackPlugin = require('copy-webpack-plugin')
 const { DefinePlugin } = require('webpack')
 
+const MODE = process.argv.pop() ?? 'development'
+
+process.env.NODE_ENV = MODE
+
 module.exports = {
-  mode: 'development', // 开发模式
+  mode: MODE, // 环境模式
   entry: './src/index.tsx', // 入口文件
   // 开发配置
   devServer: {
-- 
Gitee