CODEWITHSUNDEEP
electron
Dormage
Dormage

Reputation: 45

Electron packaged for win32 does not work

I've been playing around with Electron and AngularJS and built a simple app. If I run it with electron it works as expected. After using electron-packager to package the app into a win32 executable It does not work anymore. (Opens white window and that's it).

Is there anyway to see some debug when packaged? I don't know what's wrong, the only thing that I might have done "wrong" is include some external CDN libraries. Is that allowed in Electron or must I install everything with node?

Upvotes: 0

Views: 516

Answers (1)

Kim Gentes
Kim Gentes

Reputation: 1628

To debug effectively in Electron, you have to turn on browser embedded developer tools inside the main.js file of your app, then access them once electron launches. For example, below is some code which will load your app and turn on a menu with a sub-menu that launches developer tools for Chrome (or via the shortcut defined herein as Ctrl-Shift-I for Windows). 

app.on('ready', function () {
    'use strict';

    var path = require('path');
    var iconPath = path.resolve(__dirname, './dist/app.ico');
    const appIcon = new Tray(iconPath);
    mainWindow = new Window({
        width: 1280,
        height: 1024,
        autoHideMenuBar: false,
        useContentSize: true,
        resizable: true,
        icon: iconPath
        //  'node-integration': false // otherwise various client-side things may break
    });
    appIcon.setToolTip('My App');
    mainWindow.loadURL('http://localhost:3000/');

    var template = [
        {
            label: 'View',
            submenu: [
                {
                    label: 'Toggle Developer Tools',
                    accelerator: (function() {
                        if (process.platform === 'darwin') {
                            return 'Alt+Command+I';
                        } else {
                            return 'Ctrl+Shift+I';
                        }
                    })(),
                    click: function(item, focusedWindow) {
                        if (focusedWindow) {
                            focusedWindow.toggleDevTools();
                        }
                    }
                },
            ]
        }
    ];


    var menu = Menu.buildFromTemplate(template);
    Menu.setApplicationMenu(menu);

    mainWindow.focus();

});

Upvotes: 1

Related Questions