electron-vue 使用serialport库调用串口

electron-vue 使用serialport库调用串口

第一步新建electron-vue项目

vue init simulatedgreg/electron-vue my-project

第二步 依赖并运行项目

安装依赖 npm install || cnpm install
运行项目 npm run dev
打包 npm run build

到这一步electron-vue项目已经创建成功了，接下来我们开始使用serialport库。

第三步 安装 serialport 库

npm install serialport -save

第四步 通过 electron-rebuild 包重新编译原生模块

安装 electron-rebuild
npm install --save-dev electron-rebuild
然后命令行 运行 .\node_modules.bin\electron-rebuild.cmd 把 electron-rebuild 编译进去

第五步 使用

import serialport from 'serialport'
//或
var serialport = require("serialport").serialport;
//...
serialport.list().then(
    ports => {
        console.log(ports)
    }
)

到这里就结束了，但是实际操作中有很多坑要采，下面楼主就把踩得坑分享给大家

.\node_modules\.bin\electron-rebuild.cmd 重新编译完成之后， 运行 npm run dev  就会报错，
说明编译失败了。

解决办法：

运行命令 node-gyp rebuild --target=2.0.4 --arch=x64 --dist-url=https://atom.io/download/electron

--target = 2.0.4 是我使用的 electron 版本号，改成自己的就可以了

还有一种情况就是运行 node-gyp rebuild --target=2.0.4 --arch=x64 --dist-url=https://atom.io/download/electron 命令的时候也报错。

解决办法： 
手动编译
cd ./node_modules/@serialport/bindings
node-gyp rebuild --target=2.0.4 --arch=x64 --dist-url=https://npm.taobao.org/mirrors/atom-shell

因为墙的原因，所以使用淘宝镜像安装依赖即可。

这个 node-gyp 也需要提前安装一下

1.安装Python2.7 配置环境变量（官网下载）看网上说明必须是2.7版本，3不支持
2.安装 npm install --global --production windows-build-tools
3.安装node-gyp npm install -g node-gyp