From 33f1086599206493cc052417fda52ae25348c3df Mon Sep 17 00:00:00 2001 From: reZach Date: Sat, 4 Jan 2020 15:53:03 -0600 Subject: [PATCH] React/Redux devtools now preloaded in electron --- app/electron/main.js | 26 ++++++++++++++-- package-lock.json | 70 ++++++++++++++++++++++++++++++++++++++++++++ package.json | 2 ++ 3 files changed, 96 insertions(+), 2 deletions(-) diff --git a/app/electron/main.js b/app/electron/main.js index 5cd92da..4be0a27 100644 --- a/app/electron/main.js +++ b/app/electron/main.js @@ -8,11 +8,28 @@ const isDev = process.env.NODE_ENV === "development"; const port = 40992; // Hardcoded; needs to match webpack.development.js and package.json const selfHost = `http://localhost:${port}`; +// Installs extensions useful for development; +// https://github.com/electron-react-boilerplate/electron-react-boilerplate/blob/master/app/main.dev.js +// NOTE - if you'd like to run w/ these extensions when testing w/o electron, you need browser extensions to be installed (React Developer Tools & Redux DevTools) +const installExtensions = async () => { + const installer = require("electron-devtools-installer"); + const forceDownload = !!process.env.UPGRADE_EXTENSIONS; + const extensions = ["REACT_DEVELOPER_TOOLS", "REDUX_DEVTOOLS"]; + + return Promise.all( + extensions.map(name => installer.default(installer[name], forceDownload)) + ).catch(console.log); +}; + // Keep a global reference of the window object, if you don"t, the window will // be closed automatically when the JavaScript object is garbage collected. let win; -function createWindow() { +async function createWindow() { + if (isDev){ + await installExtensions(); + } + // Create the browser window. win = new BrowserWindow({ width: 800, @@ -31,11 +48,16 @@ function createWindow() { // Load app if (isDev) { win.loadURL(selfHost); - win.webContents.openDevTools(); } else { win.loadFile(path.join(__dirname, "../dist/index.html")); } + // Only do these things when in development + if (isDev) { + win.webContents.openDevTools(); + require("electron-debug")(); // https://github.com/sindresorhus/electron-debug + } + // Emitted when the window is closed. win.on("closed", () => { // Dereference the window object, usually you would store windows diff --git a/package-lock.json b/package-lock.json index 25c2e36..dc0afa6 100644 --- a/package-lock.json +++ b/package-lock.json @@ -4,6 +4,12 @@ "lockfileVersion": 1, "requires": true, "dependencies": { + "7zip": { + "version": "0.0.6", + "resolved": "https://registry.npmjs.org/7zip/-/7zip-0.0.6.tgz", + "integrity": "sha1-nK+xca+CMpSQNTtIFvAzR6oVCjA=", + "dev": true + }, "@babel/code-frame": { "version": "7.5.5", "resolved": "https://registry.npmjs.org/@babel/code-frame/-/code-frame-7.5.5.tgz", @@ -2404,6 +2410,12 @@ "which": "^1.2.9" } }, + "cross-unzip": { + "version": "0.0.2", + "resolved": "https://registry.npmjs.org/cross-unzip/-/cross-unzip-0.0.2.tgz", + "integrity": "sha1-UYO8R6CVWb78+YzEZXlkmZNZNy8=", + "dev": true + }, "crypto-browserify": { "version": "3.12.0", "resolved": "https://registry.npmjs.org/crypto-browserify/-/crypto-browserify-3.12.0.tgz", @@ -2778,6 +2790,52 @@ } } }, + "electron-debug": { + "version": "3.0.1", + "resolved": "https://registry.npmjs.org/electron-debug/-/electron-debug-3.0.1.tgz", + "integrity": "sha512-fo3mtDM4Bxxm3DW1I+XcJKfQlUlns4QGWyWGs8OrXK1bBZ2X9HeqYMntYBx78MYRcGY5S/ualuG4GhCnPlaZEA==", + "dev": true, + "requires": { + "electron-is-dev": "^1.1.0", + "electron-localshortcut": "^3.1.0" + } + }, + "electron-devtools-installer": { + "version": "2.2.4", + "resolved": "https://registry.npmjs.org/electron-devtools-installer/-/electron-devtools-installer-2.2.4.tgz", + "integrity": "sha512-b5kcM3hmUqn64+RUcHjjr8ZMpHS2WJ5YO0pnG9+P/RTdx46of/JrEjuciHWux6pE+On6ynWhHJF53j/EDJN0PA==", + "dev": true, + "requires": { + "7zip": "0.0.6", + "cross-unzip": "0.0.2", + "rimraf": "^2.5.2", + "semver": "^5.3.0" + } + }, + "electron-is-accelerator": { + "version": "0.1.2", + "resolved": "https://registry.npmjs.org/electron-is-accelerator/-/electron-is-accelerator-0.1.2.tgz", + "integrity": "sha1-UJ5RDCala1Xhf4Y6SwThEYRqsns=", + "dev": true + }, + "electron-is-dev": { + "version": "1.1.0", + "resolved": "https://registry.npmjs.org/electron-is-dev/-/electron-is-dev-1.1.0.tgz", + "integrity": "sha512-Z1qA/1oHNowGtSBIcWk0pcLEqYT/j+13xUw/MYOrBUOL4X7VN0i0KCTf5SqyvMPmW5pSPKbo28wkxMxzZ20YnQ==", + "dev": true + }, + "electron-localshortcut": { + "version": "3.2.1", + "resolved": "https://registry.npmjs.org/electron-localshortcut/-/electron-localshortcut-3.2.1.tgz", + "integrity": "sha512-DWvhKv36GsdXKnaFFhEiK8kZZA+24/yFLgtTwJJHc7AFgDjNRIBJZ/jq62Y/dWv9E4ypYwrVWN2bVrCYw1uv7Q==", + "dev": true, + "requires": { + "debug": "^4.0.1", + "electron-is-accelerator": "^0.1.0", + "keyboardevent-from-electron-accelerator": "^2.0.0", + "keyboardevents-areequal": "^0.2.1" + } + }, "electron-to-chromium": { "version": "1.3.322", "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.322.tgz", @@ -5202,6 +5260,18 @@ "graceful-fs": "^4.1.6" } }, + "keyboardevent-from-electron-accelerator": { + "version": "2.0.0", + "resolved": "https://registry.npmjs.org/keyboardevent-from-electron-accelerator/-/keyboardevent-from-electron-accelerator-2.0.0.tgz", + "integrity": "sha512-iQcmNA0M4ETMNi0kG/q0h/43wZk7rMeKYrXP7sqKIJbHkTU8Koowgzv+ieR/vWJbOwxx5nDC3UnudZ0aLSu4VA==", + "dev": true + }, + "keyboardevents-areequal": { + "version": "0.2.2", + "resolved": "https://registry.npmjs.org/keyboardevents-areequal/-/keyboardevents-areequal-0.2.2.tgz", + "integrity": "sha512-Nv+Kr33T0mEjxR500q+I6IWisOQ0lK1GGOncV0kWE6n4KFmpcu7RUX5/2B0EUtX51Cb0HjZ9VJsSY3u4cBa0kw==", + "dev": true + }, "keyv": { "version": "3.1.0", "resolved": "https://registry.npmjs.org/keyv/-/keyv-3.1.0.tgz", diff --git a/package.json b/package.json index 3ecdd69..3ec50b8 100644 --- a/package.json +++ b/package.json @@ -33,6 +33,8 @@ "cross-env": "^6.0.3", "csp-html-webpack-plugin": "^3.0.4", "electron": "^7.1.7", + "electron-debug": "^3.0.1", + "electron-devtools-installer": "^2.2.4", "html-loader": "^0.5.5", "html-webpack-plugin": "^3.2.0", "opener": "^1.5.1",