wails2 Golang

github: https://github.com/wailsapp/w...

文档: https://wails.io/zh-Hans/docs...

环境要求

  • Go 1.16
  • npm
  • 需是 Windows，MacOS, Linux 操作系统之一
  • gcc

装置

# Go 1.17 下 装置go install github.com/wailsapp/wails/cmd/wails@latest# Go 1.16 $ go get -u github.com/wailsapp/wails/cmd/wails

输出命令，有如下后果就是装置胜利了

$ wails updateWails v1.16.9 - Checking for updates...> Checking for updates...    Current Version : v1.16.9     Latest Release : v1.16.9Looks like you're up to date!

初始化 个人信息

$ wails setup _       __      _ __| |     / /___ _(_) /____| | /| / / __ `/ / / ___/| |/ |/ / /_/ / / (__  )  v1.16.9|__/|__/\__,_/_/_/____/   https://wails.appThe lightweight framework for web-like appsWelcome to Wails!## 输出开发者姓名 以及 邮箱What is your name (xiaobaiyaoshengfa):What is your email address (xiaobaiyaoshengfa@sifou): xiaobaiyaoshengfa@sifouWails config saved to: C:\Users\xxx\.wails\wails.jsonFeel free to customise these settings.## 查看以后运行的零碎环境，以及依赖的命令行工具是否可用。Detected Platform: WindowsChecking for prerequisites...Program 'gcc' found: C:\Program Files\mingw-w64\x86_64-7.3.0-release-posix-seh-rt_v5-rev0\mingw64\bin\gcc.exeProgram 'npm' found: C:\nodejs\npm.cmdReady for take off!Create your first project by running 'wails init'.

Hello World

初始化我的项目

$ wails initWails v1.16.9 - Initialising projectThe name of the project (My Project): HelloProject Name: HelloThe output binary name (hello): helloOutput binary Name: helloProject directory name (hello):Project Directory: helloPlease select a template (* means unsupported on current platform):  1: Angular - Angular 8 template (Requires node 10.8+)  2: React JS - Create React App v4 template  3: Svelte - A basic Svelte template  4: Vanilla - A Vanilla HTML/JS template  5: * Vue3 Full - Vue 3, Vuex, Vue-router, and Webpack4  6: * Vue3 JS - A template based on Vue 3, Vue-router, Vuex, and Webpack5  7: Vue2/Webpack Basic - A basic Vue2/WebPack4 template  8: Vuetify1.5/Webpack Basic - A basic Vuetify1.5/Webpack4 template  9: Vuetify2/Webpack Basic - A basic Vuetify2/Webpack4 template## 这里提供了9个前端模板，比方常见的有 Angular， React，Vue 等，这里我抉择了相熟的 ReactPlease choose an option [1]: 2Template: React JS> Generating project...## 当前目录下生成一个 hello 文件夹，理论的wails 我的项目将就在外面。 Project 'Hello' initialised. Run `wails build` to build it.

我的项目 目录构造

$ tree -L 2 ./hello/./hello/├── appicon.png├── build│   └── hello.exe├── frontend│   ├── build│   ├── node_modules│   ├── package.json│   ├── package.json.md5│   ├── package-lock.json│   ├── public│   ├── README.md│   └── src├── go.mod├── go.sum├── hello.exe.manifest├── hello.ico├── hello.rc├── hello-res.syso├── main.go└── project.json6 directories, 14 files

这里 frontend 就是前端我的项目的目录， ./frontend/build 文件夹保留了 npm 编译后的成绩。而 wails 是怎么将其引入到代码中的呢？

关上文件 ./main.go

package mainimport (  _ "embed"  "github.com/wailsapp/wails")func basic() string {  return "World!"}//go:embed frontend/build/static/js/main.jsvar js string//go:embed frontend/build/static/css/main.cssvar css stringfunc main() {  app := wails.CreateApp(&wails.AppConfig{    Width:  1024,    Height: 768,    Title:  "Hello",    JS:     js,    CSS:    css,    Colour: "#131313",  })  app.Bind(basic)  app.Run()}

从 main.go 文件中能够看到 //go:embed 这两句代码，这用到了 go 1.16 开始官网提供的 embed 新个性，通过这两个指令将 js，css 文件里的代码赋值给 js，css 两个字符串变量。

所以， wails 对go最低版本要求是 1.16 。

//go:embed 指令，能够在编译阶段将动态资源文件打包进编译好的程序中，并提供拜访这些文件的能力。

构建我的项目

## 这里须要进入 wails 我的项目$ cd ./hello## 我的项目内进行构建$ wails buildWails v1.16.9 - Building Application> Skipped frontend dependencies (-f to force rebuild)> Building frontend...> Ensuring Dependencies are up to date...> Packing + Compiling project...*** Please note: Windows builds use mshtml which is only compatible with IE11. For more information, please read https://wails.app/guides/windows/ ***Awesome! Project 'Hello' built!

运行我的项目

$ ./build/hello.exe

windows 下会看到 如下后果：

wails 技术剖析

IE11

在 wails build 时，咱们就能看见，提醒语： IE11，也就是 web-viewer 在 windows 平台是基于IE11，而在 2021年8月17日，微软就发表 Office 365 不再思考在 IE11 上的兼容性问题，并且过滤用户适度到 Edge，但 Edge 不是默认装置。所以 wails 调用 IE11 渲染了web。

至于 React，Vue， Angular 对 IE11 的兼容性策略，咋们避开不谈。

Internet Explorer 11 的反对

可执行文件

好，咱们再来看看编译文件，才 8MB , 这相比动辄 70MB, 上百兆的 Electron 的确是好太多。我想大家用这个计划就是冲这个来的吧。

总结

总的来说，wails2 欠缺了 go 基于 web-view 跨平台桌面程序解决方案。其中，可能应用web前端带来的便当的同时，还能让编译成绩尽可能小，这是它最大的亮点。如果你做的货色比较简单，不接依页面的兼容性问题，那么它不失为一个不错的跨端桌面程序解决方案。

常见问题

  • 在 windows 平台下 setup 报 gcc 找不到
Detected Platform: WindowsChecking for prerequisites...Error: Program 'gcc' not found. Please install gcc from here and try again: http://tdm-gcc.tdragon.net/download. You will need to add the bin directory to your path, EG: C:\TDM-GCC-64\bin\Program 'npm' found: C:\nodejs\npm.cmd

这里wails查看到了操作系统是 Windows，没有查看到 gcc，这里须要通过 mingw 装置下 gcc，并配置到 windows 的 path 环境变量。

  • package embed is not in GOROOT
C:\Users\xxx\go\pkg\mod\github.com\wailsapp\wails@v1.16.9\runtime\assets.go:3:8: package embed is not in GOROOT (C:\Users\xxx\.g\go\src\embed)

这是因为你应用的Golang 版本过低导致的，降级到 Go 1.16 就能解决。

  • missing go.sum entry for module providing package golang.org/x/text/transform
C:\Users\xxx\go\pkg\mod\github.com\wailsapp\wails@v1.16.9\runtime\window.go:13:2: missing go.sum entry for module providing package golang.org/x/text/transform (imported by github.com/wailsapp/wails/runtime); to add:    go get github.com/wailsapp/wails/runtime@v1.16.9

降级到 Go 1.17 可解决，具体起因我也不分明，有会的大佬通知我一下。

参考

  • https://mp.weixin.qq.com/s/nL...