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

Question

我正在尝试解决有关电子的问题。

它不显示来自 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)

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

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

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"

Answer 1

打包应用程序总是弄乱文件路径。
只需使用相对文件路径。

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

请记住这是相对于您的 css 文件路径的，无论您的 html 文件在哪里

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

Electron does not show images in compiled version

html

javascript

css

electron