Electron + node.jsの開発環境構築と新規プロジェクト作成(Windows)

Electron + node.jsの開発環境構築と新規プロジェクト作成(Windows)

前提

npm,nodeはインストールされているものとします。

新規プロジェクト作成

nodeのプロジェクト作成します。

npm init -y
npm i --save-dev electron

electronはグローバルインストールでなくて大丈夫です。

Quick Start | Electron

This guide will step you through the process of creating a barebones Hello World app in Electron, similar to electron/el...

electronjs.org

クイックスタートにある通り、メインプロセスをmain.jsとし、index.htmlをロードします。

package.json

npm scriptsに"start": "electron ."と記述します。

{
  "name": "create-app",
  "version": "1.0.0",
  "description": "",
  "main": "main.js",
  "scripts": {
    "start": "electron ."
  },
  "keywords": [],
  "author": "",
  "license": "ISC",
  "devDependencies": {
    "electron": "^11.1.0"
  }
}

これで、npm startとタイプすればアプリが起動します。

次回はパッケージングしてEXEファイルを作成してみます。

高橋

KHI入社して退社。今はCONFRAGEで正社員です。関西で140-170/80～120万から受け付けております^^
得意技はJS(ES6),Java,AWSの大体のリソースです
コメントはやさしくお願いいたします^^
座右の銘は、「狭き門より入れ」「願わくは、我に七難八苦を与えたまえ」です^^