【问题标题】:How to get Electron-builder to package non-code files for the installer to install them in the user home directory (app-data)如何让 Electron-builder 为安装程序打包非代码文件以将它们安装在用户主目录(app-data)中
【发布时间】:2020-11-25 22:31:49
【问题描述】:

我想要完成的事情:

我想了解如何配置 Electron-Builder/Webpack 以打包非代码文件(配置文件、XML 文件、元数据文件、JSON 文件),以便在安装程序安装应用程序时这些文件将保存在本地计算机上的用户主目录。我明白将这些文件存储在已安装的二进制文件之外的重要性,因此当用户更新他们的版本时,他们不会丢失他们可能已经设置的任何自定义。但是这些文件的初始版本必须从某个地方开始,例如这些文件的模板版本。

我找到了一些教程来解释如何将这些非代码文件作为包的一部分包含在内: Electron - How to add external files?

How to manage configuration for Webpack/Electron app?

但是我从这些帖子中没有看到或理解的是如何配置安装程序,以便在它运行时,这些文件将被复制到用户主目录(appData 文件夹)。特别是如果这些文件已经安装以避免覆盖它们或询问用户是否要覆盖它们?如何设置?

还必须进行一些配置设置,以允许这些文件保留在 Github 存储库中,并使开发人员能够使用这些非代码文件的开发路径,同时不会破坏安装用户上这些文件的生产路径版本。如何设置这种配置?

这是我项目中的文件夹结构:

src
 - Application
    - electronVueJS-App
       - application.js
       - App.vue
       - build.js
       - registerServiceWorker.js
       - ...Rest of the files/folders for the application....
       - Resources
          - Configuration
             - Colors.csv
             - Configuration.xml
 - Framework
    - CommandsBlob
       - commands.xml
    - Workflows
       - workflows.xml
    - ....Rest of my code files/folders....

我想第 1 步可能会让我将所有非代码 XML 文件移动到至少 2 个文件夹中,一个在 Application 文件夹中,另一个在 Framework 文件夹中,我准备这样做,但我想了解所有这些 Electron-Builder/WebPack/Installer 配置的设置方式,以便在我重新构建我的架构之前,将配置文件安装在其本地系统上的用户主目录路径中应用代码。

我想还有其他问题,但我想我可以尝试单独解决这些问题,如果我遇到另一个阻止程序,然后再提交另一个问题。但是,如果您有可以帮助我的链接,请务必分享。

设置自动更新程序后,如何告知用户特定更新是否需要对其配置文件进行重大更改。

如何设置卸载程序,以便用户可以选择在卸载过程后保持配置文件不变,或继续删除所有内容?

我的回购: https://github.com/SethEden/electronVueJS-App/

感谢您的帮助!!

更新:

我已经清除了上述 repo 的代码库并返回到一个非常基本的配置来尝试让它工作。我发现 NSIS 是为 Electron 应用程序构建 Windows 安装程序的工具。我正在尝试遵循本教程:

https://youtu.be/QowWa3aVCQw

当我尝试将 NSIS 构建目标添加到我的 package.json 时,我从 Electron-Builder 收到与 VueJS 相关的错误,并告诉我将构建移动到 Vue.config.js 文件中。

所以我这样做了,现在我收到了这个错误:

(node:16532) UnhandledPromiseRejectionWarning:
Error: cannot find specified resource "LICENSE",
nor relative to "C:\electronVueJS-App\build",
neither relative to project dir ("C:\electronVueJS-App")

我什至尝试从我的 vue.config.js 文件中的构建定义中完全删除许可证,但现在我的 NSIS 安装程序没有许可证。此外,更重要的是,如果我什至无法在我的构建配置中指定 NSIS 许可证文件,我怎么能指定将非代码文件添加到我的构建中?更重要的是,我将如何告诉 NSIS 将它们安装在用户本地安装系统路径上的用户 AppData 文件夹中?

有人可以帮我解决这个问题吗?我对被这个问题卡住感到非常沮丧。

谢谢你和干杯 ~赛斯

【问题讨论】:

    标签: webpack installation electron uninstallation electron-builder


    【解决方案1】:

    假设您在 src 目录中有一个 user.config 文件,并且您想将其放在 APPDATA 目录中。 p>

    1. 首先你需要打包这个文件。它可以做为 如下:

      "build": {
          "extraFiles": [
            {
             "from": "./src/user.config",
             "to": "."
            }
          ]
       }
      

      这会将 user.config 文件放在 打包源码。

    2. 现在我们需要告诉安装程序将此文件放入 APPDATA 目录。为此,我们需要编写一个自定义 nsis 脚本。你可以 将此脚本放在构建文件夹中。

      "build": {
            "extraFiles": [
               {
                  "from": "./src/user.config",
                  "to": "."
               }
             ]
       },
       "nsis": {
            "include": "build/installer.nsh"
       }
      

      installer.nsh 的内容应如下所示:

      !macro customInstall
        CreateDirectory $LOCALAPPDATA\*(YOUR_APP_NAME)*
        CopyFiles $INSTDIR\user.config $LOCALAPPDATA\*(YOUR_APP_NAME)*
        Delete $INSTDIR\user.config
      !macroend
      

      阅读更多关于这个here

    此外,为了在源文件中获取 APPDATA 路径,您可以这样获取:

    process.env.LOCALAPPDATA
    

    【讨论】:

    • 非常感谢您的回答!这对我帮助很大!!很抱歉,在赏金到期之前我没有回到这个问题上。我和我的妻子有一个寄养的孩子进了家,学校同时开始了,我的主板被炸了,我不得不订购所有新零件。不用说这是一个超级忙碌的几个星期!我会看看我是否可以 ping 管理员并给你一些分数,你应该得到它提供如此详细的答案! :-D 再次感谢您!
    • 我们有其他操作系统和安装程序的等效解决方案吗? (MacOS Linux)
    • @Ali Raza,我想它会解决只有 windows 的问题,而不是 mac,因为 .nsh 文件适用于 win 安装程序。
    • 在详细了解了 NSIS 解决方案并再次详细了解了我自己的应用程序之后,我决定尝试推出自己的安装程序。因此,该应用程序无需安装即可运行,但随后会有一个自行安装的命令,或者询问用户是否愿意安装它。还有另一个选项是询问用户是否愿意自动更新等。我必须开始详细说明整个过程。 :-D
    猜你喜欢
    • 2021-04-22
    • 2018-09-27
    • 2017-01-29
    • 2018-08-30
    • 2016-07-23
    • 2014-11-14
    • 2021-10-14
    • 2019-07-26
    • 2011-11-29
    相关资源
    最近更新 更多