[TOC] > [官方文档 ](https://electronjs.org/docs) > [idcpj github demo](https://github.com/idcpj/electron_demo) > [小项目集合](https://github.com/hokein/electron-sample-apps) > [electron 项目,工具箱,ui库](https://github.com/sindresorhus/awesome-electron) ## 安装 `npm i -S electron ` * phpstrom/webstrom 识别 electron ` 语言 & 框架 > javascript > Libraries> 添加>附加目录> 选择 **/node_modules\electron` ## 打包 1. `npm install -D asar` 2. 复制项目到指定文件夹下 项目内容包括你原项目中所有内容(静态资源) `项目\out\项目-win32-ia32\resources` 3. `resources` 目录下执行 `asar pack ./app app.asar` 4. `resources`下多出一个`app.asar`,返回到dist 目录,双击`electron.exe`即可运行 5. 原app 目录可删除 > 如果不能看的你的应用程序,请必须修改`resources`下你打包的asar文件修改为`app.asar` ## 发布 `npm install -g electron-packager` `electron-packager . 项目名称 --all -all --version=1.1.0` 会在根目录创建不同的平台目录同样有`resources`文件,即可将打包的步骤用到此处,最后删除app的静态资源目录 ## 技巧 ### remote模块 区分主进程与渲染进程 `main.js` 所在位置为主进程(main process), 其余为渲染进程(render process).渲染进程需要使用`remote`进行使用 如:`const {BrowserWindow} = require("electron").remote; ## 下载electron包过慢 设置环境 `ELECTRON_MIRROR="https://npm.taobao.org/mirrors/electron/"`(windows下通过set设置该参数); 在使用`electron_package` 或`electron_builder` 下载 ### 支持高分辨 使用`@x2`的形式 ``` images/ ├── icon.png ├── icon@2x.png └── icon@3x.png ``` ``` const { Tray } = require('electron') let appIcon = new Tray('/Users/somebody/images/icon.png') console.log(appIcon) ```