Electron-Builder 包含外部文件夹

Posted 2023-03-22

【中文标题】Electron-Builder 包含外部文件夹

【英文标题】：Electron-Builder include external folder

【发布时间】：2020-08-19 07:07:08

【问题描述】：

我正在构建多个电子应用程序，并且有一个用于存放常见图片和文件的目录。我想在使用 electron-builder 构建每个应用程序时包括它们。 docs 推荐 - 如果我理解正确的话 - 将路径添加到 build > files 键，但使用此配置文件似乎不起作用：

"build":
    "files": [
        "**/*",
        "../common/img/*"
    ]

我的目录结构如下：

|git_folder
|-- electronapp1
|---- package.json
|-- electronapp2
|---- package.json
|-- common
|---- img
|---- js
|---- css

我正在尝试使用此 html 代码 <link rel="stylesheet" href="../common/css/master.css"> 访问公共目录。使用electron . 启动它进行调试和开发时，它可以工作，但是在使用electron-builder 构建时，它似乎没有打包公共目录并在控制台中抛出“找不到文件”。

【问题讨论】：

"../common/img/*" 缺少双引号

感谢您指出这一点，但是在我的代码中它是正确的，只是我错过了它的问题。

pakcage.json 内部或外部的构建器配置在哪里？

package.json 的内部

哪个 pakcage.json？都适用于电子应用程序 1、2？

【参考方案1】：

在你的配置中，

"extraResources": [
    
        "from": "../common",
        "to": "common"
    
],
"files": [
  "**/*"
],

所以如果我是你，我会这样配置

const path = require("path");
const appPath = __dirname;
const appResourcePath = path.join(appPath, "..", "common")

module.exports = 
  appPath,
  appResourcePath
;

然后你可以在你的渲染器的任何地方使用这个appResourcePath 比如

<img src=path.join(appResourcePath, 'img', 'background.png')>

那么这将在任何环境中工作。

【讨论】：

感谢您的回答，遗憾的是它不起作用。生成的src标签C:\Users\WDAGUtilityAccount\AppData\Local\Programs\seitenapp\resources\app.asar\common\background.png不存在，app.asar是一个文件。

@creyD path.join(appResourcePath, 'img', 'background.png')

我试过了，但也没有用。我认为这与 app.asar 是一个文件这一事实有关。

@creyD 这个 asar 是一个电子内容文件，可以在里面访问。

Asar 是一种简单的扩展存档格式，它的工作方式类似于 tar，无需压缩即可将所有文件连接在一起，同时支持随机访问。