使用electron和node-serialport的環境搭建過程


附上github項目地址(已經構建好的項目)-electron-serialport

項目運行所需環境

1,必須安裝nodejs

附上node下載地址-Nodejs

node安裝過程簡單, 一直next就行了,我安裝的版本是12.16.1,可以在powershell中通過 node -v來查看當前版本

2,安裝nod-gyp

node-gyp是用來編譯c++模塊的工具,這里用來編譯serialport,
node-gyp的github文檔-node-gyp文檔

全局安裝 npm install -g node-gyp

來看這一段來自官方文檔的說明

大致意思就是有兩種方案:

一種是下載windows-build-tools,通過命令npm install --global --production windows-build-tools,但是要注意
的是必須以管理員的身份啟動CMD窗口或者是PowerShell窗口,這種方案下載的東西較少

還有一種是要下載Visual Studio和python,這種方案下載的東西就很多了,但是我以前電腦裝過VisualStudio並且以后或許會用到
所以我選了第二種方案

3、安裝visual studio 2017

附上visual studio下載地址Visual Studio 2017 Community
安裝VS的時候選項如下,要勾選使用c++桌面開發,node-gyp文檔上也有提示

安裝完成之后執行一下命令

npm config set msvs_version 2017

4、安裝python2.7

附上python下載地址-Python2.7x

python安裝注意版本要下載相應的版本 百度了一下說python3.x不支持,為了避免不必要的問題干脆直接裝python2.7,
具體安裝過程記不清了,網上教程很多,大同小異,照着過程安裝一遍就行。

安裝完成之后執行命令

npm config set python python2.7

可以在powershell中使用命令python --version來查看安裝好的版本

項目的安裝與使用

clone到本地

git clone https://github.com/BaiFangZi/electron-serialport.git

切換到項目目錄

cd electron-serialport

下載相應的依賴

npm下載由於網速或者被牆會造成下載失敗,到這一步會卡住,推薦使用cnpm

npm install或者cnpm install

下載成功后的提示信息

由於node版本和electron版本不匹配,所以直接啟動會報錯,這個時候要執行下面這兩個命令來解決這個問題

cd ./node_modules/@serialport/bindings

node-gyp rebuild --target=6.0.10 --arch=x64 --dist-url=https://npm.taobao.org/mirrors/atom-shell

然后再返回根目錄 cd ../../../

啟動項目 npm start

項目打包生成exe文件

我使用的是electron-builder來打包 打包命令

npm run dist

在package.json文件中可以更改build屬性來配置相應的打包選項

項目打包生成exe文件

我使用的是electron-builder來打包 打包命令

npm run dist

在package.json文件中可以更改build屬性來配置相應的打包選項

打包過程極有可能被牆,針對這種情況我們可以復制鏈接然后在瀏覽器中下載相應的被牆的文件,再手動添加到目錄中


詳細過程可以看這篇文章 解決下載依賴出錯

build文件夾就是成功打包后的東西,包括安裝包等

查看更多內容請訪問:根號七的網站


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM