I'm currently troubleshooting an issue related to displaying images using CSS in my electron project.
In the latest version of the application, the images are not showing up when linked from a CSS file. However, in a previous version, the images displayed correctly without needing to compile the application.
I am trying to understand how my project is structured and organized.
main.js file (some details omitted for brevity)
function createWindow () {
win = new BrowserWindow({
//...
webPreferences: {
nodeIntegration: true,
contextIsolation: false,
enableRemoteModule: true,
preload: path.join(__dirname, 'preload.js')
}
})
win.loadFile('index.html')
}
app.whenReady().then(() => {
createWindow()
})
index.html: this is where my stylesheet is linked,
<link rel="stylesheet" type="text/css" href="./css/styles.css">
The CSS definition for the image contains:
.class{
background-image: url('file:///logos/logo_gc.png');}
Additionally, I have a preload.js file (currently empty).
I have tried various solutions such as:
Electron does not show the images not stored when compiling the application
Even after attempting to import the image in multiple files, the issue persists.
Version electron: 12.0.15
Compiler: electron-packager
Command: electron-packager 'path' --overwrite --asar --platform=win32 --arch=x64 --prune=true --out=release-builds --version-string.CompanyName=CE --version-string .FileDescription=CE --version-string.ProductName="Infosac"