electron - 通过requirejs导入 Electron

Question

我知道那里有很多这样的帖子，但我无法修复它，所以这是我最好的选择。
我正在使用 Electron 为我的 Ionic React 应用程序制作桌面 package 器。
我有一个这样的目录结构:

 > electron
      > src
          - index.ts
          > splashScreen
              - splashScreen.ts
      > assets
          - splash.html
          > scripts
              - splash.js

在 index.ts我创建了一个新的启动画面实例。它从 assets/splash.html 加载 html 文件.
html 包含一个名为 loading_text 的 div 元素。这是启动屏幕的文本需要去的地方。我通过 ipcMain 使用事件控制 div 显示的内容。所以在 SplashScreen.ts , setText功能是这样的:

function setText(text: string) {
    ipcMain.emit(events.SPLASH_SCREEN_TEXT_CHANGE, text)
}

在 splash.js我听这样的事件:

var _ = require("electron");

var on = _.icpMain.on;
on('OL:SPLASH_SCREEN_TEXT_CHANGE', (event, text) => {
    document.getElementById("loading_text").innerHTML = text;
});

这不起作用，因为 require不存在浏览器端。我已经尝试了很多东西，但我仍然无法导入 Electron 。
我开始尝试:

webPreferences: {
      nodeIntegration: true,
}

但它仍然会引发与 require is not defined 相同的错误.我尝试了其他一些东西，主要的是 requireJS .
我把JS文件放在 assets/scripts/下并修改 splash.js对此:

//requirejs.config({
//    baseUrl: '../../node_modules/',
//});


var _ = requirejs(["electron"]);

var on = _.icpMain.on;
on('OL:SPLASH_SCREEN_TEXT_CHANGE', (event, text) => {
    document.getElementById("loading_text").innerHTML = text;
});

这只会引发 Script error for "electron" 的错误.转到 requireJS 文档，它说要检查文件是否有语法错误，但实际上并没有加载文件: Failed to load resource: net::ERR_FILE_NOT_FOUND electron.js:1 我还通读了文档的节点部分，但我对应该放置 require.js 的位置感到困惑。以及将配置放入的脚本(尽管可能是 index.ts )

Answer 1

我设法让它工作。而不是requirejs，我尝试了browserify。我捆绑了splash.js并在html中链接。它引发了以下错误:

fs.existsSync is not a function

我做了一些研究，发现了 this SO post，它不仅说要使用:

webPreferences: {
      nodeIntegration: true,
}

但也可以使用 window.require而不是 require .完成此操作后，我能够在脚本中导入 Electron 。