https://github.com/armster15/electron-webpack-boilerplate
A boilerplate that has Electron and Webpack all setup for you
https://github.com/armster15/electron-webpack-boilerplate
electron react reactjs template
Last synced: 2 months ago
JSON representation
A boilerplate that has Electron and Webpack all setup for you
- Host: GitHub
- URL: https://github.com/armster15/electron-webpack-boilerplate
- Owner: Armster15
- License: mit
- Created: 2021-05-17T18:38:53.000Z (about 5 years ago)
- Default Branch: master
- Last Pushed: 2021-06-04T17:41:37.000Z (about 5 years ago)
- Last Synced: 2026-03-01T20:20:21.855Z (4 months ago)
- Topics: electron, react, reactjs, template
- Language: JavaScript
- Homepage:
- Size: 208 KB
- Stars: 1
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# electron-webpack-boilerplate
This is a boilerplate that has Electron and Webpack all setup for you
The boilerplate also uses React, but you can easily remove it if you don't want to use React with your project
## Features
- Hot Module Replacement
- Pre-configured Webpack configurations
- Usage of a `preload.js` script to safely expose Node APIs
- Clean Terminal Output
### Getting Started
Simply clone the repository and install dependencies
```
git clone https://github.com/Armster15/electron-webpack-boilerplate my-new-project
cd my-new-project
npm install
```
## Scripts
### `npm run start`
Starts the Webpack Dev Server and Electron in Development Mode
### `npm run build`
Builds production binaries for the current operating system
### `npm run prod`
Runs Electron in production mode without creating binaries. Great if you want to test how you app behaves in production without having to create binaries for every change.
## Project Structure
```
├── build
├── dist
├── node_modules
├── release
├── resources
└── src
├── main
│ ├── main.js
│ └── preload.js
└── renderer
├── App.jsx
├── index.html
└── index.js
```
### `build`
Contains Webpack configuration files for building both development and production builds
### `dist`
This folder contains files generated by Webpack. These files are auto generated, so don't edit anything in this directory.
### `release`
Production binaries built by [`electron-builder`](https://www.electron.build/) are stored here. To build a binary, run `npm run build`.
### `resources`
This directory contains files required for building binaries (ex. icons).
### `src`
This is where your code lives! There are two more directories inside this folder:
- `main`: This contains Electron-specific code.
- `main.js`: The entry point of your Electron application
- `preload.js`: The preload script, where you can safely expose Node APIs to the renderer
- `renderer`: Your frontend, this is where HTML/CSS/JS lives. The renderer provided in this template uses React, but if you want you can remove it.
- `index.js`: The entry point of your renderer
- `index.html`: The HTML template that will be used with [HtmlWebpackPlugin](https://github.com/jantimon/html-webpack-plugin).
- `App.jsx`: The App component for React. If you aren't using React, you can delete this.