Sync code changes in electron app while developing
A little late answer but I hope it helps everyone.
There is an npm
module called Electromon.
npm i -g electromon [install]
Usage would be electron .\main.js [change name of main.js to your files like app.js or something. ]
If you directly use the command "electron .",
"nodemon": "nodemon --exec electron ."
then it will give you an error
'electron' is not recognized as an internal or external command,
operable program or batch file.
So Use it Indirectly,
"start": "electron .",
"start:nodemon": "nodemon --watch main.js --exec npm start",
and restart your app with
npm run start:nodemon
The best tool (and easiest) I've found is electron-reload:
// main.js
const electron = require('electron');
const { app, BrowserWindow } = electron;
const path = require('path');
// the first argument can be: a file, directory or glob pattern
require('electron-reload')(__dirname + '/app/index.html', {
electron: path.join(__dirname, 'node_modules', '.bin', 'electron')
});
let mainWindow;
app.on('ready', () => {
mainWindow = new BrowserWindow({
// ...
});
mainWindow.setMenu(null);
mainWindow.loadURL(`file://${__dirname}/app/index.html`);
process.env.NODE_ENV !== 'production' && mainWindow.openDevTools();
});
In this case, you should take a look at development tools for NodeJS process management. My personal favorite is nodemon because you can either use config file or pass something like this:
nodemon --watch . --exec "electron ."
And it will work just fine. But again, it's my opinion, pick the right for you from the list.