使用electron进行原生应用的打包

{
  "name": "electron_example",
  "private": true,
  "scripts": {
  },
  "devDependencies": {
    "electron": "~2.0.2",
    "electron-builder": "~20.7.1"
  }
}

appId: app.electron.example # 应用ID
artifactName: "${productName}-${version}.${ext}" # 应用最终的名称
productName: ‘Electron Example App‘ # 打包完成后的应用名称
npmRebuild: false # 是否在开始编译前重构原生依赖,可先尝试true, 如果出现问题再修改为false,

files:
  - index.js # 打包文件入口,后文将给出
  
directories:
  output: electron_packed/ # 输出路径
extraResources:
  - from: "../dist/" #包含的待打包文件
    to: ""
mac: # 打包成mac环境参数
  target: 
    - dmg # 打包为dmg格式(可选pkg,zip等)
  icon: build/icon.icns # 图标所在路径
　

dmg: # 安装界面
  contents:
    - x: 410
      y: 170
      type: link
      path: /Applications
    - x: 130
      y: 170
      type: file

win: # 打包为win环境
  icon: build/icon.ico # 图标所在路径
  target:
    - nsis # 打包为nsis格式
  verifyUpdateCodeSignature: false # 是否需要验证签名
  # requestedExecutionLevel: requireAdministrator # 执行等级(是否需要管理员权限,通常情况不需要)
nsis:
  oneClick: false # 是否一键安装(静默安装)
  createDesktopShortcut: always # 创建桌面快捷方式
  createStartMenuShortcut: true # 创建开始菜单快捷方式
  # include: build/installer.nsh # 是否有额外的自定义安装需求,
  runAfterFinish: true # 安装完成后是否勾选立即执行
  

const electron = require(‘electron‘)const app = electron.app
const BrowserWindow = electron.BrowserWindow 
const ipcMain = electron.ipcMain //EventEmitter class 事件触发类
const url = require(‘url‘)
const path = require(‘path‘)

let mainWindow = null // 创建全局对象,不然当js对象被垃圾回收的时候窗口会自动关闭

// 创建浏览窗口,定义高宽
function createWindow () {
  mainWindow = new BrowserWindow({
    width: 1000,
    height: 650,
  })

  // 加载本地文件
  mainWindow.loadURL(url.format({
    pathname: path.join(process.resourcesPath, ‘index.html‘),
    protocol: ‘file:‘,
    slashes: true
  }))
　// 调试阶段也可加载调试地址
  // mainWindow.loadURL(‘http://localhost:8000/#/‘)

  // 打开调试工具
  // mainWindow.webContents.openDevTools()

  // 窗口关闭时触发
  mainWindow.on(‘closed‘, function () {
    mainWindow = null
  })
}

// 实现单例,防止程序多开
const iShouldQuit = app.makeSingleInstance((commandLine, workingDirectory) => {    
  // 如果为已有窗口,调用focus,如果最小化,还会恢复窗口   
  if (mainWindow) {    
    if (mainWindow.isMinimized()) mainWindow.restore();
    mainWindow.focus();
  }
});
// 多开退出程序
if (iShouldQuit) {    
  return app.quit();
}    
    
// 加载完成之后调用事件 
app.on(‘ready‘, createWindow)


// 只对windows有效,当所有窗口关闭后退出(OS X会强制一个窗口显示)
app.on(‘window-all-closed‘, function () {
  if (process.platform !== ‘darwin‘) {
    app.quit()
  }
})

app.on(‘activate‘, function () {
  // 针对在OS X上的dock icon 点击时创建窗口
  if (mainWindow === null) {
    createWindow()
  }
})
// 开始响应渲染
ipcMain.on(‘response-render‘, (event, arg) => {
  event.sender.sender()
})

.
├── build
│   ├── icon.icns
│   ├── icon.ico
│   └── icons.png
├── electron-builder.yml
├── index.js
└── package.json

"build:mac": "rm -rf electron_pack/electron_packed && cross-env electron-builder --project electron_pack",
"build:win": "rm -rf electron_pack/electron_packed && cross-env electron-builder --win --ia32 --project electron_pack"

yarn build:mac
yarn build:win

{
  "name": "electron_example", # 项目名(注意与打包名的区别)
  "version": "1.0.0", # 打包版本
  "description": "This is the first version to pack app", # 项目描述
  "main": "index.js", # 主入口(打包入口文件地址)
  "devDependencies": { # 必须在此处指定的依赖
    "electron": "~2.0.2",
    "electron-builder": "~20.7.1"
  },
  "author": "Lorry",
  "license": "ISC"
}