Electron React Webpack Obfuscator (With react-refresh)

A minimal secure boilerplate for writing Desktop Applications using Electron, React, Webpack & Obfuscator with react-refresh.

Special thanks to electron-react-webpack-typescript-2023 for their typescript version.

Following are the list of features it provides :

• No Typescript in boilerplate
• Obfuscation of source code after compilation
• IPC call example

Core Features

• 🌟 Electron
• ⚛️ React
• 🌀 Obfuscator
• 🥗 SASS/SCSS Loader
• 🎨 CSS Loader
• 📸 Image Loader
• 🆎 Font Loader
• 🧹 ESLint
• 📦 Electron Forge
• 📐 IPC call example
• 🔱 Webpack & Configuration
• 🧩 Aliases for Project Paths
• 🔥 React Fast Refresh + Webpack HMR
• 🌞 Dark Mode + Light Mode (Theme)
• 🎁 Package Bundling (Distribution / Release)

Custom Aliases for Paths

We can use predefined aliases for import paths already used in this project. Following are the details:

| Alias | Target Path | | ------------- | -------------------------- | | @assets | /assets | | @main | /src/main | | @renderer | /src/renderer | | @common | /src/common | | @src | /src | | @components | /src/renderer/components |

Installation

git clone https://github.com/lastelok/electron-react-webpack-obfuscator-2023

Install dependencies using pnpm or yarn or npm :

# using pnpm
pnpm install

# or using yarn
yarn install

# or using npm
npm install

Start : Development

To develop and run your application, you need to run following command. Start electron application for development :

npm run start

Lint : Development

To lint application source code using ESLint via this command :

npm run lint

Package : Production

Customize and package your Electron app with OS-specific bundles (.app, .exe etc)

npm run package

Make : Production

Making is a way of taking your packaged application and making platform specific distributables like DMG, EXE, or Flatpak files (amongst others).

npm run make

Publish : Production

Publishing is a way of taking the artifacts generated by the make command and sending them to a service somewhere for you to distribute or use as updates. (This could be your update server or an S3 bucket)

npm run publish

Packager & Makers Configuration

This provides an easy way of configuring your packaged application and making platform specific distributables like DMG, EXE, or Flatpak files.

This configurations file is available in :

tools/forge/forge.config.js

For further information, you can visit Electron Forge Configuration