feat(06): desktop application via electron

Author: FranGuam

.github/workflows/electron.yml

@@ -0,0 +1,83 @@
+name: electron
+
+on:
+  push:
+    tags:
+      - v*
+
+permissions:
+  contents: write
+
+defaults:
+  run:
+    working-directory: frontend
+
+jobs:
+  build:
+    runs-on: ${{ matrix.os }}
+
+    strategy:
+      fail-fast: false
+      matrix:
+        os: [ubuntu-latest, windows-latest, macos-latest]
+        include:
+          - os: ubuntu-latest
+            output-file: |
+              ./frontend/electron/*.AppImage
+              ./frontend/electron/*.deb
+              ./frontend/electron/*.rpm
+              ./frontend/electron/*.tar.gz
+          - os: windows-latest
+            output-file: |
+              ./frontend/electron/*.exe
+          - os: macos-latest
+            output-file: |
+              ./frontend/electron/*.dmg
+              ./frontend/electron/*.zip
+
+    steps:
+      - name: Checkout repository
+        uses: actions/checkout@v4
+
+      - name: Set up Node.js
+        uses: actions/setup-node@v4
+        with:
+          node-version: 20
+          cache: yarn
+          cache-dependency-path: ./frontend/yarn.lock
+
+      - name: Install dependencies
+        run: |
+          yarn install --frozen-lockfile
+          yarn add electron electron-builder --dev
+
+      - name: Build
+        run: |
+          yarn build
+          yarn electron:build
+
+      - name: Upload executables for publish
+        uses: actions/upload-artifact@v4
+        with:
+          name: my-artifact-${{ matrix.os }}
+          path: ${{ matrix.output-file }}
+
+  release:
+    runs-on: ubuntu-latest
+    needs: build
+
+    steps:
+      - name: Download executables
+        uses: actions/download-artifact@v4
+        with:
+          pattern: my-artifact-*
+          merge-multiple: true
+          path: dist
+
+      - name: Deploy to GitHub Releases
+        uses: softprops/action-gh-release@v2
+        with:
+          files: ./dist/*
+          name: Release ${{ github.ref_name }}
+          generate_release_notes: true
+          prerelease: true

frontend/package.json

@@ -31,7 +31,9 @@
     "start": "craco start",
     "build": "craco build",
     "typecheck": "tsc --noEmit",
-    "lint": "eslint src --ext .ts,.tsx"
+    "lint": "eslint src --ext .ts,.tsx",
+    "electron": "yarn build && electron .",
+    "electron:build": "electron-builder"
   },
   "eslintConfig": {
     "extends": [
@@ -49,5 +51,47 @@
       "last 1 firefox version",
       "last 1 safari version"
     ]
+  },
+  "name": "web-workshop",
+  "version": "2024.0.0",
+  "main": "build/electron.js",
+  "build": {
+    "productName": "EESAST Web Workshop",
+    "appId": "web-workshop",
+    "icon": "build/logo.png",
+    "directories": {
+      "output": "electron"
+    },
+    "win": {
+      "target": [
+        "nsis",
+        "portable"
+      ]
+    },
+    "nsis": {
+      "shortcutName": "EESAST",
+      "oneClick": false,
+      "perMachine": true,
+      "allowElevation": true,
+      "allowToChangeInstallationDirectory": true,
+      "createDesktopShortcut": true,
+      "createStartMenuShortcut": true
+    },
+    "mac": {
+      "target": [
+        "dmg",
+        "zip"
+      ]
+    },
+    "linux": {
+      "category": "Utility",
+      "maintainer": "EESAST",
+      "target": [
+        "AppImage",
+        "deb",
+        "rpm",
+        "tar.gz"
+      ]
+    }
   }
 }

frontend/public/electron.js

@@ -0,0 +1,34 @@
+const { app, BrowserWindow } = require("electron");
+const path = require("path");
+
+function createWindow() {
+  const windowOptions = {
+    width: 1280,
+    height: 720,
+  };
+  const mainWindow = new BrowserWindow(windowOptions);
+  mainWindow.loadFile(path.join(__dirname, "index.html"));
+  // 打开新窗口时的配置
+  mainWindow.webContents.setWindowOpenHandler(() => {
+    return {
+      action: "allow",
+      overrideBrowserWindowOptions: windowOptions,
+    };
+  });
+}
+
+app.whenReady().then(() => {
+  createWindow();
+  // 如果没有窗口打开则打开一个窗口 (macOS)
+  app.on("activate", function () {
+    if (BrowserWindow.getAllWindows().length === 0) {
+      createWindow();
+    }
+  });
+});
+// 关闭所有窗口时退出应用 (Windows & Linux)
+app.on("window-all-closed", () => {
+  if (process.platform !== "darwin") {
+    app.quit();
+  }
+});