electron:官方文檔https://www.electronjs.org/解釋了桌面應(yīng)用的開(kāi)發(fā)好處。

如果你可以建一個(gè)網(wǎng)站，你就可以建一個(gè)桌面應(yīng)用程序。 Electron 是一個(gè)使用 JavaScript, HTML 和 CSS 等 Web 技術(shù)創(chuàng)建原生程序的框架，它負(fù)責(zé)比較難搞的部分，你只需把精力放在你的應(yīng)用的核心上即可。

如上面所提到：會(huì) JavaScript, HTML 和 CSS 就可以開(kāi)發(fā)。我們學(xué)習(xí) electron 桌面應(yīng)用有下面這些優(yōu)勢(shì)：

1.減少學(xué)習(xí)成本。 前端開(kāi)發(fā)者不需要去學(xué)習(xí)新的開(kāi)發(fā)語(yǔ)言，學(xué)習(xí)不會(huì)花費(fèi)很多時(shí)間；而且，electron學(xué)習(xí)難度會(huì)比其他C#、.net等簡(jiǎn)單許多,對(duì)于許多開(kāi)發(fā)者是友善的。
2.龐大的社區(qū)：electron是github官方產(chǎn)品，不管是框架技術(shù)、用戶使用數(shù)量，還是用戶信任度，都是得到各界開(kāi)發(fā)人士肯定的。
3.減少工作量： Electron 是跨平臺(tái)的，可以同時(shí)開(kāi)發(fā) Web 應(yīng)用和桌面應(yīng)用，無(wú)論是 UI，還是代碼（JS），大多數(shù)資源都可以共享，這也為開(kāi)發(fā)者大大減少了工作量，甚至企業(yè)也無(wú)需重復(fù)投入人力來(lái)開(kāi)發(fā)系統(tǒng)。
4.未來(lái)發(fā)展市場(chǎng)廣闊。從electron的主要用戶來(lái)看，很多都是大廠，如螞蟻金服、小米、華為、GitHub（Electron 就是 GitHub 推出的）、微軟等，由于現(xiàn)在 GitHub 被微軟收購(gòu)了，因而目前 Electron 的后臺(tái)是微軟。因此學(xué)習(xí) Electron 不用擔(dān)心以后沒(méi)市場(chǎng)，畢竟，各大廠都在用 Electron

現(xiàn)在來(lái)學(xué)習(xí)一下electron吧！

一、搭建開(kāi)發(fā)環(huán)境

官方給出：

Electron 支持Windows 7 及以上版本—任何在低版本W(wǎng)indows上開(kāi)發(fā)Electron的嘗試都將是徒勞無(wú)功的。

electron 是nodejs提供技術(shù)插件支持，首先，為避免一些編譯環(huán)境不必要的錯(cuò)誤，安裝nodejs最新版本node下載

再安裝git git下載(下面遠(yuǎn)程拉取官方實(shí)例代碼需要用到)

二、創(chuàng)建項(xiàng)目

1.安裝插件:

cnpm i -g electron
npm i -g electron
yarn electron

選擇任意一種安裝方式

建議使用

cnpm i -g electron

2.創(chuàng)建項(xiàng)目：

方法一:

npx create-electron-app xxx //其中npx為node最新10版本內(nèi)置命令

方法二:

cnpm i -g yarn //安裝yarn命令
yarn create-electron-app xxx

方法三：

cnpm install -g @electron-forge/cli //安裝electron-forge腳手架
electron-forge init xxx //創(chuàng)建、初始化項(xiàng)目
cd xxx //進(jìn)入xxx項(xiàng)目目錄
npm start //運(yùn)行項(xiàng)目

方法四：遠(yuǎn)程倉(cāng)庫(kù)拉取

克隆示例項(xiàng)目的倉(cāng)庫(kù)

$ git clone https://github.com/electron/electron-quick-start

進(jìn)入這個(gè)倉(cāng)庫(kù)

$ cd electron-quick-start

安裝依賴(lài)

$ npm install

方法五：手動(dòng)創(chuàng)建（有興趣的自己去bilibili上搜索視頻，有很多這類(lèi)視屏的講解）

三、運(yùn)行

使用命令行：

npm start

如果是手動(dòng)創(chuàng)建的使用

electron . //點(diǎn)是當(dāng)前項(xiàng)目默認(rèn)運(yùn)行文件

截圖如下（這是github遠(yuǎn)程倉(cāng)庫(kù)示例）：

如上圖所示我這里簡(jiǎn)單搭建和運(yùn)行一個(gè)桌面應(yīng)用程序成功！

最新評(píng)論