Electron 教程簡介

2022-01-08 15:00 更新

所有的 Node.js's built-in modules 在 Electron 中都可用,并且所有的 node 的第三方組件也可以放心使用(包括自身的模塊)。

Electron 也提供了一些額外的內(nèi)置組件來開發(fā)傳統(tǒng)桌面應(yīng)用。一些組件只可以在主進(jìn)程中使用,一些只可以在渲染進(jìn)程中使用,但是也有部分可以在這 2 種進(jìn)程中都可使用。

基本規(guī)則:GUI 模塊或者系統(tǒng)底層的模塊只可以在主進(jìn)程中使用。要使用這些模塊,你應(yīng)當(dāng)很熟悉主進(jìn)程 vs 渲染進(jìn)程腳本的概念。

主進(jìn)程腳本看起來像個(gè)普通的 nodejs 腳本

const electron = require('electron');
const app = electron.app;
const BrowserWindow = electron.BrowserWindow;

var window = null;

app.on('ready', function() {
  window = new BrowserWindow({width: 800, height: 600});
  window.loadURL('http://m.hgci.cn');
});

渲染進(jìn)程和傳統(tǒng)的 web 界面一樣,除了它具有使用 node 模塊的能力:

<!DOCTYPE html>
<html>
<body>
<script>
  const remote = require('electron').remote;
  console.log(remote.app.getVersion());
</script>
</body>
</html>

如果想運(yùn)行應(yīng)用,參考 Run your app 。

解構(gòu)任務(wù)

如果你使用的是 CoffeeScript 或 Babel,你可以使用 destructuring assignment 來讓使用內(nèi)置模塊更簡單:

const {app, BrowserWindow} = require('electron');

然而如果你使用的是普通的 JavaScript,你就需要等到 Chrome 支持 ES6了。

使用內(nèi)置模塊時(shí)禁用舊樣式

在版本 v0.35.0 之前,所有的內(nèi)置模塊都需要按照 require('module-name') 形式來使用,雖然它有很多弊端,我們?nèi)匀辉诶系膽?yīng)用中友好的支持它。

為了完整的禁用舊樣式,你可以設(shè)置環(huán)境變量 ELECTRON_HIDE_INTERNAL_MODULES :

process.env.ELECTRON_HIDE_INTERNAL_MODULES = 'true'

或者調(diào)用 hideInternalModules API:

require('electron').hideInternalModules()
以上內(nèi)容是否對您有幫助:
在線筆記
App下載
App下載

掃描二維碼

下載編程獅App

公眾號(hào)
微信公眾號(hào)

編程獅公眾號(hào)