electron-vue-serialport

项目运行环境:

1、必须安装nodejs
node下载地址-Nodejs
2、安装node-gyp
node-gyp是用来编译c++模块的工具,这里用来编译serialport, node-gyp的github文档-node-gyp文档
全局安装

npm install -g node-gyp

通过命令,但是要注意 的是必须以管理员的身份启动CMD窗口

npm install --global --production windows-build-tools

新建项目

1.初始化项目
打开cmd,安装vue-cli

vue-cli npm install -g vue-cli

在当前工程目录下,新建一个项目,使用的electron-vue,输入以下命令:
my-project是自己项目名。

vue init simulatedgreg/electron-vue my-project

然后提示正在下载模板,下完模板之后根据提示进行操作就行,输入你该输入的东西,然后一路Enter:
下载完毕后进入项目目录

cd my-project

安装依赖

npm install

在这里插入图片描述
如果npm install无法进行安装,尝试以管理员的身份安装。
若还是不行,尝试如下方法:

1.查看下安装源 npm config get registry

2.如果不是国内的源通过下面的方式设置:npm config set registry http://registry.npm.taobao.org/

3.删除node_moudle文件夹

4.删除package-lock.json这个文件夹

5.npm install --force清除一下缓存

6.再npm install即可安装依赖包成功

npm install 安装完毕后执行

 npm run dev

命令运行之后,出现以下界面,代表项目创建成功
在这里插入图片描述
2、安装 serialport 库

npm install serialport -save

通过 electron-rebuild 包重新编译原生模块
安装 electron-rebuild

npm install --save-dev electron-rebuild

然后命令行 运行

.\node_modules.bin\electron-rebuild.cmd 

把 electron-rebuild 编译进去,,,,,实际操作中有很多坑要采

原因分析:

提示:这里填写问题的分析:

例如:Handler 发送消息有两种方式,分别是 Handler.obtainMessage()Handler.sendMessage(),其中 obtainMessage 方式当数据量过大时,由于 MessageQuene 大小也有限,所以当 message 处理不及时时,会造成先传的数据被覆盖,进而导致数据丢失。


解决方案:

提示:这里填写该问题的具体解决方案:

例如:新建一个 Message 对象,并将读取到的数据存入 Message,然后 mHandler.obtainMessage(READ_DATA, bytes, -1, buffer).sendToTarget();换成 mHandler.sendMessage()

  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
electron-vue是一个基于Electron框架和Vue.js框架的开发工具,可以帮助开发者使用Vue进行Electron应用的开发。而webpack是一个模块打包工具,用于将各种资源(JavaScript、CSS、HTML等)打包成一个或多个文件。 当我们在electron-vue项目中使用serialport库时,需要进行一些配置和打包工作。首先,在项目的package.json文件中添加serialport库的依赖,可以使用命令npm install serialport进行安装。 接下来,在项目的webpack配置文件中,需要对serialport库进行配置。首先,添加externals属性,指定serialport库在打包时不被打包,而是在运行时通过require引入外部依赖。例如: externals: { 'serialport': 'require("serialport")' } 然后,在配置文件中找到module.exports中的target属性,将其设置为electron-renderer,以便在渲染进程中使用serialport库。 最后,通过运行npm run build命令,进行项目的打包操作。webpack将会根据配置文件将所有的资源打包成一个或多个文件,并输出到指定的目录中。 需要注意的是,在打包完成后,项目的依赖关系需要正确地配置,以确保serialport库能够正常工作。可以通过使用electron-rebuild等工具来重新编译serialport库,以适配Electron环境。 总结起来,通过electron-vue和webpack的配合,我们可以将serialport库打包到Electron应用中,从而实现在Vue界面中使用串口通信的功能。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值