记录一次Vite端口错误排除过程

315 阅读2分钟

引言

由于Tauri的快速发展,有着非常不错的性能,比之前测试版的时候好用太多了,还支持了Vite,这更加刺激了我使用的欲望.但是任务繁重,就很少去关注它了 到了今天, 完成了导师的课题报告,终于可以闲下来了,就想做一个Windows PC桌面端,那么久重新踏上了Tauri 之路

问题复现步骤

  1. 安装了Rust所需的C++配置
  2. 安装Docker容器, 开启了Hyper-V配置
  3. 安装Tauri,选择了React-TS的配置
  4. 运行指令 pnpm tauri dev 进行桌面端APP开发

第一次使用运行指令的时候是没问题的,那时候电脑没重启,Hyper-V没生效,成功跑起来了

image.png

重启之后,问题来了:

O)NXRK6HF2@(L%4IZ5_MBGL.png

异常显示端口被占用,邃检查端口问题

}7XKUR4OB9FAGMFW4W.png

4(}FI}W7E1){%T(HHAELRDK.png

09A)@3PJW2`%BUNS6_D}YG.png

发现并没有Tauri启动的1420端口被占用.

仔细回想了一边问题的边界,之后就想到会不会是配置Docker的环境影响了端口,然后检查保留端口

执行指令检查保留的端口列表

netsh int ipv4 show excludedportrange protocol=tcp

果然, Tauri的默认端口1420在保留端口列表中

image.png

解决方案

首先想到的是更换Vite的端口,看看Tauri会不会监听到Vite监听到Vite端口的变化做出变化.如果不行,再替换Tauri端口

修改Vite的包管理文件package.json,修改端口为3001

image.png

运行tauri dev, 发现Tauri监听它默认的端口1420,等待此端口启动

image.png

想想Tauri应该不会注意这个小细节,先专注优先级更高的事件. 那么就需要手动修改默认的端口了,在Tauri的的配置文件tauri.conf.json中修改为你需要的端口即可

image.png