Electron Primer App Pack exe (Windows)

Recently learning Nodejs, I learned that electron is a technology for building cross-platform desktop applications with HTML,CSS and JavaScript by merging chromium and node. js into the same runtime environment. I can't wait to "taste fresh" for the previous development of the Flash Air desktop application.

First, we followed the electron Community's QuickStart program (Https://electronjs.org/docs/tutorial/quick-start) to create my first electron App (HelloWorld).

1. Install the global electron in the command line:

NPM install-g Electron

Ps: Before this you need to install NODEJS,NPM.

2. Referring to the starter program, the app is created and the package is as follows:

We have a global installation of electron, how to run the app?

Open the command line in the current window and enter the following command:

Electron.

App created successfully! Do not worry, the focus of this lecture is to introduce how to package into an EXE (tossing my big half a day), read a lot of other people about the packaging blog, may be a beginner to understand not enough in-depth, I think is not so easy to understand, so ready to strike, write a share to the back of the study people. Anyway

3. Install the packaging tool, which I used electron-packager , first to install globally:

NPM Install Electron-packager-g

4. Before packaging need to install the dependency in the current app (above the operation is the use of electron, the global command, packaging needs to install their own dependencies in the app, and then called local dependencies), the current app relies on only electron, at the command line execution:

Electron-v

Gets the version number of the current electron global installation.

5. Edit PACKAGE.JSON,NPM Installation Local dependencies:

NPM Install

6. Test if the local dependencies are successful, execute the command line in the app root directory:

NPM start

The program runs and local dependencies are successfully installed.

7. Make icon:icon.ico,256*256 for the current app before packaging. Make it into the app root directory.

8.electron-packager Packaging: Electron-packager packaged in two ways, one is directly on the command line to edit the command, directly packaged. The other is to edit the package in Package.json and execute the NPM run-script package.

(1) Execute the command line in the app root directory:

Electron-packager. ' HelloWorld '--platform=win32--arch=x64--icon=icon.ico--out=./out--asar--app-version=0.0.1

Packaged successfully.

(2) First edit the Package.json,

Create an app folder in the app (Electron-helloworld) root directory and put main.js , index.html andpackage.json拷贝进去（拷贝并非剪切），然后在electron-helloworld根目录打开命令行：

NPM Run-script Package

Packaged into success.

Summary: For Electron-packager of the second packaging method (edit Package.json packaging method), why to build the app folder, is by looking at other people's blog and multiple tests to get the conclusion, because it is a beginner, for the moment think is a mechanism, hope that through the back of the study to more profound understanding of the inside Implications.

Electron Primer App Pack exe (Windows)