Electron起步
2017-07-14 17:51
113 查看
开发环境搭建
首先由于国内的网络环境,不推荐使用npm来安装electron。npm install --save-dev electron
推荐去github下载二进制包直接来用。
https://github.com/electron/electron/releases
项目结构
your-app/ ├── package.json ├── main.js └── index.html
package.json
{ "name" : "your-app", "version" : "0.1.0", "main" : "main.js" }
main.js
如果你使用babel的话,可以使用import语法代替require。const { app, BrowserWindow } = require('electron') const path = require('path') const url = require('url') // 保持一个对于 window 对象的全局引用,如果你不这样做, // 当 JavaScript 对象被垃圾回收, window 会被自动地关闭 let win const createWindow = () => { // 创建浏览器窗口。 win = new BrowserWindow({ width: 800, height: 600, minWidth: 800, minHeight: 600, autoHideMenuBar: true }) // 加载应用的 index.html。 win.loadURL(url.format({ pathname: path.join(__dirname, 'index.html'), protocol: 'file:', slashes: true })) // 打开开发者工具。 win.webContents.openDevTools() // 当 window 被关闭,这个事件会被触发。 win.on('closed', () => { // 取消引用 window 对象,如果你的应用支持多窗口的话, // 通常会把多个 window 对象存放在一个数组里面, // 与此同时,你应该删除相应的元素。 win = null }) } // Electron 会在初始化后并准备 // 创建浏览器窗口时,调用这个函数。 // 部分 API 在 ready 事件触发后才能使用。 app.on('ready', createWindow) // 当全部窗口关闭时退出。 app.on('window-all-closed', () => { // 在 macOS 上,除非用户用 Cmd + Q 确定地退出, // 否则绝大部分应用及其菜单栏会保持激活。 if (process.platform !== 'darwin') { app.quit() } }) app.on('activate', () => { // 在这文件,你可以续写应用剩下主进程代码。 // 也可以拆分成几个文件,然后用 require 导入。 if (win === null) { createWindow() } })
index.html
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Hello World!</title> </head> <body> <h1>Hello World!</h1> We are using node <script> document.write(process.versions.node) </script>, Chrome <script> document.write(process.versions.chrome) </script>, and Electron <script> document.write(process.versions.electron) </script>. </body> </html>
打包
安装asar
npm install -g asar
用asar打包项目文件夹
asar pack app app.asar
最后将app.asar放入resources文件夹即可。
相关文章推荐
- Electron-vue 起步
- ADO.NET快速起步 [特别推荐]
- Spring起步例子 “Developing a Spring Framework MVC application step-by-step” 剖析(二)
- XDoclet起步(转自cjsdn)
- Soft-ICE实例起步
- [Linux起步]常用命令
- gcc起步
- 刚刚起步学java
- 完美人生从哪里起步
- jBPM3.12用户指南中文翻译----第二章 起步
- CORBA技术探索起步
- [VBA起步]常用的、带解释的 VBA 短句
- 小菜学Flex2(一 Flex起步)
- MySpace 起步揭密(二)
- Nhibernate学习之起步篇
- OSGi起步(2):与框架进行交互
- 驾驶技术学习笔记第三讲 上坡停车与起步
- ubuntu下codeblocks起步(七)-下
- Discuz论坛架设从零起步之一
- CORBA技术探索起步