electron学习笔记（一）----快速开始与打包

如果被墙了，可以用淘宝或华为的镜像。

//淘宝：
npm config set registry https://registry.npm.taobao.org

http://npm.taobao.org/mirrors

ELECTRON_MIRROR=http://npm.taobao.org/mirrors/electron/ npm install -g electron
ELECTRON_BUILDER_BINARIES_MIRROR=http://npm.taobao.org/mirrors/electron-builder-binaries/ electron-builder build

//华为：
npm config set registry https://repo.huaweicloud.com/repository/npm/
npm cache clean -f

npm config set electron_mirror https://repo.huaweicloud.com/electron/
npm install -g electron

一、克隆Github上的electron-quick-start

# Clone this repository
git clone https://github.com/electron/electron-quick-start
# Go into the repository
cd electron-quick-start
# Install dependencies
npm install
# Run the app
npm start

二、如果electron下载慢，使用了NPM淘宝或华为镜像也慢，请直接从淘宝或华为镜像的服务器用HTTP下载，再放到node_modules里

三、可以运行后是一个Hello world

四、什么代码都不改，直接build

五、安装electron-builder

如果NPM下载慢，先记住本地这个地址    C:\Users\你的用户名\AppData\Local\electron-builder\Cache

到镜像服务器，下载以下包，解压后，并放在相应位置

C:\Users\你的用户名\AppData\Local\electron-builder\Cache\nsis\nsis-3.0.4.1

C:\Users\你的用户名\AppData\Local\electron-builder\Cache\nsis\nsis-resources-3.4.1

C:\Users\你的用户名\AppData\Local\electron-builder\Cache\winCodeSign\winCodeSign-2.6.0

不尽事宜参考：truman12的文章

六、配置package.json

增加以下代码：

"build": {  
    "productName":"oneElectron",
    "appId": "oneElectron",
    "copyright":"v1",
    "compression": "store", 
    "directories": {
        "output": "build" 
    }, 
    "asar": false, 
    "extraResources":  { 
        "from": "./extraResources/",
        "to": "extraResources"
    },
    "win": {  
       "icon": "build/icons/icon.ico",
        "target": [
          {
            "target": "nsis",
            "arch": [
              "ia32"
            ]
          }
        ]
    },
    "nsis": {
        "oneClick": false,
        "allowToChangeInstallationDirectory": true
    }
  }

七、直接electron-builder完成打包

打包后会生成一个EXE和一个XXXXXX_unpacked

EXE要可以安装到指定位置

XXXXXX_unpacked，点里面的EXE，可直接运行。