跳到主要内容
版本:下个版本 🚧

模板

Wails 从预先创建的模板生成项目。 在 v1 中,这是一组难以维护的项目,这些项目可能会过时。 在 v2 中,为了增强社区的能力,为模板添加了一些新功能:

  • 能够从 远程模板 生成项目
  • 帮助创建自己的模板的工具

创建模板

要创建模板,您可以使用 wails generate template 命令。 要生成默认模板,请运行:

wails generate template -name mytemplate

这将使用默认文件创建“mytemplate”目录:

mytemplate/
.
|-- NEXTSTEPS.md
|-- README.md
|-- app.tmpl.go
|-- frontend
| `-- dist
| |-- assets
| | |-- fonts
| | | |-- OFL.txt
| | | `-- nunito-v16-latin-regular.woff2
| | `-- images
| | `-- logo-dark.svg
| |-- index.html
| |-- main.css
| `-- main.js
|-- go.mod.tmpl
|-- main.tmpl.go
|-- template.json
`-- wails.tmpl.json

模板概述

默认模板包含以下文件和目录:

文件名 / 目录描述
NEXTSTEPS.md有关如何完成模板的说明
README.md随模板发布的 README
app.tmpl.goapp.go 模板文件
frontend/包含前端资源的目录
go.mod.tmplgo.mod 模板文件
main.tmpl.gomain.go 模板文件
template.json模板元数据
wails.tmpl.jsonwails.json 模板文件

此时,建议按照 NEXTSTEPS.md 中的步骤操作。

从现有项目创建模板

通过在生成模板时将路径传递给项目,可以从现有的前端项目创建模板。 我们现在将介绍如何创建 Vue 3 模板:

  • 安装 vue cli: npm install -g @vue/cli
  • 创建默认项目:vue create vue3-base
    • 选择 Default (Vue 3) ([Vue 3] babel, eslint)
  • 项目生成后,运行:
> wails generate template -name wails-vue3-template -frontend .\vue3-base\
Extracting base template files...
Migrating existing project files to frontend directory...
Updating package.json data...
Renaming package.json -> package.tmpl.json...
Updating package-lock.json data...
Renaming package-lock.json -> package-lock.tmpl.json...
  • 现在可以按照 NEXTSTEPS.md 中指定的方式定制模板。
  • 一旦文件准备完毕,就可以通过运行命令来测试它:wails init -n my-vue3-project -t .\wails-vue3-template\
  • 要测试新项目,请运行:cd my-vue3-project then wails build
  • 项目编译完成后,运行它:.\build\bin\my-vue3-project.exe
  • 您应该有了一个功能齐全的 Vue3 应用程序:

发布模板

发布模板只是将文件推送到 GitHub。 鼓励以下最佳实践:

  • 从前端目录中删除任何不需要的文件和目录(例如:.git)
  • 确保 template.json 完整,尤其是 helpurl
  • 将文件推送到 GitHub
  • 社区模板 页面上创建 PR
  • 模板公告 讨论板上发布模板