Question

我尝试使用电子（用于网站和桌面应用程序）和表达（用于会话等）进行Web应用程序。

现在，我把它作为我的app.js：

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

exp = express();
exp.set('views', __dirname + '/views/');
exp.use(express.static(process.cwd() + '/views'));
exp.get('/', function(req, res) {
    res.render('index', {});
});

function onAppReady() 
{
    mainWindow = new BrowserWindow({
        width: 1080,
        height: 720,
        autoHideMenuBar: true,
        useContentSize: true,
        resizable: false
    });

    mainWindow.loadURL('http://localhost:5000/');
    mainWindow.focus();
    mainWindow.webContents.openDevTools();
}

app.on('ready', onAppReady);

现在，有一些问题：

如果我使用node app.js，我会收到此错误消息：行：app.on('ready', onAppReady);

TypeError：无法读取＆＃39; on＆＃39;未定义的在对象。（/home/josh/chat_program/client/app.js:26:4）在Module._compile（module.js：571：32） at Object.Module._extensions..js（module.js：580：10）在Module.load（module.js：488：32）在tryModuleLoad（module.js：447：12）在Function.Module._load（module.js：439：3）在Module.runMain（module.js：605：10）在运行时（bootstrap_node.js：420：7）在启动时（bootstrap_node.js：139：9）在bootstrap_node.js：535：3
如果我使用electron .，应用程序会启动，但我无法获取请求或网页。我得到的只是没有任何东西的基本HTML（只有doctype HTML HEAD和BODY）。

我搜索了很长时间但却找不到任何东西。

Answer 1

两件事。

首先，我要澄清你的路径设置和用法，更像是这样：

var publicPath = path.resolve(__dirname, '/views');
// point for static assets
app.use(express.static(publicPath));
//view engine setup
app.set('views', path.join(__dirname, '/views/'));

app.engine('html', require('ejs').renderFile);
app.set('view engine', 'html');

其次，我将所有快速代码包装到一个自动执行函数的文件中，因此在需要时它会运行一次。比如我的快递文件，我称之为app.js文件：

(function () {
    'use strict';

    var express = require('express');
    var path = require('path');
    var logger = require('morgan');
    var cookieParser = require('cookie-parser');
    var bodyParser = require('body-parser');
    var routes = require('./routes.js');

    var app = express();
    var publicPath = path.resolve(__dirname, '../dist');
    var port = 3000;

    // point for static assets
    app.use(express.static(publicPath));

    //view engine setup
    app.set('views', path.join(__dirname, '../dist'));
    app.engine('html', require('ejs').renderFile);
    app.set('view engine', 'html');

    app.use(logger('dev'));
    app.use(bodyParser.json());
    app.use(bodyParser.urlencoded({
        extended:true
    }));

    app.use('/', routes);

    app.use(cookieParser());

    var server = app.listen(port, function () {
        console.log('Express server listening on port ' + server.address().port);
    });

    module.exports = app;

}());

然后在我的主文件（我称之为main.js而不是app.js，在我的情况下）中，我实例化应用程序和快速服务器，如下所示：

var app = require('electron').app;
var Window = require('electron').BrowserWindow; // jshint ignore:line
var Tray = require('electron').Tray; // jshint ignore:line
var Menu = require('electron').Menu; // jshint ignore:line
var fs = require('fs');

var server = require('./ServerSide/app');

var mainWindow = null;

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

    var path = require('path');
    var iconPath = path.resolve(__dirname, './dist/myicon.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 Cool App');
    mainWindow.loadURL('http://localhost:3000/');

    // remove this for production
    var template = [
        {
            label: 'View',
            submenu: [
                {
                    label: 'Reload',
                    accelerator: 'CmdOrCtrl+R',
                    click: function(item, focusedWindow) {
                        if (focusedWindow) {
                            focusedWindow.reload();
                        }
                    }
                },
                {
                    label: 'Toggle Full Screen',
                    accelerator: (function() {
                        if (process.platform === 'darwin') {
                            return 'Ctrl+Command+F';
                        } else {
                            return 'F11';
                        }
                    })(),
                    click: function(item, focusedWindow) {
                        if (focusedWindow) {
                            focusedWindow.setFullScreen(!focusedWindow.isFullScreen());
                        }
                    }
                },
                {
                    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();

});

// shut down all parts to app after windows all closed.
app.on('window-all-closed', function () {
    'use strict';
    app.quit();
});

请注意，我在Windows平台上成功使用此功能，因此本示例中列出的任何平台特定项目可能需要进行小的调整。

NodeJS电子带快递

1 个答案: