fix: Improve Electron application stability and asset handling

- Completely rewrite main.js for reliable asset loading
- Update preload.js with proper security context isolation
- Fix file:// protocol handling for application resources
- Add proper error logging and reporting in Electron context
- Disable service workers in Electron environment
- Fix path resolution for assets in packaged application
- Add prerequisite checking for Electron builds
- Update electron-builder configuration

The changes resolve persistent issues with:
1. Missing assets in packaged application
2. Incorrect path resolution in production builds
3. Service worker conflicts in desktop environment
4. Security context handling in preload script
5. Electron build process reliability
This commit is contained in:
Matthew Raymer
2025-03-17 07:18:06 +00:00
parent 683e85f5be
commit 4230deab1d
13 changed files with 704 additions and 281 deletions

View File

@@ -88,6 +88,12 @@ async function main() {
throw new Error('package.json not found in build directory');
}
// Copy the electron-logger.js file
const loggerSrc = path.join(__dirname, '../src/electron/electron-logger.js');
const loggerDest = path.join(distElectronDir, 'electron-logger.js');
fs.copyFileSync(loggerSrc, loggerDest);
console.log(`Copying src/electron/electron-logger.js to ${loggerDest}`);
console.log('Build completed successfully!');
} catch (error) {
console.error('Build failed:', error);

View File

@@ -0,0 +1,177 @@
#!/usr/bin/env node
/**
* @file check-electron-prerequisites.js
* @description Verifies and installs required dependencies for Electron builds
*
* This script checks if Python's distutils module is available, which is required
* by node-gyp when compiling native Node.js modules during Electron packaging.
* Without distutils, builds will fail with "ModuleNotFoundError: No module named 'distutils'".
*
* The script performs the following actions:
* 1. Checks if Python's distutils module is available
* 2. If missing, offers to install setuptools package which provides distutils
* 3. Attempts installation through pip or pip3
* 4. Provides manual installation instructions if automated installation fails
*
* Usage:
* - Direct execution: node scripts/check-electron-prerequisites.js
* - As npm script: npm run check:electron
* - Before builds: npm run check:electron && electron-builder
*
* Exit codes:
* - 0: All prerequisites are met or were successfully installed
* - 1: Prerequisites are missing and weren't installed
*
* @author [YOUR_NAME]
* @version 1.0.0
* @license MIT
*/
const { execSync } = require('child_process');
const readline = require('readline');
const chalk = require('chalk'); // You might need to add this to your dependencies
console.log(chalk.blue('🔍 Checking Electron build prerequisites...'));
/**
* Checks if Python's distutils module is available
*
* This function attempts to import the distutils module in Python.
* If successful, it means node-gyp will be able to compile native modules.
* If unsuccessful, the Electron build will likely fail when compiling native dependencies.
*
* @returns {boolean} True if distutils is available, false otherwise
*
* @example
* if (checkDistutils()) {
* console.log('Ready to build Electron app');
* }
*/
function checkDistutils() {
try {
// Attempt to import distutils using Python
// We use stdio: 'ignore' to suppress any Python output
execSync('python -c "import distutils"', { stdio: 'ignore' });
console.log(chalk.green('✅ Python distutils is available'));
return true;
} catch (e) {
// This error occurs if either Python is not found or if distutils is missing
console.log(chalk.red('❌ Python distutils is missing'));
return false;
}
}
/**
* Installs the setuptools package which provides distutils
*
* This function attempts to install setuptools using pip or pip3.
* Setuptools is a package that provides the distutils module needed by node-gyp.
* In Python 3.12+, distutils was moved out of the standard library into setuptools.
*
* The function tries multiple installation methods:
* 1. First attempts with pip
* 2. If that fails, tries with pip3
* 3. If both fail, provides instructions for manual installation
*
* @returns {Promise<boolean>} True if installation succeeded, false otherwise
*
* @example
* const success = await installSetuptools();
* if (success) {
* console.log('Ready to proceed with build');
* } else {
* console.log('Please fix prerequisites manually');
* }
*/
async function installSetuptools() {
console.log(chalk.yellow('📦 Attempting to install setuptools...'));
try {
// First try with pip, commonly used on all platforms
execSync('pip install setuptools', { stdio: 'inherit' });
console.log(chalk.green('✅ Successfully installed setuptools'));
return true;
} catch (pipError) {
try {
// If pip fails, try with pip3 (common on Linux distributions)
console.log(chalk.yellow('⚠️ Trying with pip3...'));
execSync('pip3 install setuptools', { stdio: 'inherit' });
console.log(chalk.green('✅ Successfully installed setuptools using pip3'));
return true;
} catch (pip3Error) {
// If both methods fail, provide manual installation guidance
console.log(chalk.red('❌ Failed to install setuptools automatically'));
console.log(chalk.yellow('📝 Please install it manually with:'));
console.log(' pip install setuptools');
console.log(' or');
console.log(' sudo apt install python3-setuptools (on Debian/Ubuntu)');
console.log(' sudo pacman -S python-setuptools (on Arch Linux)');
console.log(' sudo dnf install python3-setuptools (on Fedora)');
console.log(' brew install python-setuptools (on macOS with Homebrew)');
return false;
}
}
}
/**
* Main execution function
*
* This function orchestrates the checking and installation process:
* 1. Checks if distutils is already available
* 2. If not, informs the user and prompts for installation
* 3. Based on user input, attempts to install or exits
*
* The function handles interactive user prompts and orchestrates
* the overall flow of the script.
*
* @returns {Promise<void>}
* @throws Will exit process with code 1 if prerequisites aren't met
*/
async function main() {
// First check if distutils is already available
if (checkDistutils()) {
// All prerequisites are met, exit successfully
process.exit(0);
}
// Inform the user about the missing prerequisite
console.log(chalk.yellow('⚠️ Python distutils is required for Electron builds'));
console.log(chalk.yellow('⚠️ This is needed to compile native modules during the build process'));
// Set up readline interface for user interaction
const rl = readline.createInterface({
input: process.stdin,
output: process.stdout
});
// Prompt the user for installation permission
const answer = await new Promise(resolve => {
rl.question(chalk.blue('Would you like to install setuptools now? (y/n) '), resolve);
});
// Clean up readline interface
rl.close();
if (answer.toLowerCase() === 'y') {
// User agreed to installation
const success = await installSetuptools();
if (success) {
// Installation succeeded, exit successfully
process.exit(0);
} else {
// Installation failed, exit with error
process.exit(1);
}
} else {
// User declined installation
console.log(chalk.yellow('⚠️ Build may fail without distutils'));
process.exit(1);
}
}
// Execute the main function and handle any uncaught errors
main().catch(error => {
console.error(chalk.red('Error during prerequisites check:'), error);
process.exit(1);
});

View File

@@ -0,0 +1,61 @@
/**
* Fix path resolution issues in the Electron build
*/
const fs = require('fs');
const path = require('path');
const glob = require('glob');
// Fix asset paths in HTML file
function fixHtmlPaths() {
const htmlFile = path.join(__dirname, '../dist-electron/index.html');
if (fs.existsSync(htmlFile)) {
let html = fs.readFileSync(htmlFile, 'utf8');
// Convert absolute paths to relative
html = html.replace(/src="\//g, 'src="./');
html = html.replace(/href="\//g, 'href="./');
fs.writeFileSync(htmlFile, html);
console.log('✅ Fixed paths in index.html');
}
}
// Fix asset imports in JS files
function fixJsPaths() {
const jsFiles = glob.sync('dist-electron/assets/*.js');
jsFiles.forEach(file => {
let content = fs.readFileSync(file, 'utf8');
// Replace absolute imports with relative ones
const originalContent = content;
content = content.replace(/["']\/assets\//g, '"./assets/');
if (content !== originalContent) {
fs.writeFileSync(file, content);
console.log(`✅ Fixed paths in ${path.basename(file)}`);
}
});
}
// Add base href to HTML
function addBaseHref() {
const htmlFile = path.join(__dirname, '../dist-electron/index.html');
if (fs.existsSync(htmlFile)) {
let html = fs.readFileSync(htmlFile, 'utf8');
// Add base href if not present
if (!html.includes('<base href=')) {
html = html.replace('</head>', '<base href="./">\n</head>');
fs.writeFileSync(htmlFile, html);
console.log('✅ Added base href to index.html');
}
}
}
// Run all fixes
fixHtmlPaths();
fixJsPaths();
addBaseHref();
console.log('🎉 Electron path fixes completed');

14
scripts/notarize.js Normal file
View File

@@ -0,0 +1,14 @@
// This is a placeholder notarize script that does nothing for non-macOS platforms
// Only necessary for macOS app store submissions
exports.default = async function notarizing(context) {
// Only notarize macOS builds
if (context.electronPlatformName !== 'darwin') {
console.log('Skipping notarization for non-macOS platform');
return;
}
// For macOS, we would implement actual notarization here
console.log('This is where macOS notarization would happen');
// We're just returning with no action for non-macOS builds
};