未定义从渲染过程中要求电子对话

Question

我正在使用电子并试图在用户单击按钮时打开文件浏览器。在渲染过程中，我试图像这样包含 elctron.dialog 包。

const dialog = require( 'electron' ).dialog;

console.log( dialog );

但是控制台日志的结果是undefined

我绝对确定我正在渲染过程中，所以我不确定为什么这不起作用。文档表明这是正确的做事方式，但它似乎不起作用。

这是我的 package.json 文件

{
  "name": "my-app",
  "version": "0.1.0",
  "main": "./main.js",
  "scripts": {
    "start": "electron ."
  },
  "dependencies": {
    "electron": "^0.4.1"
  }
}

这是我的 main.js 文件

    'use strict';

    var app = require( 'app' );
    var BrowserWindow = require( 'browser-window' );
    var ipc = require( 'ipc' );

    var mainWindow = null;

    app.on(
        'ready', function () {
            mainWindow = new BrowserWindow(
                {
                    frame : true,
                    height: 700,
                    width : 500
                }
            );

            mainWindow.loadUrl( 'file://' + __dirname + '/app/index.html' );

            mainWindow.openDevTools();
            mainWindow.on(
                'closed', function () {
                    mainWindow = null;
                }
            );

        }
    );

    ipc.on(
        'close-main-window', function () {
            app.quit();
        }
    );

这是渲染过程文件

    // Add your index.js code in this file
    var ipc = require( 'ipc' );

    const dialog = require( 'electron' ).dialog;

    console.log( dialog );

这是控制台

这不正确吗？

Answer 1

在Renderer进程上，必须使用Remote模块。

const dialog = require('electron').remote.dialog

更多信息：
Electron Dialog API
Electron Remote API

Answer 2

经过几个小时的研究 someone else 向我指出 "new" 方法 (4/15/16) 如下所示。

var remote = require('remote');
var dialog = remote.require('dialog');

dialog.showOpenDialog({ 
  properties: [ 'openFile' ] }, function ( filename ) {
    console.log( filename.toString() );
  }
);

您必须要求 remote 然后从远程要求对话框。看起来你不再需要 require electron

Answer 3

此代码在 html 文件的脚本中有效：

const remote = require('electron').remote 

const dialog = remote.dialog;

dialog.showErrorBox('Error title', 'error')

Answer 4

Electron 在最新版本中更改了模块的获取方式。模块封装在电子名称 space.

中

// for getting the electrons modules here the new method now i'm using 1.7.12 Electron version (i don't know what that will be in the future)
// you require electron first! it's a name space (module)
var electron = require("electron");
var remote = electron.remote; // you get all the subModuls directly as property (cool incapsulation)
//remote = require("remote") ===> will not work!!!!

// for dialog it's the same !! but we now use remote as modul
var dialog = remote.dialog;

您也可以使用这种语法，以更少的编写导入多个模块并将它们聚集在一起：

var {remote, ipcRenderer, someOtherModulFromElectron} = electron;

例如在main.js（主进程）中我们可以写这样一个调用：

const electron = require('electron')
const {app, BrowserWindow, Menu} = electron;

代替：

const electron = require('electron')

// Module to control application life.
const app = electron.app

// Module to create native browser window.
const BrowserWindow = electron.BrowserWindow

//modul for bar menu
const Menu = electron.Menu

Answer 5

对我来说是因为我在使用 node index.js。相反，在 package.json:

中使用 npm start

  "scripts": {
    "start": "electron index.js"
  },

Answer 6

根据https://github.com/electron/remote
远程模块在 Electron 12 中被弃用，@electron/remote 是替代品。

$ npm install --save @electron/remote

在main.js中：

require('@electron/remote/main').initialize()

我还必须为 BrowserWindow

设置一些 webPreferences

  mainWindow = new BrowserWindow({
    width: 800,
    height: 600,
    webPreferences: {
      nodeIntegration: true,
      enableRemoteModule: true,
      contextIsolation: false,
      preload: path.join(__dirname, 'preload.js')
    }
  })

在renderer.js中：

const {dialog} = require('@electron/remote')

function showError() {
    dialog.showErrorBox(...)
}

之后 dialog 为我工作。

Answer 7

我很惊讶 none 的答案竟然提到了这一点，但由于 remote 模块已被删除，最好不要将用户区 remote 用于各种讨论的原因 here，您需要使用 ipc 让主进程显示对话框。

renderer.js:

const { ipcRenderer } = require("electron");
ipcRenderer.invoke("showDialog", "message");

main.js:

const { ipcMain, dialog } = require("electron");
ipcMain.handle("showDialog", (e, message) => {
    dialog.showMessageBox(mainWindow, { message });
});

未定义从渲染过程中要求电子对话

Requiring electron dialog from render process is undefined

javascript

electron