CODEWITHSUNDEEP
javascripthtmlcsselectron
rick
rick

Reputation: 751

Electron does not show images in compiled version

I'm trying to solve a problem about the electron.

It doesn't show any image coming from a css file, on the other hand, it can show it normally in a previous version, without compiling the application.

How my project is organized.

main.js file (I hid some useless information "width, height...")

 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 here I have my style file,

<link rel="stylesheet" type="text/css" href="./css/styles.css">

in its definition we have:

.class{
background-image: url('file:///logos/logo_gc.png');}

preload.js (não há nada)

I tested several solutions such as:

Electron does not show the images not stored when compiling the application

I tried to put the import in all possible files and nothing.

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"

Upvotes: 1

Views: 2042

Answers (1)

cachique
cachique

Reputation: 1271

Packaging apps always messes with the file paths.
Just use relative file paths.

.class{
background-image: url('../logos/logo_gc.png');}

Remember that is relative to your css file path no matter where is your html file

Upvotes: 2

Related Questions