- #How to make a computer program using electron how to
- #How to make a computer program using electron install
- #How to make a computer program using electron code
For the time being, I've just put every non-important folder to the ignore key of the packager config, but that's not a very solid solution. the build folder) for Forge to use, but it seems like that's not possible at all. I've been looking for hours on Google to find out how I could specify a folder (e.g. CRA builds the application for us to the build folder, but when using electron forge to package / make the app, it will copy literally everything in the root folder (including tests, node modules, and our project config files) into the packaged app. There's also a public folder (from CRA), and we have some extra folders for unit tests and a bunch of files to configure things like GitLab CI, Babel, GraphQL, etc. We've used create-react-app to set up the application initially, and are now using a folder structure where the src folder contains all our sources. I'm running into some issues with setting up the electron forge building process. I just happened to be working on moving our existing React dashboard from electron-builder to electron-forge, when I stumbled upon your perfectly timed article. With this file in place, we'll need to declare it as the main entry point for the Electron app in our package.json file: If you would prefer to keep the dev tools attached to the main window, then you can instead leave the object argument out when calling the method. Lastly-and this a matter of personal preference-we detach the dev tools from the app's main window when it launches.We conditionally open the Chrome dev tools depending on the environment (because we only want them to open automatically in development).We use the electron-is-dev package to conditionally point Electron to either our local development server or a bundled production version of our React app (and we use Node's path module to help with this).
#How to make a computer program using electron code
The code above has been adapted from a starter example in the Electron docs, but with a few notable changes: You can also put them in separate files and require them here. Let's begin by creating the new React app:Ĭonst path = require ( " path " ) const ) // In this file you can include the rest of your app's specific main process // code. We'll take care of the first two steps in this section and then configure our project with Electron Forge in the next section.
#How to make a computer program using electron how to
I recently found myself needing to do this on a project and found that I had to do a bit of experimentation before setting on how to best approach generating, developing, and packaging an Electron app with code scaffolded from Create React App under the hood.
#How to make a computer program using electron install
But what happens when you're ready to package up that app in distributable formats so users can install it on their systems? If you ever need to wrap a React app in Electron, you'll surely find there's no shortage of tutorials that explain how to set up your project in your local development environment.