无法阅读属性'格式'未定义 - 在Mac上构建 - 用Electron打开prog - Ionic 2

时间:2017-08-15 15:54:36

标签: ionic-framework ionic2 electron ionic3

如果我想构建我的应用程序,那就是Ionic 2和Electron用于获取本机节点模块。如果我想构建程序并打开它,我会收到此错误。

构建时记录文件:

electron-builder 19.22.1
Rebuilding native production dependencies for darwin:x64
Packaging for darwin x64 using electron 1.6.11 to dist/mac
⚠️  Application icon is not set, default Electron icon will be used
⚠️  App is not signed: cannot find valid "Developer ID Application" identity or custom non-Apple code signing certificate, see https://github.com/electron-userland/electron-builder/wiki/Code-Signing

All identities:
  1) 6C3F7754F6D009926038537F387FAB2791787B78 "com.apple.idms.appleid.prd.4d4f32455a31724551527a61443857327430692b61773d3d"
  2) AC427E392FE8EB003E7D5A19C841FC82BEC52A25 "iPhone Developer: philipp.fock@icloud.com (Y5UY9Y69QB)"
     2 identities found

  Valid identities only
  1) 6C3F7754F6D009926038537F387FAB2791787B78 "com.apple.idms.appleid.prd.4d4f32455a31724551527a61443857327430692b61773d3d"
  2) AC427E392FE8EB003E7D5A19C841FC82BEC52A25 "iPhone Developer: philipp.fock@icloud.com (Y5UY9Y69QB)"
     2 valid identities found
Building macOS zip
Building DMG
⚠️  Application icon is not set, default Electron icon will be used

这是我在electron.js中的代码:

'use strict';
const electron = require('electron');
//const electronprinter = require('electron-printer');
// Module to control application life.
const {
    app } = electron;
// Module to create native browser window.
const {
    BrowserWindow
} = electron;

const {ipcMain} = require('electron');

const electronPrinter = require('printer');

const fs = require('file-system');

var imagemagick;

try {
    imagemagick = require('imagemagick');
} catch(e) {
    throw 'please install imagemagick-native: `npm install imagemagick-native`'
}


let win;

function createWindow() {
    // Create the browser window.
    win = new BrowserWindow({
        width: 1024,
        height: 600
    });

    var url = process.env.E_URL || url.format({
        pathname: path.join(__dirname, '/../www/index.html'),
        protocol: 'file:',
        slashes: true
    });

    // and load the index.html of the app.
    win.loadURL(url);

    // Open the DevTools.
    win.webContents.openDevTools();

    // Emitted when the window is closed.
    win.on('closed', () => {
        // Dereference the window object, usually you would store windows
        // in an array if your app supports multi windows, this is the time
        // when you should delete the corresponding element.
        win = null;
});
}

ipcMain.on('get-printers', (event, arg)=> {
    console.log("ping");
    var printers = electronPrinter.getPrinters();
    console.log(printers);
    event.sender.send('get-printers-response', printers);
});

ipcMain.on('print-pdf', (event, arg) => {
    console.log(arg.pdf);
    console.log(arg.printer);
    try {
        var buf;
        if (typeof Buffer.from === "function") {
            // Node 5.10+
            buf = Buffer.from(arg.pdf, 'base64'); // Ta-da
        } else {
            // older Node versions
            buf = new Buffer(arg.pdf, 'base64'); // Ta-da
        }
        console.log("hello");

        electronPrinter.printDirect({
                data: buf,
                printer: arg.printer,
                type: 'PDF',
                success: function (id) {
                    console.log('printed with id ' + id);
                },
                error: function (err) {
                    console.error('error on printing: ' + err);
                }
        });
    } catch(e) {
        console.log(e);
        console.log(e.message);
    }

});

// This method will be called when Electron has finished
// initialization and is ready to create browser windows.
// Some APIs can only be used after this event occurs.
app.on('ready', createWindow);

// Quit when all windows are closed.
app.on('window-all-closed', () => {
    // On OS X it is common for applications and their menu bar
    // to stay active until the user quits explicitly with Cmd + Q
    if (process.platform !== 'darwin') {
        app.quit();
    }
});


app.on('activate', () => {
    // On OS X it's common to re-create a window in the app when the
    // dock icon is clicked and there are no other windows open.
    if (win === null) {
        createWindow();
    }
});

你可以看到。我使用本机节点模块打印机。 然后我的起始站点是生成的Ionic2浏览器代码的index.html。

这是我的package.json:

{
  "name": "benutzerPanel",
  "version": "0.0.1",
  "author": {
    "name": "Philipp Fock"
  },
  "homepage": "http://ionicframework.com/",
  "private": true,
  "scripts": {
    "dev": "nf start",
    "start": "ionic-app-scripts serve",
    "electron dist": "electron .",
    "ebuild": "yarn run build && node_modules/.bin/build",
    "postinstall": "electron-builder install-app-deps",
    "clean": "ionic-app-scripts clean",
    "build": "ionic-app-scripts build",
    "lint": "ionic-app-scripts lint",
    "ionic:build": "ionic-app-scripts build",
    "ionic:serve": "ionic-app-scripts serve"
  },
  "dependencies": {
    "@angular/common": "4.1.3",
    "@angular/compiler": "4.1.3",
    "@angular/compiler-cli": "4.1.3",
    "@angular/core": "4.1.3",
    "@angular/forms": "4.1.3",
    "@angular/http": "4.1.3",
    "@angular/platform-browser": "4.1.3",
    "@angular/platform-browser-dynamic": "4.1.3",
    "@ionic-native/core": "3.12.1",
    "@ionic-native/printer": "^4.1.0",
    "@ionic-native/splash-screen": "3.12.1",
    "@ionic-native/status-bar": "3.12.1",
    "@ionic/storage": "2.0.1",
    "cordova-browser": "^4.1.0",
    "cordova-plugin-console": "^1.0.5",
    "cordova-plugin-device": "^1.1.4",
    "cordova-plugin-splashscreen": "^4.0.3",
    "cordova-plugin-statusbar": "^2.2.2",
    "cordova-plugin-whitelist": "^1.3.1",
    "de.appplant.cordova.plugin.printer": "^0.7.3",
    "file-system": "^2.2.2",
    "imagemagick": "^0.1.3",
    "ionic-angular": "3.5.3",
    "ionic-plugin-keyboard": "^2.2.1",
    "ionicons": "3.0.0",
    "lodash": "^4.17.4",
    "ngx-electron": "^1.0.3",
    "node-printer": "^1.0.2",
    "printer": "^0.2.2",
    "rxjs": "5.4.0",
    "sw-toolbox": "3.6.0",
    "zone.js": "0.8.12"
  },
  "devDependencies": {
    "@ionic/app-scripts": "2.0.2",
    "@ionic/cli-plugin-cordova": "1.6.2",
    "@ionic/cli-plugin-ionic-angular": "1.4.1",
    "@types/electron": "^1.4.34",
    "electron": "^1.6.2",
    "electron-builder": "^19.22.1",
    "foreman": "^2.0.0",
    "ionic": "3.7.0",
    "typescript": "2.3.4"
  },
  "description": "DPos",
  "main": "electron/electron.js",
  "config": {
    "ionic_bundler": "webpack",
    "ionic_webpack": "./config/webpack.config.js"
  },
  "build": {
    "appId": "com.banana.Pos",
    "electronVersion": "1.6.11",
    "asar": true,
    "files": [
      "www/**/*",
      "electron/*"
    ]
  },
  "cordova": {
    "plugins": {
      "de.appplant.cordova.plugin.printer": {},
      "cordova-plugin-console": {},
      "cordova-plugin-device": {},
      "cordova-plugin-splashscreen": {},
      "cordova-plugin-statusbar": {},
      "cordova-plugin-whitelist": {},
      "ionic-plugin-keyboard": {}
    },
    "platforms": [
      "browser"
    ]
  }
}

1 个答案:

答案 0 :(得分:0)

我认为您的问题在于此处的阻止

 var url = process.env.E_URL || url.format({
    pathname: path.join(__dirname, '/../www/index.html'),
    protocol: 'file:',
    slashes: true
});  

我猜您正在将js脚本中的环境变量process.env.E_URL设置为http://localhost:{port}。在启动开发服务器时这很好,但在电子构建期间打包应用程序时却没有。此变量不会永久设置。

尝试将以下内容添加到electron.js文件的顶部。

const path = require('path')
const url_lib = require('url')  

然后将您设置电子BrowserWindow的网址的位置更改为以下内容。

 var url = process.env.E_URL || url_lib.format({
pathname: path.join(__dirname, '/../www/index.html'),
protocol: 'file:',
slashes: true
});  

这应该可以解决问题。问题是在电子构建期间url未定义。