Electron 在编译版本中不显示图像答案

【问题标题】：Electron does not show images in compiled versionElectron 在编译版本中不显示图像
【发布时间】：2021-10-03 13:27:28
【问题描述】：

我正在尝试解决一个关于电子的问题。

它不显示任何来自css文件的图像，另一方面，它可以在以前的版本中正常显示，无需编译应用程序。

我的项目是如何组织的。

main.js文件（我隐藏了一些无用的信息“宽度、高度...”）

 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这里有我的样式文件，

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

在它的定义中我们有：

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

preload.js (não há nada)

我测试了几种解决方案，例如：

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

我尝试将导入放入所有可能的文件中，但什么也没有。

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"

【问题讨论】：

标签： javascript html css electron

【解决方案1】：

打包应用程序总是与文件路径混淆。
只需使用相对文件路径。

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

请记住，无论您的 html 文件在哪里，它都与您的 css 文件路径相关

【讨论】：