Wails 入门教程：Go + React + Ant Design 构建跨平台桌面客户端

🖥️ Wails 入门教程：Go + React + Ant Design 构建跨平台桌面客户端

效果

一、背景

在桌面应用开发领域，常见的技术路线包括：

• Electron：基于 Node.js + Chromium，生态丰富但体积庞大、内存消耗高。
• Qt / .NET / JavaFX：功能强大，但跨平台体验不统一，学习曲线陡峭。
• WebView 框架（Tauri / Wails）：利用系统自带 WebView，前端依旧用现代 Web 技术，后端由原生语言提供系统能力。

Wails 的定位：

• 后端用 Go：高性能、并发强、能直接调用系统能力。
• 前端用 React + Ant Design：快速构建专业 UI，组件丰富且风格统一。
• 通信桥：框架自动生成 RPC 通道，前端能直接调用 Go 方法。
• 打包分发：最终生成一个跨平台的原生二进制应用，体积小、性能好。

适合场景：

• 内部管理工具 / 客户端。
• 开发者工具、运维面板。
• 私有化桌面应用。

二、工作原理

Wails 应用由三部分组成：

1. UI 渲染：利用系统自带 WebView（Windows: WebView2，macOS: WKWebView，Linux: WebKitGTK）。
2. 逻辑处理：Go 后端负责文件系统、网络、并发任务、系统调用。
3. 通信桥（RPC）：前端通过 window.backend 调用 Go 方法，Go 方法执行后返回结果，同时 Go 也能主动推送事件给前端。

最终，前端静态资源会打包进 Go 二进制，形成一个跨平台桌面应用。

三、环境准备

1. 安装 Go (>=1.18) 👉 Go 下载

2. 安装 Node.js (推荐 18+) 👉 Node.js 下载

3. 安装 Wails CLI：

   go install github.com/wailsapp/wails/v2/cmd/wails@latest
   

4. 检查环境：