Quiero tener un archivo js, digamos window.js que es responsable de crear y exportar una instancia única de BrowserWindow para poder reutilizar esta instancia en varios archivos js.
Hasta ahora probé esto:
const { app, BrowserWindow } = require("electron"); let window = null; const createWindow = () => { if (window) return; window = new BrowserWindow({ minWidth: 820, minHeight: 620, width: 820, height: 620, resizable: false, webPreferences: { preload: path.join(__dirname, "preload.js"), enableRemoteModule: true, }, }); window.removeMenu(); }; app.whenReady().then(() => { createWindow(); app.on("activate", () => { if (BrowserWindow.getAllWindows().length === 0) { createWindow(); // showRecorderWindow(); } }); }); module.exports = { window } Sin embargo, cuando necesito la ventana usando: const { window } = require("./window.js"); la variable de ventana siempre es nula. ¿Hay alguna manera de lograr esto?
El uso de "setters" y "getters" resolverá su problema.
Su archivo main.js debe require su módulo window.js y create() la ventana.
Si cualquier otro archivo (s) de Javascript requiere acceso a la instancia de la ventana, dentro de ese archivo puede require el módulo window.js y luego simplemente llamar a la función get() .
Dentro de su main.js (hilo principal):
require el archivo window.js que contiene las funciones de create y get .window para que no se recolecte basura.electronApp.on('ready', ...) asigne a la variable de ventana la instancia de ventana creada. const electronApp = require('electron').app; const electronBrowserWindow = require('electron').BrowserWindow; const nodePath = require("path"); const appWindow = require(nodePath.join(__dirname, 'window')); // Prevent garbage collection let window; electronApp.on('ready', () => { window = appWindow.create(); }); electronApp.on('window-all-closed', () => { if (process.platform !== 'darwin') { electronApp.quit(); } }); electronApp.on('activate', () => { if (electronBrowserWindow.getAllWindows().length === 0) { appWindow.create(); } }); Dentro de su window.js (hilo principal):
create la ventana y otra para get la instancia de la ventana. const electronBrowserWindow = require('electron').BrowserWindow; const nodePath = require('path'); let window; // Top level scope within the module function create() { window = new electronBrowserWindow({ x: 0, y: 0, width: 800, height: 600, show: false, webPreferences: { nodeIntegration: false, contextIsolation: true, preload: nodePath.join(__dirname, 'preload.js') } }); window.loadFile('index.html') .then(() => { window.show(); }); return window; // Return the instance of the window } function get() { return window; // Return the instance of the window } // Export the publicly available functions. module.exports = {create, get}; Y finalmente, cuando necesite referirse a la instancia de la window en el archivo another.js (hilo principal):
require el archivo window.js .get() . const nodePath = require('path'); const appWindow = require(nodePath.join(__dirname, 'window')); let window = appWindow.get();Esto es realmente útil cuando necesita usar una ventana específica como principal para una ventana o cuadro de diálogo secundario.
Cuando usa module.exports = <object> , está creando una copia del objeto sin vínculo de vuelta al objeto original. En su código, la sección module.exports se ejecuta antes de que se cree la ventana en la sección app.whenReady() . Esto se debe a que su función en la sección app.whenReady() se ejecuta de forma asíncrona. Entonces, en el momento en que se module.exports = { window } , window todavía es igual a null . Para solucionar esto, debe mover module.exports a app.whenReady() después de createWindow() o, para corregir el alcance, a createWindow() así (también corregí la sangría):
const { app, BrowserWindow } = require("electron"); const createWindow = () => { if (window) return; const window = new BrowserWindow({ minWidth: 820, minHeight: 620, width: 820, height: 620, resizable: false, webPreferences: { preload: path.join(__dirname, "preload.js"), enableRemoteModule: true, }, }); window.removeMenu(); module.exports = { window } }; app.whenReady().then(() => { createWindow(); app.on("activate", () => { if (BrowserWindow.getAllWindows().length === 0) { createWindow(); // showRecorderWindow(); } }); }); Ahora, cuando necesite windows.js , devolverá el objeto window más reciente. Solo asegúrate de hacer tu const { window } = require("./window.js"); una vez que la aplicación esté lista:
// file2.js const { app, BrowserWindow } = require("electron"); let window = null; app.whenReady().then(() => { app.on("activate", () => { if (window == null) { { window } = require("./window.js"); } }); }); Tenga en cuenta que no puede require("./window.js") varias veces para obtener la última ventana, ya que node.js guardará una copia de window.js cuando la necesite. También puede consultar la comunicación entre procesos: https://www.electronjs.org/docs/latest/tutorial/ipc