[英]How to modify the folder structure of app.asar when using electron-builder?
I am using create-react-app (CRA) to create and build my frontend code.我正在使用 create-react-app (CRA) 创建和构建我的前端代码。 My (simplified) folder structure looks like this:
我的(简化的)文件夹结构如下所示:
package.json
node_modules/
public/
└── electron.js
└── index.html
src/
My npm scripts:我的 npm 脚本:
"build": {
"appId": "com.somedomain.app",
},
"scripts": {
"react-start": "react-scripts start",
"react-build": "react-scripts build",
"react-test": "react-scripts test --env=jsdom",
"react-eject": "react-scripts eject",
"electron-build": "electron-builder",
"release": "yarn react-build && electron-builder --publish=always",
"build": "yarn react-build && yarn electron-build"
}
When I run "build", the project is built and there's a build
folder with everything in it, which is then used by electron to create the app.asar
file.当我运行“构建”时,项目被构建并且有一个包含所有内容的
build
文件夹,然后 electron 使用它来创建app.asar
文件。 When I extract the contents, I see following structure:当我提取内容时,我看到以下结构:
package.json
node_modules/
build/
└── electron.js
└── index.html
How did electron-builder know to take the build
folder from my project folder? electron-builder 是如何知道从我的项目文件夹中获取
build
文件夹的? I tried figuring it out by playing with the "build"
field of my package.json like so:我尝试通过使用 package.json 的
"build"
字段来解决这个问题:
"build": {
"appId": "com.somedomain.app",
"files": "app"
},
and renamed my build
folder to app
but then I get the following error:并将我的
build
文件夹重命名为app
但随后出现以下错误:
⨯ Application entry file "build\electron.js" in the "[redacted][\app.asar" does not exist. Seems like a wrong configuration.
It seems as though electron still tries to run electron.js
from the build
folder, which now doesn't exist in app.asar
.似乎 electron 仍然尝试从
build
文件夹运行electron.js
,该文件夹现在在app.asar
中不存在。
How can I modify the file structure in the app.asar
file?如何修改
app.asar
文件中的文件结构? Does it have to contain a build
folder?它是否必须包含
build
文件夹? Ideally, I'd like have the following structure:理想情况下,我希望具有以下结构:
package.json
node_modules
electron/
└── electron.js
frontend
└── index.html
I tried modifying the "files"
field some more, I tried "extraFiles"
and "buildResources"
but even if I can get the folder structure inside of app.asar
the way I want it, I continue to get the error:我尝试更多地修改
"files"
字段,我尝试了"extraFiles"
和"buildResources"
,但即使我可以按照我想要的方式获取app.asar
中的文件夹结构,我仍然会收到错误:
⨯ Application entry file "build\electron.js" in the "[redacted][\app.asar" does not exist. Seems like a wrong configuration.
I found out what was the problem was.我发现了问题所在。 Apparently, when electron-builder sees that react-scripts are in the dependencies it automatically uses a built-in configuration called react-cra.
显然,当 electron-builder 看到 react-scripts 在依赖项中时,它会自动使用一个名为 react-cra 的内置配置。 The build-in configuration for react-cra looks like this:
react-cra 的内置配置如下所示:
directories: {
buildResources: "assets"
},
files: ["build/**/*"],
extraMetadata: {
main: "build/electron.js"
}
the extraMetadata
field is what caused the extraMetadata
字段是导致
⨯ Application entry file "build\electron.js" in the "[redacted][\app.asar" does not exist. Seems like a wrong configuration.
error.错误。
To prevent using the the react-cra built-in configuration, one can add "extends": null
in their package.json's "build"
field.为了防止使用 react-cra 内置配置,可以在 package.json 的
"build"
字段中添加"extends": null
。 With the following configuration I got the desired result:通过以下配置,我得到了想要的结果:
"build": {
"appId": "io.gueney.app",
"extends": null,
"files": [
"electron/**/*",
"frontend/**/*"
]
},
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.