I have created an app which uses react-electron for frontend, also in the same code i have integrated python using python-shell and i have also used pm2 module to run backend from the electron app only.
The problem that i’m facing is that this code is running when i’m using it on local server, but when i’m trying to build the app, i’m not able to build the app due to an error of pm2-deploy module.
I tried rectifying this error, and after much trial i was able to create the build, but when launching the app, the app is running in the background process but not in front as an app.
let mainWindow: BrowserWindow | null = null;
setupIPCHandlers(mainWindow);
if (process.env.NODE_ENV === 'production') {
const sourceMapSupport = require('source-map-support');
sourceMapSupport.install();
}
const isDebug =
process.env.NODE_ENV === 'development' || process.env.DEBUG_PROD === 'true';
if (isDebug) {
require('electron-debug')();
}
const installExtensions = async () => {
const installer = require('electron-devtools-installer');
const forceDownload = !!process.env.UPGRADE_EXTENSIONS;
const extensions = ['REACT_DEVELOPER_TOOLS'];
return installer
.default(
extensions.map((name) => installer[name]),
forceDownload,
)
.catch(console.log);
};
// Function to start the backend server using PM2
const startServer = () => {
const serverScriptPath = path.join('src/backend/', 'app.js');
pm2.connect((err) => {
if (err) {
console.error('PM2 connection error:', err);
return;
}
pm2.start({
script: serverScriptPath,
name: 'my-server',
cwd: __dirname // Set the current working directory
}, (err, apps) => {
if (err) {
console.error('PM2 start error:', err);
pm2.disconnect();
return;
}
console.log('Server started successfully with PM2');
pm2.disconnect();
});
});
};
const createWindow = async () => {
if (isDebug) {
await installExtensions();
}
const RESOURCES_PATH = app.isPackaged
? path.join(process.resourcesPath, 'assets')
: path.join(__dirname, '../../assets');
const getAssetPath = (...paths: string[]): string => {
return path.join(RESOURCES_PATH, ...paths);
};
mainWindow = new BrowserWindow({
show: false,
width: 1024,
height: 728,
icon: getAssetPath('icon.png'),
webPreferences: {
preload: app.isPackaged
? path.join(__dirname, 'preload.js')
: path.join(__dirname, '../../.erb/dll/preload.js'),
},
});
mainWindow.loadURL(resolveHtmlPath('index.html'));
mainWindow.on('ready-to-show', () => {
if (!mainWindow) {
throw new Error('"mainWindow" is not defined');
}
if (process.env.START_MINIMIZED) {
mainWindow.minimize();
} else {
mainWindow.show();
}
});
mainWindow.on('closed', () => {
mainWindow = null;
});
const menuBuilder = new MenuBuilder(mainWindow);
menuBuilder.buildMenu();
// to hide the menu
mainWindow.setMenu(null);
// Open urls in the user's browser
mainWindow.webContents.setWindowOpenHandler((edata) => {
shell.openExternal(edata.url);
return { action: 'deny' };
});
// Remove this if your app does not use auto updates
// eslint-disable-next-line
new AppUpdater();
// Start the backend server using PM2
startServer();
};
/**
* Add event listeners...
*/
app.on('window-all-closed', () => {
// Respect the OSX convention of having the application in memory even
// after all windows have been closed
if (process.platform !== 'darwin') {
app.quit();
}
});
app
.whenReady()
.then(() => {
const installScriptPath = path.join('src\main', 'install.ts');
exec(`node ${installScriptPath}`, (error, stdout, stderr)=>{
if (error){
console.log(`installation script error: ${error.message}`);
return;
}
if(stderr){
console.log(`Installtion script stderr: ${stderr}`);
// return;
}
console.log(`Installtion script stdout: ${stdout}`);
createWindow();
})
app.on('activate', () => {
// On macOS it's common to re-create a window in the app when the
// dock icon is clicked and there are no other windows open.
if (mainWindow === null) createWindow();
});
})
.catch(console.log);
Sanjana Jain is a new contributor to this site. Take care in asking for clarification, commenting, and answering.
Check out our Code of Conduct.