fixed issues in build and bumped package.json file to 2.0.2

Author: NdibeRaymond

.erb/configs/webpack.config.main.dev.js

@@ -28,6 +28,16 @@ const configuration = {
 		filename: '[name].dev.js',
 	},
 
+  module: {
+		rules: [
+			// Images
+			{
+				test: /\.(png|svg|jpg|jpeg|gif)$/i,
+				type: 'asset/resource',
+			},
+		],
+	},
+
 	plugins: [
 		/**
 		 * Create global constants which can be configured at compile time.

.erb/configs/webpack.config.main.prod.js

@@ -37,6 +37,20 @@ const configuration = {
 	output: {
 		path: webpackPaths.distMainPath,
 		filename: '[name].prod.js',
+    clean: true
+	},
+
+  module: {
+		rules: [
+			// Images
+			{
+				test: /\.(png|svg|jpg|jpeg|gif)$/i,
+				type: 'asset/resource',
+        generator: {
+          filename: '[name][ext]'
+        }
+			},
+		],
 	},
 
 	optimization: {

.erb/configs/webpack.config.renderer.prod.js

@@ -49,6 +49,7 @@ const configuration = {
 		path: path.join(webpackPaths.distRendererPath, './'),
 		publicPath: path.join(webpackPaths.distRendererPath, './'),
 		filename: '[name].renderer.prod.js',
+    clean: true
 		// library: {
 		//   type: 'umd',
 		// },

.github/workflows/build.yml

@@ -80,7 +80,7 @@ jobs:
                   npm run build
                   npm --prefix ./release/app install @electron-forge/cli -D
                   npm --prefix ./release/app install @electron-forge/plugin-auto-unpack-natives -D
-                  cd ./release/app && npx electron-forge import && npx electron-forge make
+                  cd ./release/app && npx electron-forge import && cp ../../forge.config.template.js ./forge.config.js && npx electron-forge make
 
             - name: 'Upload Ubuntu Artifacts'
               uses: actions/upload-artifact@v2

README.md

@@ -113,6 +113,10 @@ cd ./release/app
 npx electron-forge import
 ```
 
+```commandline
+cp ../../forge.config.template.js ./forge.config.js
+```
+
 ### Build Executable
 
 1. After running the command above, electron forge modifies your project (mostly release/app/package.json) to the format it accepts while building an executable. run the command below while still in the release/app/ directory to build an executable for your local machine (be patient, this can take a while).

release/app/forge.config.js forge.config.template.jsrelease/app/forge.config.js renamed to forge.config.template.js

@@ -2,12 +2,12 @@ module.exports = {
 	packagerConfig: {
 		asar: true,
 	},
-	plugins: [['@electron-forge/plugin-auto-unpack-natives']],
+	plugins: [{name: '@electron-forge/plugin-auto-unpack-natives', config: {}}],
 	makers: [
 		{
 			name: '@electron-forge/maker-squirrel',
 			config: {
-				name: 'ui_client',
+				name: 'ui-client',
 			},
 		},
 		{
@@ -17,13 +17,13 @@ module.exports = {
 		{
 			name: '@electron-forge/maker-deb',
 			config: {
-				icon: '../../assets/icon.png',
+				icon: './dist/main/icon.png',
 			},
 		},
 		{
 			name: '@electron-forge/maker-rpm',
 			config: {
-				icon: '../../assets/icon.png',
+				icon: './dist/main/icon.png',
 			},
 		},
 	],

package.json

@@ -1,6 +1,6 @@
 {
   "name": "ui-client",
-  "version": "2.0.1",
+  "version": "2.0.2",
   "description": "The Bug Hunter's Workbench",
   "repository": {
     "type": "git",

release/app/package.json

@@ -1,6 +1,6 @@
 {
   "name": "ui-client",
-  "version": "2.0.1",
+  "version": "2.0.2",
   "description": "The Bug Hunter's Workbench",
   "repository": {
     "type": "git",

src/main/utils.js

@@ -6,20 +6,19 @@ import { createRequire } from 'module';
 
 export const require = createRequire(import.meta.url);
 
-export const isDev =
-	process.env.NODE_ENV === 'development' ||
+export const isDev = () => process.env.NODE_ENV === 'development' ||
 	process.env.DEBUG_PROD === 'true' ||
 	!app.isPackaged;
 
 export const getDirName = url => path.dirname(new URL(url).pathname);
 
-const RESOURCES_PATH = isDev
-	? path.join(getDirName(import.meta.url), '../../assets')
-	: path.join(process.resourcesPath, 'assets');
+// const resourcesPath = () => isDev()
+// 	? path.resolve(getDirName(import.meta.url), '..','..','assets')
+// 	: path.join(process.resourcesPath, 'assets');
 
-export const getAssetPath = (...paths) => path.join(RESOURCES_PATH, ...paths);
+// export const getAssetPath = (...paths) => path.join(resourcesPath(), ...paths);
 
-const getFullPath = filename =>
+const getFullPath = filename => isDev() ?
 	path.resolve(
 		getDirName(import.meta.url),
 		'..',
@@ -29,7 +28,7 @@ const getFullPath = filename =>
 		'dist',
 		'renderer',
 		filename,
-	);
+	) : path.join(process.resourcesPath, 'app.asar/dist/renderer', filename);
 
 export const resolveHtmlPath = htmlFileName =>
 	`file://${getFullPath(htmlFileName)}`;

src/main/window.js

@@ -1,7 +1,8 @@
 import { BrowserWindow, shell } from 'electron';
 import { getWindowPosition } from './config';
 import { updateWindowInfo, openDevTools } from './ipcMain'; // eslint-disable-line no-unused-vars
-import { require, isDev, getAssetPath, resolveHtmlPath } from './utils';
+import { require, isDev, resolveHtmlPath } from './utils';
+import ui_icon from '../../assets/icon.png';
 
 const installExtensions = async () => {
 	const installer = require('electron-devtools-installer');
@@ -16,12 +17,12 @@ const installExtensions = async () => {
 
 // eslint-disable-next-line no-unused-vars
 const devSetup = async () => {
-	if (process.env.NODE_ENV === 'production' && isDev) {
+	if (process.env.NODE_ENV === 'production' && isDev()) {
 		const sourceMapSupport = require('source-map-support');
 		sourceMapSupport.install();
 	}
 
-	if (isDev) {
+	if (isDev()) {
 		const debug = require('electron-debug');
 		debug();
 		await installExtensions();
@@ -39,7 +40,7 @@ export const createWindow = async () => {
 	const window = new BrowserWindow({
 		title: 'CPG UI Client',
 		// titleBarStyle: 'hiddenInset',
-		icon: getAssetPath('icon.png'),
+		icon: ui_icon,
 		frame: true,
 		// transparent: isMac,
 		acceptFirstMouse: true,