Use electron-packager to package exe programs

1. Installation electron-packager

PS: Before installation, copy a package.json file to the ./app directory, and then change the path of "main": "app/main.js" in package.json in the ./app directory (remove app/) , if this is not the case, an error will be reported when the package is packaged below, and some versions cannot identify the application path.

1. Use the command  npm install --save-dev electron-packager 
to install the electron-package package under the project. 
write picture description here 
After the installation is complete, there will be an additional version number configuration information of the electron-package in the package.json file under the project root directory. 
write picture description here

 
2. There are two methods  for formal packaging
: 1. Directly use the command to package. The basic packaging commands of electron-packager are:

electron-packager <location of project> <name of project> <platform> <architecture> <electron version> <optional options>
  • 1

Command description: 
* location of project: the path where the project is located 
* name of project: the name of the packaged project 
* platform: determines which platform you want to build the application (Windows, Mac or Linux) 
* architecture: determines whether to use x86 or x64 or both All architectures use 
* electron version: the version of electron 
* optional options: optional options

The command is relatively long, it will be very annoying to use this command to package every time, you can use the second method;

2. First add code to package.json under the project root directory, 
"packager": "electron-packager ./app HelloWorld --all --out ./OutApp --version 1.4.0 --overwrite --icon=./app/img/icon/icon.ico"

PS: It should be noted here that the project name, version, and icon path in the field should be changed to your own; the 
specific addition location is as shown in the figure, 
write picture description here

Then, after using the command npm run-script packager 
write picture description here

最后,打包完成之后如图 
write picture description here 
运行对应包下的.exe文件,就可以看到我们的应用了。

转载自http://blog.csdn.net/arvin0/article/details/52690023

参数设置可参考下面,也是转载自某网友

 

[html]  view plain  copy
 
  1. {  
  2.   "name": "hosts",  
  3.   "version": "2.0.1",  
  4.   "description": "",  
  5.   "main": "main.js",  
  6.   "scripts": {  
  7.     "start": "concurrently \"NODE_ENV=dev electron .\" \"webpack-dev-server --inline --hot --port 8080\"",  
  8.     "packageDarwin": "electron-packager . 'Hosts' --platform=darwin --arch=x64 --icon=hosts.icns --out=./dist --asar --app-version=2.0.1 --ignore=\"(dist|src|docs|.gitignore|LICENSE|README.md|webpack.config*|node_modules)\"",  
  9.     "packageWin": "electron-packager . 'Hosts' --platform=win32 --arch=x64 --icon=hosts.ico --out=./dist --asar --app-version=2.0.1 --ignore=\"(dist|src|docs|.gitignore|LICENSE|README.md|webpack.config.js|node_modules)\"",  
  10.     "packageLinux": "electron-packager . 'Hosts' --platform=linux --arch=x64 --out=./dist --asar --app-version=2.0.1 --ignore=\"(dist|src|docs|.gitignore|LICENSE|README.md|webpack.config.js|node_modules)\"",  
  11.     "prepackage": "rm -rf build && webpack --config webpack.config.prod.js && rm -rf dist",  
  12.     "package": "npm run packageDarwin && npm run packageWin && npm run packageLinux"  
  13.   },  
  14.   "author": "Howard.Zuo",  
  15.   "license": "MIT",  
  16.   "devDependencies": {  
  17.     "autoprefixer": "^6.7.6",  
  18.     "babel-core": "^6.23.1",  
  19.     "babel-loader": "^6.3.2",  
  20.     "babel-plugin-component": "^0.9.0",  
  21.     "babel-plugin-transform-object-rest-spread": "^6.23.0",  
  22.     "babel-plugin-transform-runtime": "^6.23.0",  
  23.     "babel-preset-es2015": "^6.22.0",  
  24.     "concurrently": "^3.4.0",  
  25.     "css-loader": "^0.26.2",  
  26.     "electron-packager": "^8.5.2",  
  27.     "electron-prebuilt": "^1.4.13",  
  28.     "file-loader": "^0.10.1",  
  29.     "html-webpack-plugin": "^2.28.0",  
  30.     "postcss-loader": "^1.3.3",  
  31.     "postcss-nested": "^1.0.0",  
  32.     "postcss-simple-vars": "^3.0.0",  
  33.     "style-loader": "^0.13.2",  
  34.     "vue-hot-reload-api": "^2.0.11",  
  35.     "vue-html-loader": "^1.2.4",  
  36.     "vue-loader": "^11.1.3",  
  37.     "vue-style-loader": "^2.0.3",  
  38.     "vue-template-compiler": "^2.2.1",  
  39.     "webpack": "^2.2.1",  
  40.     "webpack-dev-server": "^2.4.1"  
  41.   },  
  42.   "dependencies": {  
  43.     "element-ui": "^1.2.3",  
  44.     "hostile": "^1.3.0",  
  45.     "sudo-prompt": "^6.2.1",  
  46.     "vue": "^2.2.1"  
  47.   }  
  48. }  

Guess you like

Origin http://43.154.161.224:23101/article/api/json?id=326228699&siteId=291194637