electron 在ASAR中未找到PNG文件

carvr3hs 于 2023-01-06 发布在 Electron

关注(0)|答案(3)|浏览(193)

我有一个电子（1.7.10）应用程序，报告它无法找到5的7 PNG文件在我的ASAR。所有7 PNG都在同一个文件夹中，其中2个显示在屏幕上罚款。其他5报告网：：ERR_FILE_NOT_FOUND。
img标记的所有src属性都是动态生成的，并且使用相对路径（assets/images/MyImage.png）。如果我解压缩ASAR，我可以看到其中的文件，在正确的文件夹中（由src属性引用）。
如果我使用控制台将浏览器的位置设置为其中一个图像（document.location.href = "file:///path/to/app.asar/dist/assets/images/MyImage.png"），我会得到相同的结果-7个中的2个显示OK。
在打包我的应用程序（与电子建设者），所有的图像显示正确。

electron

来源：https://stackoverflow.com/questions/49614896/png-files-not-found-in-asar

3条答案

按热度按时间

qvk1mo1f1#

让我猜猜，您正在使用react路由器和BrowserRouter构建一个react SPA？
如果是这样，请使用HashRouter。默认情况下，Electron不使用SPA的路由，因为SPA路由会更改，但资源路径始终相对于index.html。

赞(0）回复(0）举报 2023-01-06

pgx2nnw82#

我还没有评估其他答案，但对于我的特殊情况，一个非常有效的解决方案。我不认为这是很好的记录，所以人们仍然遇到这个问题可能是相当常见的。对于我的特殊情况，相关的问题和解决方案在这里确定。
为了解决这个问题，将<base href='./' />添加到index.html（或者任何存放SPA的html文件）中。

- 索引. html**

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8" />
        <base href="./" />
        <link rel="icon" href="%PUBLIC_URL%/favicon.ico" />
        <meta name="viewport" content="width=device-width, initial-scale=1" />
        <meta name="theme-color" content="#000000" />
        <meta
            name="description"
            content="Web site created using create-react-app"
        />
        <meta
            http-equiv="Content-Security-Policy"
            content="script-src 'Self' 'unsafe-inline';"
        />
        <link rel="apple-touch-icon" href="%PUBLIC_URL%/logo192.png" />
        <!--
      manifest.json provides metadata used when your web app is installed on a
      user's mobile device or desktop. See https://developers.google.com/web/fundamentals/web-app-manifest/
    -->
        <link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
        <!--
      Notice the use of %PUBLIC_URL% in the tags above.
      It will be replaced with the URL of the `public` folder during the build.
      Only files inside the `public` folder can be referenced from the HTML.

      Unlike "/favicon.ico" or "favicon.ico", "%PUBLIC_URL%/favicon.ico" will
      work correctly both with client-side routing and a non-root public URL.
      Learn how to configure a non-root public URL by running `npm run build`.
    -->

        <title>React App</title>
    </head>
    <body>
        <noscript>You need to enable JavaScript to run this app.</noscript>
        <div id="root"></div>
    </body>
</html>

赞(0）回复(0）举报 2023-01-06

dsekswqp3#

const path = require('path');

path.join(__dirname, 'assets/images/MyImage.png');

赞(0）回复(0）举报 2023-01-06

我来回答

electron 在ASAR中未找到PNG文件

3条答案

相关问题

热门标签

最新问答