#Electron livereload code

In another terminal: $ cd electron-app/main $ yarn electronĪnd in a few seconds, you will see a window with create-react-app landing page. You need to run the create-react-app server and electron in two different terminals. const Step 6: Test your setupĪt this point, you have a fully functioning setup. To know what the script does, check the comments on the original version.

#Electron livereload code

I copied my main.js from the default sample, stripped out the comments and configured it to load React UI(instead of a static html file).Ĭreate a file electron-app/main/src/index.js and add the following code to it. Html answers related to electron app auto refresh. We now need a main process to run electron. Enable live reload for all the files inside your project directory. Think of main as your backend and renderer as your frontend.

The app we are going to build will have two packages : main and renderer. It was evident that electron deserved its own module. As my app grew, it felt unnatural to keep electron inside react src. My initial approach was similar to this article, where I had only one package.json. Suppose you have this sample Electron application: index. You can do that using the npm module electron-reloader. no webpack configurations (and no eject) When working on an Electron app, it’s very handy to set up hot reload, so that the application updates without having to restart it.hot module reload for renderer process (ie.This article walks through setting up an electron app: I wanted it to be more like building react apps. Turns out that they either lack basic functionality or have excessive features.Īnother problem was that most electron setups tackle building electron apps as node apps. electron main.js app require app window require browser-window livereload require electron-livereload app. I tried most of them while setting up a base for HTTPSLocalhost (the fastest way to get https running locally). There are many good electron boilerplates and cli generators.