Electron框架让你通过CSS、JS、HTML写跨平台的桌面应用,它基于Node.js以及Chrom内核,Atom
编辑器就是通过它完成的。
FAQ(Frequently Asked Questions)常见问题
什么时候=会升级到最新版本的Chrome
通常会在稳定版本的Chrom发布1-2周内,更新Electron内的Chrome版本,Electron只会使用稳定
版本的Chrome,但如果在beta或dev有重要的更新的话,会使用补丁的方式应用到现版本的Chrome上
什么时候会升级到最新版本的nodejs
当一个新版本的nodejs发布之后,通常会在1月之后更新Electron,这样可以避免引入新版本的nodejs
所带来的bug,这太常见了.
Nodejs的新特性通常是在V8带来的,由于Electron使用的是Chrome装配的V8,所以Electron内已经
有了新版本Nodejs的新特性.
如何在不同的页面共享数据
在不同的网页之间共享数据最简单的方法就是使用浏览器中以实现的HTML5Api,比较好的方案就是Storage API
,localStorage
,sessionStorage
, 还有IndexDB
。或者使用Electron的
IPC系统,将对象储存在主进程中的一个全局变量中,然后在所有的渲染进程中通过Electron
的remote
属性访问它。
1
2
3
4 // In the main process.
global.sharedObject = {
someProperty: 'default value'
};
1
2 // In page 1.
require('electron').remote.getGlobal('sharedObject').someProperty = 'new value';
1
2 // In page 2.
console.log(require('electron').remote.getGlobal('sharedObject').someProperty);应用的窗口/托盘在一段时间之后不见了
这通常是因为储存窗口/托盘的变量被垃圾收集器收集了。
如果遇到这个问题,下面的文章会有所帮助
- Memory Management(内存管理)
- Variable Scope(变量作用域)
如果想要一个快速的解决方案,让这些变量变成全局的
1
2
3 app.on('ready', () => {
const tray = new Tray('/path/to/icon.png');
});改变为
1
2
3
4 let tray = null;
app.on('ready', () => {
tray = new Tray('/path/to/icon.png');
});为什么不能在Electron中使用jQuery、RequireJs、Meteor、AngularJs
由于nodejs集成了Electron,一些特殊的符号(标识)比如require
,exports
,’module’会被
插入到DOM中,这会导致一些类库插入相同命名的标识失败。
1
2
3
4
5
6 // In the main process.
let win = new BrowserWindow({
webPreferences: {
nodeIntegration: false
}
});如果想继续使用Nodejs和Electron提供的API,你需要在页面中重命名这些符号(标识)在引入其
它类库时
1
2
3
4
5
6
7
8
9 <head>
<script>
window.nodeRequire = require;
delete window.require;
delete window.exports;
delete window.module;
</script>
<script type="text/javascript" src="jquery.js"></script>
</head>require(
electron
).xxx未定义
在使用electron的内置模块时,可能会遇到这样的问题
1
2 require('electron').webFrame.setZoomFactor(1.0);
Uncaught TypeError: Cannot read property 'setZoomLevel' of undefined这是因为你通过
npm
安装了全局的或本地的electron
模块,它覆写了Electron
的内置模块
你可以打印出electron
的路径来核实你是否使用了正确的内置模块
1 console.log(require.resolve('electron'));检查一下是否符合下面的形式
1 "/path/to/Electron.app/Contents/Resources/atom.asar/renderer/api/lib/exports/electron.js"如果是
node_modules/electron/index.js
这种格式的话,你需要删除或者重命名npm安装的electron模块
1
2 npm uninstall electron
npm uninstall -g electron如果依然遇到同样的问题,很可能是因为你在错误的进程中使用了此模块,比如
electron.app
只能
在主进程中使用,而electron.webFrame
只能在渲染进程中使用.