官网搜索找到一个node-inno,npmjs上看popularity只有4%。这里用一个npmjs使用较多的 electron-packager
PS: 用完electron-packager后,发现electron-builder更好~
nodejs版本至少要大于4.0
electron-packager比较大,安装很容易失败,请看
npm install electron-packager --save-dev
报错了
D:\project\electron>npm install electron-packager --save-dev> electron@3.0.7 postinstall D:\project\electron\node_modules\electron> node install.jsDownloading tmp-14536-1-SHASUMS256.txt-3.0.7Error: connect ETIMEDOUT 52.216.16.216:443D:\project\electron\node_modules\electron\install.js:49throw err^Error: connect ETIMEDOUT 52.216.16.216:443at Object._errnoException (util.js:1022:11)at _exceptionWithHostPort (util.js:1044:20)at TCPConnectWrap.afterConnect [as oncomplete] (net.js:1198:14)npm ERR! code ELIFECYCLEnpm ERR! errno 1npm ERR! electron@3.0.7 postinstall: `node install.js`npm ERR! Exit status 1npm ERR!npm ERR! Failed at the electron@3.0.7 postinstall script.npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
原因使用了官方npm源,太慢
D:\project\electron>nrm ls* npm ---- https://registry.npmjs.org/cnpm --- http://r.cnpmjs.org/taobao - https://registry.npm.taobao.org/nj ----- https://registry.nodejitsu.com/rednpm - http://registry.mirror.cqupt.edu.cn/npmMirror https://skimdb.npmjs.com/registry/edunpm - http://registry.enpmjs.org/
切换到最快的cnpm后,还是失败
D:\project\electron>nrm test* npm ---- 736mscnpm --- 159mstaobao - 342msnj ----- Fetch Errorrednpm - Fetch ErrornpmMirror 1152msedunpm - Fetch ErrorD:\project\electron>nrm use cnpmRegistry has been set to: http://r.cnpmjs.org/D:\project\electron>npm install electron-packager --save-devnpm ERR! code ECONNRESETnpm ERR! errno ECONNRESETnpm ERR! network request to https://cnpmjs.oss-ap-southeast-1.aliyuncs.com/electron-osx-sign/-/electron-osx-sign-0.4.11.tgz failed, reason: read ECONNRESETnpm ERR! network This is a problem related to network connectivity.npm ERR! network In most cases you are behind a proxy or have bad network settings.npm ERR! networknpm ERR! network If you are behind a proxy, please make sure that thenpm ERR! network 'proxy' config is set properly. See: 'npm help config'
切换到taobao后,安装成功
D:\project\electron>nrm use taobaoRegistry has been set to: https://registry.npm.taobao.org/D:\project\electron>npm install electron-packager --save-dev> electron@3.0.7 postinstall D:\project\electron\node_modules\electron> node install.jsDownloading tmp-11764-0-SHASUMS256.txt-3.0.7[============================================>] 100.0% of 4.74 kB (4.74 kB/s)+ electron-packager@12.2.0added 2 packages and updated 1 package in 9.78s
electron-packager <sourcedir> <appname> --platform=<platform> --arch=<arch> [optional flags...]
| 参数 | 说明 |
|---|---|
| sourcedir | 项目路径 |
| appname | 打包后的名称 |
| —platform | 要构建应用的目标平台(Windows、Mac 还是 Linux),允许值:linux,win32,darwin,mas,all |
| —arch | 用x86 还是用 x64 还是两个架构都用 |
| —all | 设置true时,—platform和—arch都会设置为all |
| —icon | 图标,使用本地路径 |
| —out | 输出目录 |
| —ignore | 正则表达式,指定忽略的文件,out设置的目录会默认忽略 |
| —overwrite | 覆盖已经存在的输出目录 |
更多参数,参数API: https://github.com/electron-userland/electron-packager/blob/master/docs/api.md
前面安装时,使用了--save-dev,所以只能在package.json里设置后运行。如果在直接在命令行运行,请全局-g安装
..."scripts": {"start": "electron .","packager":"electron-packager ./ ElectronHelloWorld --out ./dist --appVersion 1.0.0 --overwrite"},...
控制台执行npm run packager,会在dist目录生成ElectronHelloWorld-win32-x64文件夹

打开ElectronHelloWorld.exe文件,OK,Hello World出来了

electron通过reactjs自定义最大化、最小化、关闭功能
无边框窗口是不带外壳(包括窗口边框、工具栏等),只含有网页内容的窗口。 这些是 BrowserWindow 类上的选项。透明窗口是没有阴影部分。利用css设置自定义区域可拖动。
nsis中文手册及安装
对electron目录调整后,打包白屏?而使用electron-packager打包没问题,什么原因呢?
electron .命令是什么?能换成别的目录吗?当然可以~
electron-builder相对electron-packager有更丰富的的功能,支持更多的平台,同时也支持了自动更新,electron-builder打出的包更为轻量,并且可以打包出不暴露源码的setup安装程序
window下使用 electron-packager将electron打包成exe可执行文件
electron快速开始入门