Electron 常見問題 (FAQ)

2023-01-31 11:01 更新

為什么我在安裝 Electron 的時候遇到了問題？

在運行 npm install electron 時，有些用戶會偶爾遇到安裝問題。

在大多數(shù)情況下，這些錯誤都是由網(wǎng)絡問題導致，而不是因為 electron npm 包的問題。 如 ELIFECYCLE、EAI_AGAIN、ECONNRESET 和 ETIMEDOUT 等錯誤都是此類網(wǎng)絡問題的標志。 最佳的解決方法是嘗試切換網(wǎng)絡，或是稍后再嘗試安裝。

如果通過 npm 安裝失敗，您可以嘗試直接從 electron/electron/releases 直接下載 Electron。

Electron 會在什么時候升級到最新版本的 Chrome？?

通常來說，在穩(wěn)定版的 Chrome 發(fā)布后一到兩周內，我們會更新 Electron 內的 Chrome 版本。 這個只是個估計且不能保證，取決于與升級所涉及的工作量。

我們只使用穩(wěn)定的 Chrome 頻道。 如果一個重要的修復在 beta 或 dev 通道中，我們將返回端口。

Electron 會在什么時候升級到最新版本的 Node.js？?

我們通常會在最新版的 Node.js 發(fā)布后一個月左右將 Electron 更新到這個版本的 Node.js。 我們通過這種方式來避免新版本的 Node.js 帶來的 bug（這種 bug 太常見了）。

Node.js 的新特性通常是由新版本的 V8 帶來的。由于 Electron 使用的是 Chrome 瀏覽器中附帶的 V8 引擎，所以 Electron 內往往已經(jīng)有了部分新版本 Node.js 才有的嶄新特性。

如何在兩個網(wǎng)頁間共享數(shù)據(jù)？

在兩個網(wǎng)頁（渲染進程）間共享數(shù)據(jù)最簡單的方法是使用瀏覽器中已經(jīng)實現(xiàn)的 HTML5 API。 其中比較好的方案是 Storage API, localStorage, sessionStorage 和 IndexedDB。

或者，您可以使用 Electron 提供的原始版 IPC 。 若要主進程和渲染器進程之間共享數(shù)據(jù)，可以使用 ipcMain 和 ipcRenderer 兩個模塊。 若要直接在網(wǎng)頁之間進行溝通，您可以從一個頁面發(fā)送一個 MessagePort 到另一個頁面。 這個過程可能需要通過主進程 使用 ipcRenderer.postMessage() 中轉消息。 通過消息端口進行的后續(xù)通信是直連的，不會繞過主進程。

幾分鐘后我應用的 Tray 消失了。?

當用來存儲 Tray 的變量被垃圾回收時，就會發(fā)生這種情況。

你可以參考以下兩篇文章來了解為什么會遇到這個問題：

如果你只是要一個快速的修復方案，你可以用下面的方式改變變量的作用域，防止這個變量被垃圾回收。

const { app, Tray } = require('electron')
app.whenReady().then(() => {
  const tray = new Tray('/path/to/icon.png')
  tray.setTitle('hello world')
})

改為

const { app, Tray } = require('electron')
let tray = null
app.whenReady().then(() => {
  tray = new Tray('/path/to/icon.png')
  tray.setTitle('hello world')
})

我在 Electron 中無法使用 jQuery、RequireJS、Meteor、AngularJS。

因為 Electron 在運行環(huán)境中引入了 Node.js，所以在 DOM 中有一些額外的變量，比如 module、exports 和 require。 這導致 了許多庫不能正常運行，因為它們也需要將同名的變量加入運行環(huán)境中。

我們可以通過禁用 Node.js 來解決這個問題，在Electron里用如下的方式：

// 在主進程中.
const { BrowserWindow } = require('electron')
const win = new BrowserWindow({
  webPreferences: {
    nodeIntegration: false
  }
})
win.show()

假如你依然需要使用 Node.js 和 Electron 提供的 API，你需要在引入那些庫之前將這些變量重命名，比如：

<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 的提供的模塊時，你可能會遇到和以下類似的錯誤：

> require('electron').webFrame.setZoomFactor(1.0)
Uncaught TypeError: Cannot read property 'setZoomLevel' of undefined

很可能是你在過程中使用了錯誤的模塊。 比如，electron.app 只能在主進程中使用, 然而 electron.webFrame 只能在渲染進程中使用。

文字看起來很模糊，這是什么原因造成的？怎么解決這個問題呢？?

如果 sub-pixel anti-aliasing已被禁用，那么 LCD 屏幕上的字體可能會看起來模糊。 示例：


子像素反鋸齒需要一個包含字體光圖的圖層的非透明背景。 （詳情請參閱這個問題）

為了實現(xiàn)這一目標，在 BrowserWindow 的構造器中設置背景：

const { BrowserWindow } = require('electron')
const win = new BrowserWindow({
  backgroundColor: '#fff'
})

效果僅可見于（一些） LCD 屏幕。 即使您沒有看到差別，您的一些用戶可能會看到。 最好始終以這種方式確定背景，除非你有理由不這樣做。

注意到，僅設置 CSS 背景并不具有預期的效果。


以上內容是否對您有幫助：
在線筆記
App下載
App下載

掃描二維碼

下載編程獅App

公眾號
微信公眾號

編程獅公眾號