feat: working electron build

Author: vj-abishek

electron/main.js

@@ -0,0 +1,40 @@
+const { app, BrowserWindow } = require('electron');
+const path = require('path');
+const url = require('url');
+
+let mainWindow;
+
+const createWindow = () => {
+  mainWindow = new BrowserWindow({ width: 800, height: 600, show: false });
+  mainWindow.loadURL(
+    !app.isPackaged
+      ? process.env.ELECTRON_START_URL
+      : url.format({
+          pathname: path.join(__dirname, '../index.html'),
+          protocol: 'file:',
+          slashes: true,
+        }),
+  );
+
+  mainWindow.once('ready-to-show', () => {
+    mainWindow.show();
+  });
+
+  mainWindow.on('closed', () => {
+    mainWindow = null;
+  });
+};
+
+app.on('ready', createWindow);
+
+app.on('window-all-closed', () => {
+  if (process.platform !== 'darwin') {
+    app.quit();
+  }
+});
+
+app.on('activate', () => {
+  if (mainWindow === null) {
+    createWindow();
+  }
+});

package.json

@@ -4,7 +4,8 @@
   "version": "1.0.0",
   "private": true,
   "author": "Abishek",
-  "main": "public/electron.js",
+  "main": "electron/main.js",
+  "homepage": "./",
   "build": {
     "appId": "sh.now.relp",
     "productName": "Relp",
@@ -72,21 +73,26 @@
     "workbox-build": "^5.1.3"
   },
   "scripts": {
-    "start": "yarn build:css && react-scripts start",
+    "main": "yarn build:css && react-scripts start",
     "build-sw": "node ./src/sw-build.js",
     "clean-cra-sw": "rm -f build/precache-manifest.*.js && rm -f build/service-worker.js",
-    "build": "NODE_ENV=production yarn build:css && react-scripts build && npm run build-sw && npm run clean-cra-sw",
-    "windows-build": "set NODE_ENV=production&&yarn build:css && react-scripts build && npm run build-sw && npm run clean-cra-sw",
+    "main-build": "cross-env NODE_ENV=production yarn build:css && react-scripts build && npm run build-sw && npm run clean-cra-sw",
     "test": "react-scripts test",
-    "test-sw": "yarn windows-build && serve build",
+    "test-sw": "yarn main-build && serve build",
     "build:css": "postcss src/Styles/tailwind.css -o src/Styles/AutoGenerated/main.css",
     "lint": "eslint src/**/*.js src/**/*.jsx",
     "format": "npm run prettier -- --write",
     "prettier": "prettier \"src/**/*.{js,jsx,css,json}\"",
     "eject": "react-scripts eject",
-    "electron-pack": "electron-builder -c.extraMetadata.main=build/electron.js",
-    "preelectron-pack": "yarn windows-build",
-    "electron-dev": "concurrently \"set BROWSER=none yarn start\" \"wait-on http://localhost:3000 && electron .\""
+    "electron-pack": "electron-builder -c.extraMetadata.main=build/electron/main.js",
+    "electron-dev": "concurrently \"cross-env BROWSER=none yarn start\" \"wait-on http://localhost:3000 && electron .\"",
+    "start": "cross-env BROWSER=none && npm run main",
+    "start-electron": "cross-env ELECTRON_START_URL=http://localhost:3000 && electron .",
+    "build": "npm run main-build",
+    "build-electron": "mkdir build/src && cp -r electron/. build/electron",
+    "build-electron-win": "mkdir build\\src && Xcopy /E /I /Y electron build\\electron",
+    "package": "npm run build && npm run build-electron && electron-builder build -c.extraMetadata.main=build/electron/main.js --publish never",
+    "package-win": "npm run build && npm run build-electron-win && electron-builder build -c.extraMetadata.main=build/electron/main.js --publish never"
   },
   "eslintConfig": {
     "extends": "react-app"
@@ -106,6 +112,7 @@
   "devDependencies": {
     "autoprefixer": "^9.8.5",
     "concurrently": "^5.3.0",
+    "cross-env": "^7.0.3",
     "electron": "^10.1.5",
     "electron-builder": "^22.9.1",
     "eslint": "^6.8.0",

public/electron.js

@@ -3,11 +3,11 @@ import { render } from 'react-dom';
 import { createStore, applyMiddleware } from 'redux';
 import { Provider } from 'react-redux';
 import thunk from 'redux-thunk';
-import { Router } from 'react-router-dom';
+import { MemoryRouter } from 'react-router-dom';
 import * as Sentry from '@sentry/browser';
 import { composeWithDevTools } from 'redux-devtools-extension';
 import App from './App';
-import history from './history';
+// import history from './history';
 import reducer from './Store/reducers/rootReducers';
 import * as serviceWorker from './serviceWorker';
 import 'fawn-components/lib/fn-pwa-banner';
@@ -26,9 +26,9 @@ const store = createStore(reducer, composeWithDevTools(applyMiddleware(thunk)));
 const rootElement = document.getElementById('root');
 render(
   <Provider store={store}>
-    <Router history={history}>
+    <MemoryRouter>
       <App />
-    </Router>
+    </MemoryRouter>
   </Provider>,
   rootElement,
 );

src/index.js

@@ -4944,6 +4944,13 @@ create-hmac@^1.1.0, create-hmac@^1.1.4, create-hmac@^1.1.7:
     safe-buffer "^5.0.1"
     sha.js "^2.4.8"
 
+cross-env@^7.0.3:
+  version "7.0.3"
+  resolved "https://registry.yarnpkg.com/cross-env/-/cross-env-7.0.3.tgz#865264b29677dc015ba8418918965dd232fc54cf"
+  integrity sha512-+/HKd6EgcQCJGh2PSjZuUitQBQynKor4wrFbRg4DtAgS1aWO+gU52xpH7M9ScGgXSYmAVS9bIJ8EzuaGw0oNAw==
+  dependencies:
+    cross-spawn "^7.0.1"
+
 cross-spawn@7.0.1:
   version "7.0.1"
   resolved "https://registry.yarnpkg.com/cross-spawn/-/cross-spawn-7.0.1.tgz#0ab56286e0f7c24e153d04cc2aa027e43a9a5d14"
@@ -4964,6 +4971,15 @@ cross-spawn@^6.0.0, cross-spawn@^6.0.5:
     shebang-command "^1.2.0"
     which "^1.2.9"
 
+cross-spawn@^7.0.1:
+  version "7.0.3"
+  resolved "https://registry.yarnpkg.com/cross-spawn/-/cross-spawn-7.0.3.tgz#f73a85b9d5d41d045551c177e2882d4ac85728a6"
+  integrity sha512-iRDPJKUPVEND7dHPO8rkbOnPpyDygcDFtWjpeWNCgy8WP2rXcxXL8TskReQl6OrB2G7+UJrags1q15Fudc7G6w==
+  dependencies:
+    path-key "^3.1.0"
+    shebang-command "^2.0.0"
+    which "^2.0.1"
+
 crypto-browserify@^3.11.0:
   version "3.12.0"
   resolved "https://registry.yarnpkg.com/crypto-browserify/-/crypto-browserify-3.12.0.tgz#396cf9f3137f03e4b8e532c58f698254e00f80ec"