feat: init

.gitignore

@@ -0,0 +1,30 @@
+# dependencies
+/node_modules
+/.pnp
+.pnp.js
+
+# testing
+/coverage
+
+# production
+/build-web
+/build-electron
+/build
+/dist
+/packs
+
+# misc
+.DS_Store
+.env.local
+.env.development.local
+.env.test.local
+.env.production.local
+
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+
+yarn.lock
+package-lock.json
+
+.parcel-cache

.prettierrc

@@ -0,0 +1,15 @@
+{
+    "singleQuote": true,
+    "trailingComma": "all",
+    "printWidth": 100,
+    "proseWrap": "never",
+    "arrowParens": "avoid",
+    "overrides": [
+      {
+        "files": ".prettierrc",
+        "options": {
+          "parser": "json"
+        }
+      }
+    ]
+  }

README.md

@@ -0,0 +1,2 @@
+# 微信视频号下载器
+

config-overrides.js

@@ -0,0 +1,17 @@
+const { override, addLessLoader, adjustStyleLoaders } = require('customize-cra');
+
+module.exports = override(
+  addLessLoader({
+    lessOptions: {
+      javascriptEnabled: true,
+    },
+  }),
+  adjustStyleLoaders(({ use: [, , postcss] }) => {
+    const postcssOptions = postcss.options;
+    postcss.options = { postcssOptions };
+  }),
+  function (config) {
+    config.target = 'electron-renderer';
+    return config;
+  },
+);

electron/const.js

@@ -0,0 +1,24 @@
+import path from "path";
+import isDev from "electron-is-dev";
+import url from "url";
+import { app } from "electron";
+
+const APP_PATH = app.getAppPath();
+// 对于一些 shell 去执行的文件，asar 目录下无法使用。配合 extraResources
+const EXECUTABLE_PATH = path.join(
+  APP_PATH.indexOf("app.asar") > -1
+    ? APP_PATH.substring(0, APP_PATH.indexOf("app.asar"))
+    : APP_PATH,
+  "public"
+);
+
+export default {
+  APP_START_URL: isDev
+    ? "http://localhost:3000"
+    : url.format({
+        pathname: path.join(APP_PATH, "./build/index.html"),
+        protocol: "file:",
+        slashes: true,
+      }),
+  IS_DEV: isDev,
+};

electron/index.js

@@ -0,0 +1,49 @@
+import { app, BrowserWindow } from "electron";
+import log from "electron-log";
+import CONFIG from "./const";
+import { checkUpdate } from "./utils";
+
+app.commandLine.appendSwitch("--no-proxy-server");
+
+function createWindow() {
+  // electron.Menu.setApplicationMenu(null);
+  checkUpdate(
+    "https://cdn.jsdelivr.net/gh/lecepin/electron-react-tpl/package.json",
+    "https://github.com/lecepin/electron-react-tpl/releases"
+  );
+
+  mainWindow = new BrowserWindow({
+    width: 800,
+    height: 600,
+    // resizable: false,
+    // maximizable: false,
+    webPreferences: {
+      webSecurity: false,
+      nodeIntegration: true,
+      contextIsolation: false,
+    },
+  });
+
+  mainWindow.loadURL(CONFIG.APP_START_URL);
+  CONFIG.IS_DEV && mainWindow.webContents.openDevTools();
+
+  mainWindow.on("closed", function () {
+    mainWindow = null;
+  });
+}
+
+app.whenReady().then(() => {
+  createWindow();
+
+  app.on("activate", () => {
+    if (BrowserWindow.getAllWindows().length === 0) {
+      createWindow();
+    }
+  });
+});
+
+app.on("window-all-closed", () => {
+  if (process.platform !== "darwin") {
+    app.quit();
+  }
+});

electron/utils.js

@@ -0,0 +1,30 @@
+import { get } from "axios";
+const { app, dialog, shell } = require("electron");
+import semver from "semver";
+
+// packageUrl 需要包含 { "version": "1.0.0" } 结构
+function checkUpdate(
+  // 可以使用加速地址 https://cdn.jsdelivr.net/gh/lecepin/electron-react-tpl/package.json
+  packageUrl = "https://raw.githubusercontent.com/lecepin/electron-react-tpl/master/package.json",
+  downloadUrl = "https://github.com/lecepin/electron-react-tpl/releases"
+) {
+  get(packageUrl)
+    .then(({ data }) => {
+      if (semver.gt(data?.version, app.getVersion())) {
+        const result = dialog.showMessageBoxSync({
+          message: "发现新版本，是否更新？",
+          type: "question",
+          cancelId: 1,
+          defaultId: 0,
+          buttons: ["进入新版本下载页面", "取消"],
+        });
+
+        if (result === 0 && downloadUrl) {
+          shell.openExternal(downloadUrl);
+        }
+      }
+    })
+    .catch((err) => {});
+}
+
+export { checkUpdate };

package.json

@@ -0,0 +1,110 @@
+{
+  "name": "electron-react-tpl",
+  "version": "1.0.0",
+  "description": "",
+  "main": "./build-electron/index.js",
+  "homepage": "./",
+  "scripts": {
+    "postinstall": "husky install",
+    "start": "concurrently \"cross-env BROWSER=none npm run start-web\"  \"wait-on http://localhost:3000 && npm run start-electron\" ",
+    "start-web": "react-app-rewired start",
+    "start-electron": "parcel build --target electron --no-cache && electron .",
+    "build-web": "react-app-rewired build",
+    "build-electron": "parcel build --target electron --no-cache",
+    "build-all": "rm -rf ./build && rm -rf ./build-electron && npm run build-electron && npm run build-web",
+    "pack": "npm run build-all && electron-builder",
+    "gen-icon": "electron-icon-builder --input=./public/icon/icon.png --output=./public/icon"
+  },
+  "targets": {
+    "electron": {
+      "source": "electron/index.js",
+      "context": "electron-main",
+      "distDir": "build-electron"
+    }
+  },
+  "husky": {
+    "hooks": {
+      "pre-commit": "prettier -c --write \"(src/**/*|electron/**/*)\" && git add -A ."
+    }
+  },
+  "devDependencies": {
+    "concurrently": "^7.1.0",
+    "cross-env": "^7.0.3",
+    "customize-cra": "^1.0.0",
+    "electron": "^18.2.3",
+    "electron-builder": "^23.0.3",
+    "electron-icon-builder": "^2.0.1",
+    "husky": "^8.0.1",
+    "less": "^4.1.2",
+    "less-loader": "^11.0.0",
+    "parcel": "^2.5.0",
+    "prettier": "^2.6.2",
+    "react-app-rewired": "^2.2.1",
+    "react-scripts": "5.0.1",
+    "wait-on": "^6.0.1"
+  },
+  "dependencies": {
+    "axios": "^0.27.2",
+    "electron-is-dev": "^2.0.0",
+    "electron-log": "^4.4.7",
+    "react": "^18.1.0",
+    "react-dom": "^18.1.0",
+    "semver": "^7.3.7"
+  },
+  "author": "lecepin",
+  "license": "ISC",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/lecepin/electron-react-tpl.git"
+  },
+  "build": {
+    "extends": null,
+    "productName": "Lecepin Tpl",
+    "appId": "com.lecepin.tpl",
+    "directories": {
+      "output": "packs"
+    },
+    "npmRebuild": false,
+    "files": [
+      "build/**/*",
+      "build-electron/**/*",
+      "public/**/*"
+    ],
+    "mac": {
+      "icon": "public/icon/icons/mac/icon.icns"
+    },
+    "win": {
+      "target": [
+        {
+          "target": "nsis",
+          "arch": [
+            "x64",
+            "ia32"
+          ]
+        }
+      ],
+      "icon": "public/icon/icons/win/icon.ico"
+    },
+    "nsis": {
+      "oneClick": false,
+      "perMachine": false,
+      "allowElevation": true,
+      "allowToChangeInstallationDirectory": true
+    },
+    "extraResources": [
+      "public"
+    ]
+  },
+  "browserslist": {
+    "production": [
+      ">0.2%",
+      "not dead",
+      "not op_mini all"
+    ],
+    "development": [
+      "last 1 chrome version",
+      "last 1 firefox version",
+      "last 1 safari version"
+    ]
+  }
+}

public/index.html

@@ -0,0 +1,12 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta charset="utf-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1" />
+    <title></title>
+  </head>
+  <body>
+    <noscript>You need to enable JavaScript to run this app.</noscript>
+    <div id="root"></div>
+  </body>
+</html>

src/App.css

@@ -0,0 +1,38 @@
+.App {
+  text-align: center;
+}
+
+.App-logo {
+  height: 40vmin;
+  pointer-events: none;
+}
+
+@media (prefers-reduced-motion: no-preference) {
+  .App-logo {
+    animation: App-logo-spin infinite 20s linear;
+  }
+}
+
+.App-header {
+  background-color: #282c34;
+  min-height: 100vh;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  font-size: calc(10px + 2vmin);
+  color: white;
+}
+
+.App-link {
+  color: #61dafb;
+}
+
+@keyframes App-logo-spin {
+  from {
+    transform: rotate(0deg);
+  }
+  to {
+    transform: rotate(360deg);
+  }
+}

src/App.jsx

@@ -0,0 +1,30 @@
+import logo from "./logo.png";
+import { shell } from "electron";
+import "./App.css";
+
+function App() {
+  return (
+    <div className="App">
+      <header className="App-header">
+        <img src={logo} className="App-logo" alt="logo" />
+        <p>
+          Edit <code>src/App.js</code> and save to reload.
+        </p>
+        <a
+          onClick={(e) => {
+            e.preventDefault();
+            shell.openExternal("https://github.com/lecepin/electron-react-tpl");
+          }}
+          className="App-link"
+          href="#"
+          target="_blank"
+          rel="noopener noreferrer"
+        >
+          Open Github
+        </a>
+      </header>
+    </div>
+  );
+}
+
+export default App;

src/index.css

@@ -0,0 +1,13 @@
+body {
+  margin: 0;
+  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen',
+    'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue',
+    sans-serif;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+}
+
+code {
+  font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New',
+    monospace;
+}

src/index.js

@@ -0,0 +1,11 @@
+import React from 'react';
+import ReactDOM from 'react-dom/client';
+import './index.css';
+import App from './App'; 
+
+const root = ReactDOM.createRoot(document.getElementById('root'));
+root.render(
+  <React.StrictMode>
+    <App />
+  </React.StrictMode>
+);