Проблемы при создании приложения автозапуска Electronjs

Question

Проблемы при создании приложения автозапуска Electronjs

npm init
npm install electron-prebuilt --save-dev
Create index.js
npm install electron-packager --save-dev
npm run build OR electron-packager . --all

Я использовал эти шаги для создания приложения Electronjs в прошлом и поместил его исполняемый файл в стартовую папку, чтобы запустить его при запуске системы. Но, после обновления Windows, есть некоторые проблемы, возникающие, когда я запускаю приложение в tabmode. Итак, я планировал создать новое приложение, но эти команды не работают идеально. У меня проблемы с этим.

Итак, что я хочу точно попытаться сделать: создать auto-launch electron app, Кто-нибудь может предоставить мне правильные шаги, поскольку я получаю ошибки с шагами, которые я предоставил?

Заранее спасибо.

5

javascript node.js electron electron-builder electron-packager

Источник

user8317956 16 авг '17 в 13:04

1 ответ

Другие вопросы по тегам javascript node.js electron electron-builder electron-packager

user8317974 15 сен '17 в 11:28 2017-09-15 11:28 · Answer 1 · 2017-09-15 11:28

Шаги по созданию электронного приложения

Команды:

npm install electron-prebuilt -g

Проект Electron требует три файла:

index.html: веб-страница отображается по умолчанию.
main.js: запускает приложение и создает окно браузера для визуализации HTML.
package.json: список зависимостей приложения, метаданных и необходимых файлов.

package.json и добавьте следующее:

{
  "name": "hero-browser",
  "version": "0.1.0",
  "main": "main.js",
  "dependencies": {
    "dotenv": "^2.0.0",
    "md5": "^2.1.0"
  }
}

'use strict';

const electron = require('electron');
const app = electron.app;  // Module to control application life.
const BrowserWindow = electron.BrowserWindow;  // Module to create native browser window.
var mainWindow = null;

app.on('window-all-closed', function() {
    if (process.platform != 'darwin') {
        app.quit();
    }
});


app.on('ready', function() {
  mainWindow = new BrowserWindow({width: 800, height: 600});
  mainWindow.loadURL('file://' + __dirname + '/app/index.html');

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

Приложение / index.html

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>Marvel Super Hero Browser</title>
    <link href="css/index.css" rel="stylesheet" type="text/css"/>
</head>
<body>
    <h1>Marvel Super Hero Browser</h1>
    <em>Thanks to Marvel for their API.</em>

    <div id="character_list"></div>

    <script src="js/index.js"></script>
</body>
</html>

pp / css / index.css и добавьте несколько базовых CSS для помощи в разметке.

#character_list .character img {
    width: 100px;
}

.character {
    float: left;
    padding: 25px;
    max-width: 100px;
}

приложение / JS / index.js.

Это будет где большая часть функциональности приложения имеет место. Начните с настройки зависимостей и необходимых переменных:

'use strict';

require('dotenv').config();
var md5 = require('md5');
var publicKey = process.env.MARVEL_PUBLIC_KEY;
var privateKey = process.env.MARVEL_PRIVATE_KEY;
var ts = String(new Date().getTime());
var hash = md5(ts+privateKey+publicKey);

var url = `https://gateway.marvel.com/v1/public/characters?ts=${ts}&apikey=${publicKey}&hash=${hash}&limit=25`;