mirror of
https://github.com/wailsapp/wails.git
synced 2025-05-02 13:51:10 +08:00
Lea Anthony
GitHub
parent
085d59612b
commit
4cedfdc091
@ -5,7 +5,7 @@ sidebar_position: 1
|
||||
# Templates
|
||||
|
||||
This page serves as a list for community supported templates. Please submit a PR (click `Edit this page` at the bottom)
|
||||
to include your templates. To build your own template, please see the [Templates](/docs/guides/templates) guide.
|
||||
to include your templates. To build your own template, please see the [Templates](../guides/templates.mdx) guide.
|
||||
|
||||
To use these templates, run `wails init -n "Your Project Name" -t [the link below[@version]]`
|
||||
|
||||
|
||||
@ -15,5 +15,5 @@ If you run the binary, you should see the default application:
|
||||
<br/>
|
||||
|
||||
|
||||
For more details on compilation options, please refer to the [CLI Reference](/docs/reference/cli#build).
|
||||
For more details on compilation options, please refer to the [CLI Reference](../reference/cli.mdx#build).
|
||||
|
||||
|
||||
@ -10,6 +10,6 @@ You can run your application in development mode by running `wails dev` from you
|
||||
- Watch for modifications in your Go files and rebuild/re-run on change
|
||||
- Sets up a [webserver](http://localhost:34115) that will serve your application over a browser. This allows you to use your favourite browser extensions. You can even call your Go code from the console.
|
||||
|
||||
To get started, run `wails dev` in the project directory. More information on this can be found [here](/docs/reference/cli#dev).
|
||||
To get started, run `wails dev` in the project directory. More information on this can be found [here](../reference/cli.mdx#dev).
|
||||
|
||||
Coming soon: Tutorial
|
||||
@ -12,10 +12,10 @@ To get up and running quickly, you can generate a default project by running `wa
|
||||
create a directory called `myproject` and populate it with the default template.
|
||||
|
||||
Other project templates are available and can be listed using `wails init -l`.
|
||||
There are also [community templates](/docs/community/templates) available that offer different capabilities and frameworks.
|
||||
There are also [community templates](../community/templates.mdx) available that offer different capabilities and frameworks.
|
||||
|
||||
To see the other options available, you can run `wails init -help`.
|
||||
More details can be found in the [CLI Reference](/docs/reference/cli#init).
|
||||
More details can be found in the [CLI Reference](../reference/cli.mdx#init).
|
||||
|
||||
## Project Layout
|
||||
|
||||
|
||||
@ -22,7 +22,7 @@ Wails has a number of common dependencies that are required before installation:
|
||||
|
||||
Download Go from the [Go Downloads Page](https://golang.org/dl/).
|
||||
|
||||
Ensure that you follow the official [Go installation instructions](https://golang.org/doc/install#install). You will also need to ensure that your `PATH` environment variable also includes the path to your `~/go/bin` directory. Restart your terminal and do the following checks:
|
||||
Ensure that you follow the official [Go installation instructions](https://golang.org/doc/install.mdx#install). You will also need to ensure that your `PATH` environment variable also includes the path to your `~/go/bin` directory. Restart your terminal and do the following checks:
|
||||
|
||||
- Check Go is installed correctly: `go version`
|
||||
- Check "~/go/bin" is in your PATH variable: `echo $PATH | grep go/bin`
|
||||
@ -61,8 +61,7 @@ import TabItem from "@theme/TabItem";
|
||||
<TabItem value="Linux">Linux required the standard <code>gcc</code> build tools plus <code>libgtk3</code> and <code>libwebkit</code>.
|
||||
Rather than list a ton of commands for different distros, Wails can try to determine
|
||||
what the installation commands are for your specific distribution. Run <code>wails doctor</code> after installation
|
||||
to be shown how to install the dependencies. If your distro/package manager is not supported, please consult the
|
||||
<a href="/docs/guides/linux-distro-support"> Add Linux Distro</a> guide.</TabItem>
|
||||
to be shown how to install the dependencies.</TabItem>
|
||||
</Tabs>
|
||||
|
||||
## Optional Dependencies
|
||||
|
||||
@ -30,7 +30,7 @@ func (a *App) shutdown(ctx context.Context) {
|
||||
- The startup method is called as soon as Wails allocates the resources it needs and is a good place for creating resources,
|
||||
setting up event listeners and anything else the application needs at startup.
|
||||
It is given a `context.Context` which is usually saved in a struct field. This context is needed for calling the
|
||||
[runtime](/docs/reference/runtime/intro). If this method returns an error, the application will terminate.
|
||||
[runtime](../reference/runtime/intro.mdx). If this method returns an error, the application will terminate.
|
||||
In dev mode, the error will be output to the console.
|
||||
|
||||
- The shutdown method will be called by Wails right at the end of the shutdown process. This is a good place to deallocate
|
||||
@ -59,7 +59,7 @@ func main() {
|
||||
|
||||
```
|
||||
|
||||
More information on application lifecycle hooks can be found [here](/docs/howdoesitwork#application-lifecycle-callbacks).
|
||||
More information on application lifecycle hooks can be found [here](../howdoesitwork.mdx#application-lifecycle-callbacks).
|
||||
|
||||
## Binding Methods
|
||||
|
||||
@ -113,11 +113,11 @@ func main() {
|
||||
|
||||
This will bind all public methods in our `App` struct (it will never bind the startup and shutdown methods).
|
||||
|
||||
More information on Binding can be found [here](/docs/howdoesitwork#method-binding).
|
||||
More information on Binding can be found [here](../howdoesitwork.mdx#method-binding).
|
||||
|
||||
## Application Menu
|
||||
|
||||
Wails supports adding a menu to your application. This is done by passing a [Menu](/docs/reference/menus#menu) struct
|
||||
Wails supports adding a menu to your application. This is done by passing a [Menu](../reference/menus.mdx#menu) struct
|
||||
to application config. It's common to use a method that returns a Menu, and even more common for that to be a method on
|
||||
the `App` struct used for the lifecycle hooks.
|
||||
|
||||
|
||||
@ -1,8 +1,8 @@
|
||||
|
||||
# Frameless Applications
|
||||
|
||||
Wails supports applications with no frame. This can be achieved by using the [frameless](/docs/reference/options#frameless)
|
||||
field in [Application Options](/docs/reference/options#application-options).
|
||||
Wails supports applications with no frame. This can be achieved by using the [frameless](../reference/options.mdx#frameless)
|
||||
field in [Application Options](../reference/options.mdx#application-options).
|
||||
|
||||
Wails offers a simple solution for dragging the window: Any HTML element that has the attribute "data-wails-drag" will
|
||||
act as a "drag handle". This property applies to all nested elements. If you need to indicate that a nested element
|
||||
|
||||
@ -25,7 +25,7 @@ Example:
|
||||
app.Run()
|
||||
```
|
||||
|
||||
In v2, there is just a single method, `wails.Run()`, that accepts [application options](/docs/reference/options#application-options).
|
||||
In v2, there is just a single method, `wails.Run()`, that accepts [application options](../reference/options.mdx#application-options).
|
||||
|
||||
```go title="v2"
|
||||
err := wails.Run(&options.App{
|
||||
@ -43,7 +43,7 @@ In v2, there is just a single method, `wails.Run()`, that accepts [application o
|
||||
|
||||
In v1, it was possible to bind both arbitrary functions and structs. In v2, this has been simplified to only binding structs.
|
||||
The struct instances that were previously passed to the `Bind()` method in v1, are now specified in the `Bind` field of
|
||||
the [application options](/docs/reference/options#application-options):
|
||||
the [application options](../reference/options.mdx#application-options):
|
||||
|
||||
```go title="v1"
|
||||
app := wails.CreateApp(/* options */)
|
||||
@ -64,13 +64,13 @@ In v1, bound methods were available to the frontend at `window.backend`. This ha
|
||||
### Application Lifecycle
|
||||
|
||||
In v1, there were 2 special methods in a bound struct: `WailsInit()` and `WailsShutdown()`. These have
|
||||
been replaced with 3 lifecycle hooks as part of the [application options](/docs/reference/options#application-options):
|
||||
been replaced with 3 lifecycle hooks as part of the [application options](../reference/options.mdx#application-options):
|
||||
|
||||
- [OnStartup](/docs/reference/options#onstartup)
|
||||
- [OnShutdown](/docs/reference/options#onshutdown)
|
||||
- [OnDomReady](/docs/reference/options#ondomready)
|
||||
- [OnStartup](../reference/options.mdx#onstartup)
|
||||
- [OnShutdown](../reference/options.mdx#onshutdown)
|
||||
- [OnDomReady](../reference/options.mdx#ondomready)
|
||||
|
||||
Note: [OnDomReady](/docs/reference/options#ondomready) replaces the `wails:ready` system event in v1.
|
||||
Note: [OnDomReady](../reference/options.mdx#ondomready) replaces the `wails:ready` system event in v1.
|
||||
|
||||
These methods can be standard functions, but a common practice is to have them part of a struct:
|
||||
|
||||
@ -96,11 +96,11 @@ func (b *Basic) startup(ctx context.Context) {
|
||||
|
||||
The runtime in v2 is much richer than v1 with support for menus, window manipulation
|
||||
and better dialogs. The signature of the methods has changed slightly - please refer
|
||||
the the [Runtime Reference](/docs/reference/runtime/intro).
|
||||
the the [Runtime Reference](../reference/runtime/intro.mdx).
|
||||
|
||||
In v1, the [runtime](/docs/reference/runtime/intro) was available via a struct passed to `WailsInit()`.
|
||||
In v1, the [runtime](../reference/runtime/intro.mdx) was available via a struct passed to `WailsInit()`.
|
||||
In v2, the runtime has been moved out to its own package. Each method in the runtime takes the
|
||||
`context.Context` that is passed to the [OnStartup](/docs/reference/options#onstartup) method.
|
||||
`context.Context` that is passed to the [OnStartup](../reference/options.mdx#onstartup) method.
|
||||
|
||||
```go title="Runtime Example"
|
||||
package main
|
||||
@ -173,7 +173,7 @@ func main() {
|
||||
|
||||
Of course, bundlers can be used if you wish to. The only requirement is to pass
|
||||
the final application assets directory to Wails using an `embed.FS` in the `Assets`
|
||||
key of the [application options](/docs/reference/options#application-options).
|
||||
key of the [application options](../reference/options.mdx#application-options).
|
||||
|
||||
### Project Configuration
|
||||
|
||||
|
||||
@ -20,7 +20,7 @@ const router = createRouter({
|
||||
|
||||
## Angular
|
||||
|
||||
The recommended approach for routing in Angular is [HashLocationStrategy](https://codecraft.tv/courses/angular/routing/routing-strategies/#_hashlocationstrategy):
|
||||
The recommended approach for routing in Angular is [HashLocationStrategy](https://codecraft.tv/courses/angular/routing/routing-strategies#_hashlocationstrategy):
|
||||
|
||||
```ts
|
||||
RouterModule.forRoot(routes, {useHash: true})
|
||||
|
||||
@ -4,7 +4,7 @@
|
||||
Wails generates projects from pre-created templates. In v1, this was a difficult to maintain set of projects that were
|
||||
subject to going out of date. In v2, to empower the community, a couple of new features have been added for templates:
|
||||
|
||||
- Ability to generate projects from [Remote Templates](/docs/reference/cli#remote-templates)
|
||||
- Ability to generate projects from [Remote Templates](../reference/cli.mdx#remote-templates)
|
||||
- Tooling to help create your own templates
|
||||
|
||||
## Creating Templates
|
||||
@ -91,5 +91,5 @@ Publishing a template is simply pushing the files to GitHub. The following best
|
||||
- Remove any unwanted files and directories (such as `.git`) from your frontend directory
|
||||
- Ensure that `template.json` is complete, especially `helpurl`
|
||||
- Push the files to GitHub
|
||||
- Create a PR on the [Community Templates](/docs/community/templates) page
|
||||
- Create a PR on the [Community Templates](../community/templates.mdx) page
|
||||
- Announce the template on the [Template Announcement](https://github.com/wailsapp/wails/discussions/825) discussion board
|
||||
|
||||
@ -83,7 +83,7 @@ This example has the following options set:
|
||||
- `OnShutdown` - A callback for when the application is about to quit
|
||||
- `Bind` - A slice of struct instances that we wish to expose to the frontend
|
||||
|
||||
A full list of application options can be found in the [Options Reference](/docs/reference/options).
|
||||
A full list of application options can be found in the [Options Reference](reference/options).
|
||||
|
||||
#### Assets
|
||||
|
||||
@ -108,17 +108,17 @@ the application.
|
||||
When running in development mode using the `wails dev` command, the assets are loaded off disk, and any changes result
|
||||
in a "live reload". The location of the assets will be inferred from the `embed.FS`.
|
||||
|
||||
More details can be found in the [Application Development Guide](/docs/guides/application-development).
|
||||
More details can be found in the [Application Development Guide](guides/application-development.mdx).
|
||||
|
||||
#### Application Lifecycle Callbacks
|
||||
|
||||
Just before the frontend is about to load `index.html`, a callback is made to the function provided in [OnStartup](/docs/reference/options#OnStartup).
|
||||
Just before the frontend is about to load `index.html`, a callback is made to the function provided in [OnStartup](reference/options.mdx#onstartup).
|
||||
A standard Go context is passed to this method. This context is required when calling the runtime so a standard pattern is to save
|
||||
a reference to in this method. Just before the application shuts down, the [OnShutdown](/docs/reference/options#OnShutdown) callback is called in the same way,
|
||||
again with the context. There is also an [OnDomReady](/docs/reference/options#OnDomReady) callback for when the frontend
|
||||
a reference to in this method. Just before the application shuts down, the [OnShutdown](reference/options.mdx#onshutdown) callback is called in the same way,
|
||||
again with the context. There is also an [OnDomReady](reference/options.mdx#ondomready) callback for when the frontend
|
||||
has completed loading all assets in `index.html` and is equivalent of the [`body onload`](https://www.w3schools.com/jsref/event_onload.asp) event in Javascript.
|
||||
It is also possible to hook into the window close (or application quit) event by setting the
|
||||
option [OnBeforeClose](/docs/reference/options#OnBeforeClose).
|
||||
option [OnBeforeClose](reference/options.mdx#onbeforeclose).
|
||||
|
||||
#### Method Binding
|
||||
|
||||
@ -227,8 +227,8 @@ is expecting a struct, will be converted to that struct type. To make this proce
|
||||
a TypeScript module is generated, defining all the struct types used in bound methods. Using this module, it's possible
|
||||
to construct and send native Javascript objects to the Go code.
|
||||
|
||||
More information on Binding can be found in the [Binding Methods](/docs/guides/application-development#binding-methods)
|
||||
section of the [Application Development Guide](/docs/guides/application-development).
|
||||
More information on Binding can be found in the [Binding Methods](guides/application-development.mdx#binding-methods)
|
||||
section of the [Application Development Guide](guides/application-development.mdx).
|
||||
|
||||
## The Frontend
|
||||
|
||||
@ -412,4 +412,4 @@ tasks such as emit an event or perform logging operations:
|
||||
window.runtime.EventsEmit("my-event", 1);
|
||||
```
|
||||
|
||||
More details about the JS runtime can be found in the [Runtime Reference](/docs/reference/runtime/intro).
|
||||
More details about the JS runtime can be found in the [Runtime Reference](reference/runtime/intro).
|
||||
|
||||
@ -29,7 +29,7 @@ Example:
|
||||
This will generate a a project called "test" in the "mytestproject" directory, initialise git,
|
||||
generate vscode project files and do so silently.
|
||||
|
||||
More information on using IDEs with Wails can be found [here](/docs/guides/ides).
|
||||
More information on using IDEs with Wails can be found [here](../guides/ides.mdx).
|
||||
|
||||
### Remote Templates
|
||||
|
||||
@ -38,7 +38,7 @@ Remote templates (hosted on GitHub) are supported and can be installed by using
|
||||
Example:
|
||||
`wails init -n test -t https://github.com/leaanthony/testtemplate[@v1.0.0]`
|
||||
|
||||
A list of community maintained templates can be found [here](/docs/community/templates)
|
||||
A list of community maintained templates can be found [here](../community/templates.mdx)
|
||||
|
||||
:::warning Attention
|
||||
|
||||
@ -54,7 +54,7 @@ A list of community maintained templates can be found [here](/docs/community/tem
|
||||
|
||||
| Flag | Description | Default |
|
||||
| :------------------- | :-------------------------------------- | :------------------------- |
|
||||
| -platform | Build for the given (comma delimited) [platforms](/docs/reference/cli#platforms) eg. `windows/arm64`. Note, if you do not give the architecture, `runtime.GOARCH` is used. | runtime.GOOS/runtime.GOARCH |
|
||||
| -platform | Build for the given (comma delimited) [platforms](../reference/cli.mdx#platforms) eg. `windows/arm64`. Note, if you do not give the architecture, `runtime.GOARCH` is used. | runtime.GOOS/runtime.GOARCH |
|
||||
| -clean | Cleans the `build/bin` directory | |
|
||||
| -compiler "compiler"| Use a different go compiler to build, eg go1.15beta1 | go |
|
||||
| -ldflags "flags" | Additional ldflags to pass to the compiler | |
|
||||
@ -70,9 +70,9 @@ A list of community maintained templates can be found [here](/docs/community/tem
|
||||
| -u | Updates your project's `go.mod` to use the same version of Wails as the CLI | |
|
||||
| -debug | Retains debug information in the application | false |
|
||||
|
||||
For a detailed description of the `webview2` flag, please refer to the [Windows](/docs/guides/windows) Guide.
|
||||
For a detailed description of the `webview2` flag, please refer to the [Windows](../guides/windows.mdx) Guide.
|
||||
|
||||
If you prefer to build using standard Go tooling, please consult the [Manual Builds](/docs/guides/manual-builds)
|
||||
If you prefer to build using standard Go tooling, please consult the [Manual Builds](../guides/manual-builds.mdx)
|
||||
guide.
|
||||
|
||||
Example:
|
||||
@ -182,12 +182,12 @@ Example:
|
||||
|
||||
This command will do the following:
|
||||
|
||||
- Build the application and run it (more details [here](/docs/guides/manual-builds)
|
||||
- Build the application and run it (more details [here](../guides/manual-builds.mdx)
|
||||
- Generate the Wails JS modules in `./frontend/src`
|
||||
- Watch for updates to files in `./frontend/dist` and reload on any change
|
||||
- Open a browser and connect to the application
|
||||
|
||||
There is more information on using this feature with existing framework scripts [here](/docs/guides/application-development#live-reloading).
|
||||
There is more information on using this feature with existing framework scripts [here](../guides/application-development.mdx#live-reloading).
|
||||
|
||||
## generate
|
||||
|
||||
@ -201,7 +201,7 @@ it may be used for generating projects.
|
||||
| -name | The template name (Mandatory) |
|
||||
| -frontend "path" | Path to frontend project to use in template |
|
||||
|
||||
For more details on creating templates, consult the [Templates guide](/docs/guides/templates).
|
||||
For more details on creating templates, consult the [Templates guide](../guides/templates.mdx).
|
||||
|
||||
## update
|
||||
|
||||
|
||||
@ -5,10 +5,10 @@ sidebar_position: 4
|
||||
# Menus
|
||||
|
||||
It is possible to add an application menu to Wails projects. This is achieved by defining a [Menu](#menu) struct and
|
||||
setting the [`Menu`](/docs/reference/options#menu) option, or by calling the runtime method [MenuSetApplicationMenu](/docs/reference/runtime/menu#menusetapplicationmenu).
|
||||
setting the [`Menu`](../reference/options.mdx#menu) option, or by calling the runtime method [MenuSetApplicationMenu](../reference/runtime/menu.mdx#menusetapplicationmenu).
|
||||
|
||||
It is also possible to dynamically update the menu, by updating the menu struct and calling
|
||||
[MenuUpdateApplicationMenu](/docs/reference/runtime/menu#menuupdateapplicationmenu).
|
||||
[MenuUpdateApplicationMenu](../reference/runtime/menu.mdx#menuupdateapplicationmenu).
|
||||
|
||||
Example:
|
||||
|
||||
|
||||
@ -137,7 +137,7 @@ Name: Frameless
|
||||
Type: bool
|
||||
|
||||
When set to `true`, the window will have no borders or title bar.
|
||||
Also see [Frameless Windows](/docs/guides/frameless).
|
||||
Also see [Frameless Windows](../guides/frameless.mdx).
|
||||
|
||||
### MinWidth
|
||||
|
||||
@ -181,7 +181,7 @@ Name: StartHidden
|
||||
|
||||
Type: bool
|
||||
|
||||
When set to `true`, the application will be hidden until [WindowShow](/docs/reference/runtime/window#WindowShow)
|
||||
When set to `true`, the application will be hidden until [WindowShow](../reference/runtime/window.mdx#windowshow)
|
||||
is called.
|
||||
|
||||
### HideWindowOnClose
|
||||
@ -225,7 +225,7 @@ Name: Menu
|
||||
|
||||
Type: \*menu.Menu
|
||||
|
||||
The menu to be used by the application. More details about Menus in the [Menu Reference](/docs/reference/runtime/menu).
|
||||
The menu to be used by the application. More details about Menus in the [Menu Reference](../reference/runtime/menu.mdx).
|
||||
|
||||
NOTE: On Mac, if no menu is specified, a default menu will be created.
|
||||
|
||||
@ -237,7 +237,7 @@ Type: logger.Logger
|
||||
|
||||
Default: Logger to Stdout
|
||||
|
||||
The logger to be used by the application. More details about logging in the [Log Reference](/docs/reference/runtime/log).
|
||||
The logger to be used by the application. More details about logging in the [Log Reference](../reference/runtime/log.mdx).
|
||||
|
||||
### LogLevel
|
||||
|
||||
@ -247,7 +247,7 @@ Type: logger.LogLevel
|
||||
|
||||
Default: `Info` in dev mode, `Error` in production mode
|
||||
|
||||
The default log level. More details about logging in the [Log Reference](/docs/reference/runtime/log).
|
||||
The default log level. More details about logging in the [Log Reference](../reference/runtime/log.mdx).
|
||||
|
||||
### OnStartup
|
||||
|
||||
|
||||
@ -8,15 +8,15 @@ The runtime is a library that provides utility methods for your application. The
|
||||
and the aim is to try and keep them at parity where possible.
|
||||
|
||||
The Go Runtime is available through importing `github.com/wailsapp/wails/v2/pkg/runtime`. All methods in this package
|
||||
take a context as the first parameter. This context should be obtained from the [OnStartup](/docs/reference/options#onstartup)
|
||||
or [OnDomReady](/docs/reference/options#ondomready) hooks.
|
||||
take a context as the first parameter. This context should be obtained from the [OnStartup](../options.mdx#onstartup)
|
||||
or [OnDomReady](../options.mdx#ondomready) hooks.
|
||||
|
||||
:::info Note
|
||||
|
||||
Whilst the context will be provided to the
|
||||
[OnStartup](/docs/reference/options#onstartup) method, there's no guarantee the runtime will work in this method as
|
||||
[OnStartup](../options.mdx#onstartup) method, there's no guarantee the runtime will work in this method as
|
||||
the window is initialising in a different thread. If
|
||||
you wish to call runtime methods at startup, use [OnDomReady](/docs/reference/options#ondomready).
|
||||
you wish to call runtime methods at startup, use [OnDomReady](../options.mdx#ondomready).
|
||||
|
||||
:::
|
||||
|
||||
|
||||
@ -96,7 +96,7 @@ Sets the log level. In Javascript, the number relates to the following log level
|
||||
|
||||
## Using a Custom Logger
|
||||
|
||||
A custom logger may be used by providing it using the [Logger](/docs/reference/options#logger)
|
||||
A custom logger may be used by providing it using the [Logger](../options.mdx#logger)
|
||||
application option. The only requirement is that the logger implements the `logger.Logger` interface
|
||||
defined in `github.com/wailsapp/wails/v2/pkg/logger`:
|
||||
|
||||
|
||||
@ -15,7 +15,7 @@ These methods are related to the application menu.
|
||||
### MenuSetApplicationMenu
|
||||
Go Signature: `MenuSetApplicationMenu(ctx context.Context, menu *menu.Menu)`
|
||||
|
||||
Sets the application menu to the given [menu](/docs/reference/menus) .
|
||||
Sets the application menu to the given [menu](../menus.mdx) .
|
||||
|
||||
### MenuUpdateApplicationMenu
|
||||
Go Signature: `MenuUpdateApplicationMenu(ctx context.Context)`
|
||||
|
||||
@ -117,7 +117,7 @@ sidebar_position: 99
|
||||
|
||||
## 贡献者
|
||||
|
||||
import Contributors from "react-github-contributors";
|
||||
import Contributors from "@wails/react-contributors";
|
||||
|
||||
<Contributors owner="wailsapp" repo="wails" />
|
||||
|
||||
|
||||
@ -67,8 +67,7 @@ import TabItem from "@theme/TabItem";
|
||||
<code>libwebkit</code>。与其为不同的发行版列出大量命令，Wails
|
||||
可以尝试确定针对您的特定发行版的安装命令。安装后运行
|
||||
<code>wails doctor</code>
|
||||
以显示如何安装依赖项。如果不支持您的发行版/包管理器，请参阅
|
||||
<a href="/docs/guides/linux-distro-support">添加Linux发行版</a>指南。
|
||||
以显示如何安装依赖项。
|
||||
</TabItem>
|
||||
</Tabs>
|
||||
|
||||
|
||||
BIN
website/static/img/showcase/hsk.png
Normal file
BIN
website/static/img/showcase/hsk.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 424 KiB |
@ -0,0 +1,4 @@
|
||||
{
|
||||
"label": "Appendix",
|
||||
"position": 70
|
||||
}
|
||||
36
website/versioned_docs/version-v2.0.0-beta.34/changelog.mdx
Normal file
36
website/versioned_docs/version-v2.0.0-beta.34/changelog.mdx
Normal file
@ -0,0 +1,36 @@
|
||||
---
|
||||
sidebar_position: 80
|
||||
---
|
||||
|
||||
# Changelog
|
||||
|
||||
All notable changes to this project will be documented in this file.
|
||||
|
||||
The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
|
||||
and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
|
||||
|
||||
## [Unreleased]
|
||||
|
||||
## [v2.0.0-beta.33] - 2022-03-05
|
||||
|
||||
### Added
|
||||
|
||||
- NSIS Installer support for creating installers for Windows applications - Thanks [@stffabi](https://github.com/stffabi) 🎉
|
||||
- New frontend:dev:watcher command to spin out 3rd party watchers when using wails dev - Thanks [@stffabi](https://github.com/stffabi)🎉
|
||||
- Remote templates now support version tags - Thanks [@misitebao](https://github.com/misitebao) 🎉
|
||||
|
||||
### Fixed
|
||||
|
||||
- A number of fixes for ARM Linux providing a huge improvement - Thanks [@ianmjones](https://github.com/ianmjones) 🎉
|
||||
- Fixed potential Nil reference when discovering the path to `index.html`
|
||||
- Fixed crash when using `runtime.Log` methods in a production build
|
||||
- Improvements to internal file handling meaning webworkers will now work on Windows - Thanks [@stffabi](https://github.com/stffabi)🎉
|
||||
|
||||
### Changed
|
||||
|
||||
- The Webview2 bootstrapper is now run as a normal user and doesn't require admin rights
|
||||
- The docs have been improved and updated
|
||||
- Added troubleshooting guide
|
||||
|
||||
[unreleased]: https://github.com/wailsapp/wails/compare/v2.0.0-beta.33...HEAD
|
||||
[v2.0.0-beta.33]: https://github.com/wailsapp/wails/compare/v2.0.0-beta.32...v2.0.0-beta.33
|
||||
@ -0,0 +1,4 @@
|
||||
{
|
||||
"label": "Community",
|
||||
"position": 50
|
||||
}
|
||||
@ -0,0 +1,24 @@
|
||||
---
|
||||
sidebar_position: 2
|
||||
---
|
||||
|
||||
# Links
|
||||
|
||||
This page serves as a list for community related links. Please submit a PR (click `Edit this page` at the bottom)
|
||||
to submit links.
|
||||
|
||||
## Awesome Wails
|
||||
|
||||
The [definitive list](https://github.com/wailsapp/awesome-wails) of links related to Wails.
|
||||
|
||||
## Support Channels
|
||||
|
||||
- [Gophers Slack Channel](https://gophers.slack.com/messages/CJ4P9F7MZ/)
|
||||
- [Gophers Slack Channel Invite](https://invite.slack.golangbridge.org/)
|
||||
- [Github Issues](https://github.com/wailsapp/wails/issues)
|
||||
- [v2 Beta Discussion Board](https://github.com/wailsapp/wails/discussions/828)
|
||||
|
||||
## Social Media
|
||||
|
||||
- [Twitter](https://twitter.com/wailsapp)
|
||||
- [Wails Chinese Community QQ Group](https://qm.qq.com/cgi-bin/qm/qr?k=PmIURne5hFGNd7QWzW5qd6FV-INEjNJv&jump_from=webapi) - Group number: 1067173054
|
||||
@ -0,0 +1,4 @@
|
||||
{
|
||||
"label": "Showcase",
|
||||
"position": 1
|
||||
}
|
||||
@ -0,0 +1,10 @@
|
||||
|
||||
# EncryptEasy
|
||||
|
||||
<p style={{"text-align": "center"}}>
|
||||
<img src="/img/showcase/encrypteasy.jpg"></img><br/>
|
||||
</p>
|
||||
|
||||
**[EncryptEasy](https://www.encrypteasy.app) is a simple and easy to use PGP encryption tool, managing all your and your contacts keys. Encryption should be simple. Developed with Wails.**
|
||||
|
||||
Encrypting messages using PGP is the industry standard. Everyone has a private and a public key. Your private key, well, needs to be kept private so only you can read messages. Your public key is distributed to anyone who wants to send you secret, encrypted messages. Managing keys, encrypting messages and decrypting messages should be a smooth experience. EncryptEasy is all about making it easy.
|
||||
@ -0,0 +1,23 @@
|
||||
|
||||
# FileHound Export Utility
|
||||
|
||||
<p style={{"text-align": "center"}}>
|
||||
<img src="/img/showcase/filehound.jpg"></img><br/>
|
||||
</p>
|
||||
|
||||
|
||||
[FileHound Export Utility](https://www.filehound.co.uk/) FileHound is a cloud document management platform made for secure file retention, business process automation and SmartCapture capabilities.
|
||||
|
||||
The FileHound Export Utility allows FileHound Administrators the ability to run a secure document and data extraction tasks for alternative back-up and recovery purposes. This application will download all documents and/or meta data saved in FileHound based on the filters you choose. The metadata will be exported in both JSON and XML formats.
|
||||
|
||||
Backend built with:
|
||||
Go 1.15
|
||||
Wails 1.11.0
|
||||
go-sqlite3 1.14.6
|
||||
go-linq 3.2
|
||||
|
||||
Frontend with:
|
||||
Vue 2.6.11
|
||||
Vuex 3.4.0
|
||||
Typescript
|
||||
Tailwind 1.9.6
|
||||
@ -0,0 +1,9 @@
|
||||
|
||||
# Molley Wallet
|
||||
|
||||
<p style={{"text-align": "center"}}>
|
||||
<img src="/img/showcase/mollywallet.png"></img><br/>
|
||||
</p>
|
||||
|
||||
[Molly Wallet](https://github.com/grvlle/constellation_wallet/) the official $DAG wallet of the Constellation Network. It'll let users interact with the Hypergraph Network in various ways, not limited to producing $DAG transactions.
|
||||
|
||||
@ -0,0 +1,9 @@
|
||||
|
||||
# Optimus
|
||||
|
||||
<p style={{"text-align": "center"}}>
|
||||
<img src="/img/showcase/optimus.png"></img><br/>
|
||||
</p>
|
||||
|
||||
[Optimus](https://github.com/splode/optimus) is a desktop image optimization application. It supports conversion and compression between WebP, JPEG, and PNG image formats.
|
||||
|
||||
@ -0,0 +1,9 @@
|
||||
|
||||
# Portfall
|
||||
|
||||
<p style={{"text-align": "center"}}>
|
||||
<img src="/img/showcase/portfall.gif"></img><br/>
|
||||
</p>
|
||||
|
||||
[Portfall](https://github.com/rekon-oss/portfall) - A desktop k8s port-forwarding portal for easy access to all your cluster UIs
|
||||
|
||||
@ -0,0 +1,19 @@
|
||||
|
||||
# RiftShare
|
||||
|
||||
<p style={{"text-align": "center"}}>
|
||||
<img src="/img/showcase/riftshare-main.webp"></img><br/>
|
||||
</p>
|
||||
|
||||
Easy, Secure, and Free file sharing for everyone. Learn more at [Riftshare.app](https://riftshare.app)
|
||||
|
||||
## Features
|
||||
|
||||
* Easy secure file sharing between computers both in the local network and through the internet
|
||||
* Supports sending files or directories securely through the [magic wormhole protocol](https://magic-wormhole.readthedocs.io/en/latest/)
|
||||
* Compatible with all other apps using magic wormhole (magic-wormhole or wormhole-william CLI, wormhole-gui, etc.)
|
||||
* Automatic zipping of multiple selected files to send at once
|
||||
* Full animations, progress bar, and cancellation support for sending and receiving
|
||||
* Native OS File Selection
|
||||
* Open files in one click once received
|
||||
* Auto Update - don't worry about having the latest release!
|
||||
@ -0,0 +1,9 @@
|
||||
|
||||
# Surge
|
||||
|
||||
<p style={{"text-align": "center"}}>
|
||||
<img src="/img/showcase/surge.png"></img><br/>
|
||||
</p>
|
||||
|
||||
[Surge](https://surge.rule110.io/) is a p2p filesharing app designed to utilize blockchain technologies to enable 100% anonymous file transfers. Surge is end-to-end encrypted, decentralized and open source.
|
||||
|
||||
@ -0,0 +1,9 @@
|
||||
|
||||
# Wally
|
||||
|
||||
<p style={{"text-align": "center"}}>
|
||||
<img src="/img/showcase/wally.png"></img><br/>
|
||||
</p>
|
||||
|
||||
[Wally](https://ergodox-ez.com/pages/wally) is the official firmware flasher for [Ergodox](https://ergodox-ez.com/) keyboards. It looks great and is a fantastic example of what you can achieve with Wails: the ability to combine the power of Go and the rich graphical tools of the web development world.
|
||||
|
||||
@ -0,0 +1,10 @@
|
||||
|
||||
# Wombat
|
||||
|
||||
<p style={{"text-align": "center"}}>
|
||||
<img src="/img/showcase/wombat.png"></img><br/>
|
||||
</p>
|
||||
|
||||
|
||||
[Wombat](https://github.com/rogchap/wombat) is a cross platform gRPC client.
|
||||
|
||||
@ -0,0 +1,10 @@
|
||||
|
||||
# Ytd
|
||||
|
||||
<p>
|
||||
<img src="/img/showcase/ytd.png"></img><br/>
|
||||
</p>
|
||||
|
||||
|
||||
[Ytd](https://github.com/marcio199226/ytd/tree/v2-wails) is an app for downloading tracks from youtube, creating offline playlists and share them with your friends, your friends will be able to playback your playlists or download them for offline listening, has an built-in player.
|
||||
|
||||
@ -0,0 +1,43 @@
|
||||
---
|
||||
sidebar_position: 1
|
||||
---
|
||||
|
||||
# Templates
|
||||
|
||||
This page serves as a list for community supported templates. Please submit a PR (click `Edit this page` at the bottom)
|
||||
to include your templates. To build your own template, please see the [Templates](/docs/guides/templates) guide.
|
||||
|
||||
To use these templates, run `wails init -n "Your Project Name" -t [the link below[@version]]`
|
||||
|
||||
If there is no version suffix, the main branch code template is used by default. If there is a version suffix, the code template corresponding to the tag of this version is used.
|
||||
|
||||
Example: `wails init -n "Your Project Name" -t https://github.com/misitebao/wails-template-vue`
|
||||
|
||||
:::warning Attention
|
||||
|
||||
**The Wails project does not maintain, is not responsible nor liable for 3rd party templates!**
|
||||
|
||||
If you are unsure about a template, inspect `package.json` and `wails.json` for what scripts are run and what packages are installed.
|
||||
|
||||
:::
|
||||
|
||||
## Vue
|
||||
|
||||
- [wails-template-vue](https://github.com/misitebao/wails-template-vue) - A template using Vite,Vue and Vue-Router(Support both JavaScript and TypeScript)
|
||||
- [wails-vite-vue-ts](https://github.com/codydbentley/wails-vite-vue-ts) - Vue 3 TypeScript with Vite (and instructions to add features)
|
||||
- [wails-vite-vue-the-works](https://github.com/codydbentley/wails-vite-vue-the-works) - Vue 3 TypeScript with Vite, Vuex, Vue Router, Sass, and ESLint + Prettier
|
||||
|
||||
## Angular
|
||||
|
||||
- [wails-angular-template](https://github.com/TAINCER/wails-angular-template) - Angular with TypeScript, Sass, Hot-Reload, Code-Splitting and i18n
|
||||
|
||||
## React
|
||||
|
||||
- [wails-react-template](https://github.com/AlienRecall/wails-react-template) - A template using reactjs
|
||||
- [wails-react-template](https://github.com/flin7/wails-react-template) - A minimal template for React that supports live development
|
||||
|
||||
## Svelte
|
||||
|
||||
- [wails-svelte-template](https://github.com/raitonoberu/wails-svelte-template) - A template using Svelte
|
||||
- [wails-vite-svelte-template](https://github.com/BillBuilt/wails-vite-svelte-template) - A template using Svelte and Vite
|
||||
- [wails-vite-svelte-tailwind-template](https://github.com/BillBuilt/wails-vite-svelte-tailwind-template) - A template using Svelte and Vite with TailwindCSS v3
|
||||
133
website/versioned_docs/version-v2.0.0-beta.34/credits.mdx
Normal file
133
website/versioned_docs/version-v2.0.0-beta.34/credits.mdx
Normal file
@ -0,0 +1,133 @@
|
||||
---
|
||||
sidebar_position: 99
|
||||
---
|
||||
|
||||
# Credits
|
||||
|
||||
- [Lea Anthony](https://github.com/leaanthony) - Project owner, lead developer
|
||||
- [Misitebao](https://github.com/misitebao) - Chinese documentation, Windows testing, Bug finder general
|
||||
- [Travis McLane](https://github.com/tmclane) - Cross-compilation work, MacOS testing
|
||||
- [Byron Chris](https://github.com/bh90210) - Linux distro wizard, Linux testing
|
||||
|
||||
## Sponsors
|
||||
|
||||
<div
|
||||
dangerouslySetInnerHTML={{
|
||||
__html: `
|
||||
<a href="https://github.com/sponsors/leaanthony" style="width:100px;">
|
||||
<img src="/img/silver%20sponsor.png" width="100"/>
|
||||
</a>
|
||||
<a href="https://github.com/letheanVPN" style="width:100px;">
|
||||
<img src="https://github.com/letheanVPN.png?size=100" width="100"/>
|
||||
</a>
|
||||
<br/>
|
||||
<br/>
|
||||
<a href="https://github.com/sponsors/leaanthony" style="width:100px;">
|
||||
<img src="/img/bronze%20sponsor.png" width="100"/>
|
||||
</a>
|
||||
<a href="https://github.com/snider" style="width:100px;">
|
||||
<img src="https://github.com/snider.png?size=100" width="100"/>
|
||||
</a>
|
||||
<a href="https://github.com/codydbentley" style="width:100px">
|
||||
<img src="https://github.com/codydbentley.png?size=100" width="100"/>
|
||||
</a>
|
||||
<a href="https://github.com/CrackDavid" style="width:100px">
|
||||
<img src="https://github.com/CrackDavid.png?size=100" width="100"/>
|
||||
</a>
|
||||
<a href="https://www.easywebadv.it/" style="width:100px">
|
||||
<img src="/img/easyweb.png" width="100"/>
|
||||
</a>
|
||||
<br/>
|
||||
<br/>
|
||||
<a href="https://github.com/matryer" style="width:100px">
|
||||
<img src="https://github.com/matryer.png" width="100"/>
|
||||
</a>
|
||||
<a href="https://www.jetbrains.com?from=Wails" style="width:100px">
|
||||
<img src="/img/jetbrains-grayscale.png" width="100"/>
|
||||
</a>
|
||||
<a href="https://github.com/tc-hib" style="width:55px">
|
||||
<img src="https://github.com/tc-hib.png?size=55" width="55"/>
|
||||
</a>
|
||||
<a href="https://github.com/picatz" style="width:50px">
|
||||
<img src="https://github.com/picatz.png?size=50" width="50"/>
|
||||
</a>
|
||||
<a href="https://github.com/tylertravisty" style="width:50px">
|
||||
<img src="https://github.com/tylertravisty.png?size=50" width="50"/>
|
||||
</a>
|
||||
<a href="https://github.com/akhudek" style="width:50px">
|
||||
<img src="https://github.com/akhudek.png?size=50" width="50"/>
|
||||
</a>
|
||||
<a href="https://github.com/trea" style="width:50px">
|
||||
<img src="https://github.com/trea.png?size=50" width="50"/>
|
||||
</a>
|
||||
<a href="https://github.com/LanguageAgnostic" style="width:55px">
|
||||
<img src="https://github.com/LanguageAgnostic.png?size=55" width="55"/>
|
||||
</a>
|
||||
<a href="https://github.com/fcjr" style="width:55px">
|
||||
<img src="https://github.com/fcjr.png?size=55" width="55"/>
|
||||
</a>
|
||||
<a href="https://github.com/nickarellano" style="width:60px">
|
||||
<img src="https://github.com/nickarellano.png?size=60" width="60"/>
|
||||
</a>
|
||||
<a href="https://github.com/bglw" style="width:65px">
|
||||
<img src="https://github.com/bglw.png?size=65" width="65"/>
|
||||
</a>
|
||||
<a href="https://github.com/jugglingjsons" style="width:50px">
|
||||
<img src="https://github.com/jugglingjsons.png?size=50" width="50"/>
|
||||
</a>
|
||||
<a href="https://github.com/marcus-crane" style="width:65px">
|
||||
<img src="https://github.com/marcus-crane.png?size=65" width="65"/>
|
||||
</a>
|
||||
<a href="https://github.com/bbergshaven" style="width:45px">
|
||||
<img src="https://github.com/bbergshaven.png?size=45" width="45"/>
|
||||
</a>
|
||||
<a href="https://github.com/Gilgames000" style="width:45px">
|
||||
<img src="https://github.com/Gilgames000.png?size=45" width="45"/>
|
||||
</a>
|
||||
<a href="https://github.com/ilgityildirim" style="width:50px">
|
||||
<img src="https://github.com/ilgityildirim.png?size=50" width="50"/>
|
||||
</a>
|
||||
<a href="https://github.com/questrail" style="width:50px">
|
||||
<img src="https://github.com/questrail.png?size=50" width="50"/>
|
||||
</a>
|
||||
<a href="https://github.com/DonTomato" style="width:45px">
|
||||
<img src="https://github.com/DonTomato.png?size=45" width="45"/>
|
||||
</a>
|
||||
<a href="https://github.com/taigrr" style="width:55px">
|
||||
<img src="https://github.com/taigrr.png?size=55" width="55"/>
|
||||
</a>
|
||||
<a href="https://github.com/charlie-dee" style="width:55px">
|
||||
<img src="https://github.com/charlie-dee.png?size=55" width="55"/>
|
||||
</a>
|
||||
<a href="https://github.com/EdenNetworkItalia" style="width:65px">
|
||||
<img src="https://github.com/EdenNetworkItalia.png?size=65" width="65"/>
|
||||
</a>
|
||||
<a href="https://github.com/michaelolson1996" style="width:55px">
|
||||
<img src="https://github.com/michaelolson1996.png?size=55" width="55"/>
|
||||
</a>
|
||||
<a href="https://github.com/GargantuaX" style="width:45px">
|
||||
<img src="https://github.com/GargantuaX.png?size=45" width="45"/>
|
||||
</a>
|
||||
<a href="https://github.com/brodyover" style="width:45px">
|
||||
<img src="https://github.com/brodyover.png?size=45" width="45"/>
|
||||
</a>
|
||||
`,
|
||||
}}
|
||||
/>
|
||||
|
||||
## Contributors
|
||||
|
||||
import Contributors from "@wails/react-contributors";
|
||||
|
||||
<Contributors owner="wailsapp" repo="wails" />
|
||||
|
||||
## Special Mentions
|
||||
|
||||
- [John Chadwick](https://github.com/jchv) - His amazing work on [go-webview2](https://github.com/jchv/go-webview2) and
|
||||
[go-winloader](https://github.com/jchv/go-winloader) have made the Windows version possible.
|
||||
- [Tad Vizbaras](https://github.com/tadvi) - His winc project was the first step down the path to a pure Go Wails.
|
||||
- [Mat Ryer](https://github.com/matryer) - For advice, support and bants.
|
||||
- [Dustin Krysak](https://wiki.ubuntu.com/bashfulrobot) - His support and feedback has been invaluable.
|
||||
- [Justen Walker](https://github.com/justenwalker/) - For helping wrangle COM issues which got v2 over the line.
|
||||
- [Wang, Chi](https://github.com/patr0nus/) - The DeskGap project was a huge influence on the direction of Wails v2.
|
||||
- [Serge Zaitsev](https://github.com/zserge) - Whilst Wails does not use the Webview project, it is still a source of inspiration.
|
||||
5
website/versioned_docs/version-v2.0.0-beta.34/faq.mdx
Normal file
5
website/versioned_docs/version-v2.0.0-beta.34/faq.mdx
Normal file
@ -0,0 +1,5 @@
|
||||
---
|
||||
sidebar_position: 60
|
||||
---
|
||||
|
||||
# FAQ
|
||||
@ -0,0 +1,4 @@
|
||||
{
|
||||
"label": "Getting Started",
|
||||
"position": 10
|
||||
}
|
||||
@ -0,0 +1,19 @@
|
||||
---
|
||||
sidebar_position: 6
|
||||
---
|
||||
|
||||
# Compiling your Project
|
||||
|
||||
From the project directory, run `wails build`.
|
||||
This will compile your project and save the production-ready binary in the `build/bin` directory.
|
||||
|
||||
If you run the binary, you should see the default application:
|
||||
|
||||
<div class="text--center">
|
||||
<img src="/img/defaultproject.png" width="50%" style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px"}}/>
|
||||
</div>
|
||||
<br/>
|
||||
|
||||
|
||||
For more details on compilation options, please refer to the [CLI Reference](/docs/reference/cli#build).
|
||||
|
||||
@ -0,0 +1,15 @@
|
||||
---
|
||||
sidebar_position: 5
|
||||
---
|
||||
|
||||
# Developing your Application
|
||||
|
||||
You can run your application in development mode by running `wails dev` from your project directory. This will do the following things:
|
||||
|
||||
- Build your application and run it
|
||||
- Watch for modifications in your Go files and rebuild/re-run on change
|
||||
- Sets up a [webserver](http://localhost:34115) that will serve your application over a browser. This allows you to use your favourite browser extensions. You can even call your Go code from the console.
|
||||
|
||||
To get started, run `wails dev` in the project directory. More information on this can be found [here](/docs/reference/cli#dev).
|
||||
|
||||
Coming soon: Tutorial
|
||||
@ -0,0 +1,54 @@
|
||||
---
|
||||
sidebar_position: 2
|
||||
---
|
||||
|
||||
# Creating a Project
|
||||
|
||||
## Project Generation
|
||||
|
||||
Now that the CLI is installed, you can generate a new project by using the `wails init` command.
|
||||
|
||||
To get up and running quickly, you can generate a default project by running `wails init -n myproject`. This will
|
||||
create a directory called `myproject` and populate it with the default template.
|
||||
|
||||
Other project templates are available and can be listed using `wails init -l`.
|
||||
There are also [community templates](/docs/community/templates) available that offer different capabilities and frameworks.
|
||||
|
||||
To see the other options available, you can run `wails init -help`.
|
||||
More details can be found in the [CLI Reference](/docs/reference/cli#init).
|
||||
|
||||
## Project Layout
|
||||
|
||||
Wails projects have the following layout:
|
||||
|
||||
```
|
||||
.
|
||||
├── build/
|
||||
│ ├── appicon.png
|
||||
│ ├── darwin/
|
||||
│ └── windows/
|
||||
├── frontend/
|
||||
├── go.mod
|
||||
├── go.sum
|
||||
├── main.go
|
||||
└── wails.json
|
||||
```
|
||||
|
||||
### Project structure rundown
|
||||
|
||||
- `/main.go` - The main application
|
||||
- `/frontend/` - Frontend project files
|
||||
- `/build/` - Project build directory
|
||||
- `/build/appicon.png` - The application icon
|
||||
- `/build/darwin/` - Mac specific project files
|
||||
- `/build/windows/` - Windows specific project files
|
||||
- `/wails.json` - The project configuration
|
||||
- `/go.mod` - Go module file
|
||||
- `/go.sum` - Go module checksum file
|
||||
|
||||
The `frontend` directory has nothing specific to Wails and can be any frontend project of your choosing.
|
||||
|
||||
The `build` directory is used during the build process. These files may be updated to customise your builds. If
|
||||
files are removed from the build directory, default versions will be regenerated.
|
||||
|
||||
The default module name in `go.mod` is "changeme". You should change this to something more appropriate.
|
||||
@ -0,0 +1,77 @@
|
||||
---
|
||||
sidebar_position: 1
|
||||
---
|
||||
|
||||
# Installation
|
||||
|
||||
## Supported Platforms
|
||||
|
||||
- Windows 10/11 AMD64/ARM64
|
||||
- MacOS 10.13+ AMD64
|
||||
- MacOS 11.0+ ARM64
|
||||
- Linux AMD64/ARM64
|
||||
|
||||
## Dependencies
|
||||
|
||||
Wails has a number of common dependencies that are required before installation:
|
||||
|
||||
- Go 1.17+
|
||||
- NPM (Node 15+)
|
||||
|
||||
### Go
|
||||
|
||||
Download Go from the [Go Downloads Page](https://golang.org/dl/).
|
||||
|
||||
Ensure that you follow the official [Go installation instructions](https://golang.org/doc/install#install). You will also need to ensure that your `PATH` environment variable also includes the path to your `~/go/bin` directory. Restart your terminal and do the following checks:
|
||||
|
||||
- Check Go is installed correctly: `go version`
|
||||
- Check "~/go/bin" is in your PATH variable: `echo $PATH | grep go/bin`
|
||||
|
||||
### NPM
|
||||
|
||||
Download NPM from the [Node Downloads Page](https://nodejs.org/en/download/). It is best to use the latest release as that is what we generally test against.
|
||||
|
||||
Run `npm --version` to verify.
|
||||
|
||||
## Platform Specific Dependencies
|
||||
|
||||
You will also need to install platform specific dependencies:
|
||||
|
||||
import Tabs from "@theme/Tabs";
|
||||
import TabItem from "@theme/TabItem";
|
||||
|
||||
<Tabs
|
||||
defaultValue="Windows"
|
||||
values={[
|
||||
{ label: "Windows", value: "Windows" },
|
||||
{ label: "MacOS", value: "MacOS" },
|
||||
{ label: "Linux", value: "Linux" },
|
||||
]}
|
||||
>
|
||||
<TabItem value="MacOS">
|
||||
Wails requires that the xcode command line tools are installed. This can be done by running:<br/>
|
||||
|
||||
<code>xcode-select --install</code>
|
||||
</TabItem>
|
||||
<TabItem value="Windows">
|
||||
Wails requires that the <a href="https://developer.microsoft.com/en-us/microsoft-edge/webview2/">WebView2</a>{" "}
|
||||
runtime is installed. Some Windows installations will already have this installed. You can check using the{" "}
|
||||
<code>wails doctor</code> command (see below).
|
||||
</TabItem>
|
||||
<TabItem value="Linux">Linux required the standard <code>gcc</code> build tools plus <code>libgtk3</code> and <code>libwebkit</code>.
|
||||
Rather than list a ton of commands for different distros, Wails can try to determine
|
||||
what the installation commands are for your specific distribution. Run <code>wails doctor</code> after installation
|
||||
to be shown how to install the dependencies.</TabItem>
|
||||
</Tabs>
|
||||
|
||||
## Optional Dependencies
|
||||
|
||||
- [UPX](https://upx.github.io/) for compressing your applications.
|
||||
|
||||
## Installing Wails
|
||||
|
||||
Run `go install github.com/wailsapp/wails/v2/cmd/wails@latest` to install the Wails CLI.
|
||||
|
||||
## System Check
|
||||
|
||||
Running `wails doctor` will check if you have the correct dependencies installed. If not, it will advise on what is missing and help on how to rectify any problems.
|
||||
@ -0,0 +1,4 @@
|
||||
{
|
||||
"label": "Guides",
|
||||
"position": 50
|
||||
}
|
||||
@ -0,0 +1,188 @@
|
||||
|
||||
# Application Development
|
||||
|
||||
There are no hard and fast rules for developing applications with Wails, but there are some basic guidelines.
|
||||
|
||||
## Application Setup
|
||||
|
||||
The pattern used by the default templates are that `main.go` is used for configuring and running the application, whilst
|
||||
`app.go` is used for defining the application logic.
|
||||
|
||||
The `app.go` file will define a struct that has 2 methods which act as hooks into the main application:
|
||||
|
||||
```go title="app.go"
|
||||
type App struct {
|
||||
ctx context.Context
|
||||
}
|
||||
|
||||
func NewApp() *App {
|
||||
return &App{}
|
||||
}
|
||||
|
||||
func (a *App) startup(ctx context.Context) {
|
||||
a.ctx = ctx
|
||||
}
|
||||
|
||||
func (a *App) shutdown(ctx context.Context) {
|
||||
}
|
||||
```
|
||||
|
||||
- The startup method is called as soon as Wails allocates the resources it needs and is a good place for creating resources,
|
||||
setting up event listeners and anything else the application needs at startup.
|
||||
It is given a `context.Context` which is usually saved in a struct field. This context is needed for calling the
|
||||
[runtime](/docs/reference/runtime/intro). If this method returns an error, the application will terminate.
|
||||
In dev mode, the error will be output to the console.
|
||||
|
||||
- The shutdown method will be called by Wails right at the end of the shutdown process. This is a good place to deallocate
|
||||
memory and perform any shutdown tasks.
|
||||
|
||||
The `main.go` file generally consists of a single call to `wails.Run()`, which accepts the application configuration.
|
||||
The pattern used by the templates is that before the call to `wails.Run()`, an instance of the struct we defined in
|
||||
`app.go` is created and saved in a variable called `app`. This configuration is where we add our callbacks:
|
||||
|
||||
```go {3,9,10} title="main.go"
|
||||
func main() {
|
||||
|
||||
app := NewApp()
|
||||
|
||||
err := wails.Run(&options.App{
|
||||
Title: "My App",
|
||||
Width: 800,
|
||||
Height: 600,
|
||||
OnStartup: app.startup,
|
||||
OnShutdown: app.shutdown,
|
||||
})
|
||||
if err != nil {
|
||||
log.Fatal(err)
|
||||
}
|
||||
}
|
||||
|
||||
```
|
||||
|
||||
More information on application lifecycle hooks can be found [here](/docs/howdoesitwork#application-lifecycle-callbacks).
|
||||
|
||||
## Binding Methods
|
||||
|
||||
It is likely that you will want to call Go methods from the frontend. This is normally done by adding public methods to
|
||||
the already defined struct in `app.go`:
|
||||
|
||||
```go {16-18} title="app.go"
|
||||
type App struct {
|
||||
ctx context.Context
|
||||
}
|
||||
|
||||
func NewApp() *App {
|
||||
return &App{}
|
||||
}
|
||||
|
||||
func (a *App) startup(ctx context.Context) {
|
||||
a.ctx = ctx
|
||||
}
|
||||
|
||||
func (a *App) shutdown(ctx context.Context) {
|
||||
}
|
||||
|
||||
func (a *App) Greet(name string) string {
|
||||
return fmt.Printf("Hello %s!", name)
|
||||
}
|
||||
```
|
||||
|
||||
In the main application configuration, the `Bind` key is where we can tell Wails what we want to bind:
|
||||
|
||||
```go {11-13} title="main.go"
|
||||
func main() {
|
||||
|
||||
app := NewApp()
|
||||
|
||||
err := wails.Run(&options.App{
|
||||
Title: "My App",
|
||||
Width: 800,
|
||||
Height: 600,
|
||||
OnStartup: app.startup,
|
||||
OnShutdown: app.shutdown,
|
||||
Bind: []interface{}{
|
||||
app,
|
||||
},
|
||||
})
|
||||
if err != nil {
|
||||
log.Fatal(err)
|
||||
}
|
||||
}
|
||||
|
||||
```
|
||||
|
||||
This will bind all public methods in our `App` struct (it will never bind the startup and shutdown methods).
|
||||
|
||||
More information on Binding can be found [here](/docs/howdoesitwork#method-binding).
|
||||
|
||||
## Application Menu
|
||||
|
||||
Wails supports adding a menu to your application. This is done by passing a [Menu](/docs/reference/menus#menu) struct
|
||||
to application config. It's common to use a method that returns a Menu, and even more common for that to be a method on
|
||||
the `App` struct used for the lifecycle hooks.
|
||||
|
||||
```go {11} title="main.go"
|
||||
func main() {
|
||||
|
||||
app := NewApp()
|
||||
|
||||
err := wails.Run(&options.App{
|
||||
Title: "My App",
|
||||
Width: 800,
|
||||
Height: 600,
|
||||
OnStartup: app.startup,
|
||||
OnShutdown: app.shutdown,
|
||||
Menu: app.menu(),
|
||||
Bind: []interface{}{
|
||||
app,
|
||||
},
|
||||
})
|
||||
if err != nil {
|
||||
log.Fatal(err)
|
||||
}
|
||||
}
|
||||
|
||||
```
|
||||
|
||||
## Assets
|
||||
|
||||
The great thing about the way Wails v2 handles assets is that it doesn't! The only thing you need to give Wails is an
|
||||
`embed.FS`. How you get to that is entirely up to you. You can use vanilla html/css/js files like the vanilla template.
|
||||
You could have some complicated build system, it doesn't matter.
|
||||
|
||||
When `wails build` is run, it will check the `wails.json` project file at the project root. There are 2 keys in the
|
||||
project file that are read:
|
||||
|
||||
- "frontend:install"
|
||||
- "frontend:build"
|
||||
|
||||
The first, if given, will be executed in the `frontend` directory to install the node modules.
|
||||
The second, if given, will be executed in the `frontend` directory to build the frontend project.
|
||||
|
||||
If these 2 keys aren't given, then Wails does absolutely nothing with the frontend. It is only expecting that `embed.FS`.
|
||||
|
||||
## Built in Dev Server
|
||||
|
||||
Running `wails dev` will start the built in dev server which will start a file watcher in your project directory. By
|
||||
default, if any file changes, wails checks if it was an application file (default: `.go`, configurable with `-e` flag).
|
||||
If it was, then it will rebuild your application and relaunch it. If the changed file was in the assets,
|
||||
it will issue a reload after a short amount of time.
|
||||
|
||||
The dev server uses a technique called "debouncing" which means it doesn't reload straight away,
|
||||
as there may be multiple files changed in a short amount of time. When a trigger occurs, it waits for a set amount of time
|
||||
before issuing a reload. If another trigger happens, it resets to the wait time again. By default this value is `100ms`.
|
||||
If this value doesn't work for your project, it can be configured using the `-debounce` flag. If used, this value will
|
||||
be saved to your project config and become the default.
|
||||
|
||||
## External Dev Server
|
||||
|
||||
Some frameworks come with their own live-reloading server, however they will not be able to take advantage of the Wails
|
||||
Go bindings. In this scenario, it is best to run a watcher script that rebuilds the project into the build directory, which
|
||||
Wails will be watching. For an example, see the default svelte template that uses [rollup](https://rollupjs.org/guide/en/).
|
||||
For [create-react-app](https://create-react-app.dev/), it's possible to use
|
||||
[this script](https://gist.github.com/int128/e0cdec598c5b3db728ff35758abdbafd) to achieve a similar result.
|
||||
|
||||
## Go Module
|
||||
|
||||
The default Wails templates generate a `go.mod` file that contains the module name "changeme". You should change this
|
||||
to something more appropriate after project generation.
|
||||
@ -0,0 +1,41 @@
|
||||
|
||||
# Bleeding Edge
|
||||
|
||||
## Overview
|
||||
|
||||
Wails is in constant development and new releases are regularly "tagged". This usually happens when all the newer code
|
||||
on `master` has been tested and confirmed working. If you need a bugfix or feature that has not yet made it to a release,
|
||||
it's possible to use the latest "bleeding edge" version using the following steps:
|
||||
|
||||
- `git clone https://github.com/wailsapp/wails`
|
||||
- `cd wails/v2/cmd/wails`
|
||||
- `go install`
|
||||
|
||||
NOTE: The directory that you cloned the project into will now be called "clonedir".
|
||||
|
||||
The Wails CLI will now be at the very latest version. To update projects to use the latest version, update the project's
|
||||
`go.mod` and ensure the following line is at the bottom of the file:
|
||||
|
||||
`replace github.com/wailsapp/wails/v2 => <clonedir>`
|
||||
|
||||
Example:
|
||||
|
||||
On Windows:
|
||||
`replace github.com/wailsapp/wails/v2 => C:\Users\leaan\Documents\wails-v2-beta\wails\v2`
|
||||
|
||||
On 'nix:
|
||||
`replace github.com/wailsapp/wails/v2 => /home/me/projects/wails/v2`
|
||||
|
||||
To revert back to a stable version, run:
|
||||
|
||||
`go install github.com/wailsapp/wails/v2/cmd/wails@latest`
|
||||
|
||||
## Testing a Branch
|
||||
|
||||
If you want to test a branch, follow the instructions above, but ensure you switch the branch you want to test before installing:
|
||||
|
||||
- `git clone https://github.com/wailsapp/wails`
|
||||
- `git checkout -b branch-to-test --track origin/branch-to-test`
|
||||
- `cd wails/v2/cmd/wails`
|
||||
- `go install`
|
||||
|
||||
@ -0,0 +1,39 @@
|
||||
|
||||
# Contributing
|
||||
|
||||
This page is a guide on how to contribute to the Wails project.
|
||||
|
||||
First, a word of warning: Wails v2 has been through a number of iterations and pivots. There is a lot of code that
|
||||
is either on hold or deprecated. Reading the whole project and trying to understand it may be confusing. This document
|
||||
aims to focus on what is current and how to understand that.
|
||||
|
||||
## Bugs
|
||||
|
||||
For raising bugs, please open a ticket on GitHub and give it the \[v2\] label. Include the output of `wails doctor`
|
||||
in the ticket to help us understand your environment.
|
||||
|
||||
For fixing bugs, please comment on a ticket that you'd like to take it on and we will put a label on the ticket.
|
||||
It is best to use Windows as it is done in pure Go, making debugging much easier.
|
||||
|
||||
## Features
|
||||
|
||||
To request a new feature, raise a ticket so that it may be discussed. The ticket should be given the
|
||||
"Feature Request" label. These will be discussed and if selected for development will be given the label
|
||||
"Ready for Development".
|
||||
|
||||
To implement a new feature, raise a ticket as above or select a ticket with the "Ready for Development" label.
|
||||
|
||||
When raising a PR, be mindful to state what platforms the PR has been tested on. Any new feature will not be accepted unless it works
|
||||
on all platforms (if it can).
|
||||
|
||||
:::warning What not to do
|
||||
|
||||
PRs for features with no tickets aren't helpful as there's no context to the PR and it will not be prioritised.
|
||||
|
||||
:::
|
||||
|
||||
## Documentation
|
||||
|
||||
Contributing to the documentation is easy by clicking on the "Edit this page" link on any of the pages. Documentation
|
||||
updates can be done ad-hoc, without a ticket.
|
||||
|
||||
@ -0,0 +1,35 @@
|
||||
|
||||
# Frameless Applications
|
||||
|
||||
Wails supports applications with no frame. This can be achieved by using the [frameless](/docs/reference/options#frameless)
|
||||
field in [Application Options](/docs/reference/options#application-options).
|
||||
|
||||
Wails offers a simple solution for dragging the window: Any HTML element that has the attribute "data-wails-drag" will
|
||||
act as a "drag handle". This property applies to all nested elements. If you need to indicate that a nested element
|
||||
should not drag, then use the attribute 'data-wails-no-drag' on that element.
|
||||
|
||||
The default vanilla template uses this, even though it is not frameless. The whole `body` element is tagged as draggable.
|
||||
The `<div id="input" data-wails-no-drag>` is tagged as being not draggable.
|
||||
|
||||
```html
|
||||
<html>
|
||||
<head>
|
||||
<link rel="stylesheet" href="/main.css" />
|
||||
</head>
|
||||
|
||||
<body data-wails-drag>
|
||||
<div id="logo"></div>
|
||||
<div id="input" data-wails-no-drag>
|
||||
<input id="name" type="text" />
|
||||
<button onclick="greet()">Greet</button>
|
||||
</div>
|
||||
<div id="result"></div>
|
||||
|
||||
<script src="/main.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
```
|
||||
|
||||
:::info Fullscreen
|
||||
If you allow your application to go fullscreen, this drag functionality will be disabled.
|
||||
:::
|
||||
@ -0,0 +1,77 @@
|
||||
|
||||
# Frontend
|
||||
|
||||
## Script Injection
|
||||
|
||||
When Wails serves your `index.html`, by default, it will inject 2 script entries into the `<body>` tag to load `/wails/bindings.js`
|
||||
and `/wails/runtime.js`. These files install the bindings and runtime respectively.
|
||||
|
||||
The code below shows where these are injected by default:
|
||||
|
||||
```html
|
||||
<html>
|
||||
<head>
|
||||
<title>injection example</title>
|
||||
<link rel="stylesheet" href="/main.css">
|
||||
<!-- <script src="/wails/ipc.js"></script> -->
|
||||
<!-- <script src="/wails/runtime.js"></script> -->
|
||||
</head>
|
||||
|
||||
<body data-wails-drag>
|
||||
<div class="logo"></div>
|
||||
<div class="result" id="result">Please enter your name below 👇</div>
|
||||
<div class="input-box" id="input" data-wails-no-drag>
|
||||
<input class="input" id="name" type="text" autocomplete="off">
|
||||
<button class="btn" onclick="greet()">Greet</button>
|
||||
</div>
|
||||
|
||||
<script src="/main.js"></script>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
```
|
||||
|
||||
### Overriding Default Script Injection
|
||||
|
||||
To provide more flexibility to developers, there is a meta tag that may be used to customise this behaviour:
|
||||
|
||||
```html
|
||||
<meta name="wails-options" content="[options]">
|
||||
```
|
||||
|
||||
The options are as follows:
|
||||
|
||||
| Value | Description |
|
||||
| -------------------- | ------------------------------------------------- |
|
||||
| noautoinjectruntime | Disable the autoinjection of `/wails/runtime.js` |
|
||||
| noautoinjectipc | Disable the autoinjection of `/wails/ipc.js` |
|
||||
| noautoinject | Disable all autoinjection of scripts |
|
||||
|
||||
Multiple options may be used provided they are comma seperated.
|
||||
|
||||
This code is perfectly valid and operates the same as the autoinjection version:
|
||||
|
||||
```html
|
||||
<html>
|
||||
|
||||
<head>
|
||||
<title>injection example</title>
|
||||
<meta name="wails-options" content="noautoinject">
|
||||
<link rel="stylesheet" href="/main.css">
|
||||
</head>
|
||||
|
||||
<body data-wails-drag>
|
||||
<div class="logo"></div>
|
||||
<div class="result" id="result">Please enter your name below 👇</div>
|
||||
<div class="input-box" id="input" data-wails-no-drag>
|
||||
<input class="input" id="name" type="text" autocomplete="off">
|
||||
<button class="btn" onclick="greet()">Greet</button>
|
||||
</div>
|
||||
|
||||
<script src="/wails/ipc.js"></script>
|
||||
<script src="/wails/runtime.js"></script>
|
||||
<script src="/main.js"></script>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
```
|
||||
115
website/versioned_docs/version-v2.0.0-beta.34/guides/ides.mdx
Normal file
115
website/versioned_docs/version-v2.0.0-beta.34/guides/ides.mdx
Normal file
@ -0,0 +1,115 @@
|
||||
|
||||
# IDEs
|
||||
|
||||
Wails aims to provide a great development experience. To that aim, we now support generating IDE specific configuration
|
||||
to provide smoother project setup.
|
||||
|
||||
Currently, we support [Visual Studio Code](https://code.visualstudio.com/) but aim to support other IDEs such as Goland.
|
||||
|
||||
## Visual Studio Code
|
||||
|
||||
<p className="text--center">
|
||||
<img src="/img/vscode.png" style={{"width": "75%"}}></img>
|
||||
</p>
|
||||
|
||||
When generating a project using the `-ide vscode` flags, IDE files will be created alongside the other project files.
|
||||
These files are placed into the `.vscode` directory and provide the correct configuration for debugging your application.
|
||||
|
||||
The 2 files generated are `tasks.json` and `launch.json`. Below are the files generated for the default vanilla project:
|
||||
|
||||
```json title="tasks.json"
|
||||
{
|
||||
"version": "2.0.0",
|
||||
"tasks": [
|
||||
{
|
||||
"label": "build",
|
||||
"type": "shell",
|
||||
"options": {
|
||||
"cwd": "${workspaceFolder}"
|
||||
},
|
||||
"command": "go",
|
||||
"args": ["build", "-tags", "dev", "-gcflags", "all=-N -l", "-o", "build/bin/myproject.exe"]
|
||||
},
|
||||
]
|
||||
}
|
||||
```
|
||||
|
||||
```json title="launch.json"
|
||||
{
|
||||
"version": "0.2.0",
|
||||
"configurations": [
|
||||
{
|
||||
"name": "Wails: Debug myproject",
|
||||
"type": "go",
|
||||
"request": "launch",
|
||||
"mode": "exec",
|
||||
"program": "${workspaceFolder}/build/bin/myproject.exe",
|
||||
"preLaunchTask": "build",
|
||||
"cwd": "${workspaceFolder}",
|
||||
"env": {}
|
||||
},
|
||||
]
|
||||
}
|
||||
```
|
||||
|
||||
### Configuring the install and build steps
|
||||
|
||||
The `tasks.json` file is simple for the default project as there is no `npm install` or `npm run build` step needed.
|
||||
For projects that have a frontend build step, such as the svelte template, we would need to edit `tasks.json` to
|
||||
add the install and build steps:
|
||||
|
||||
```json title="tasks.json"
|
||||
{
|
||||
"version": "2.0.0",
|
||||
"tasks": [
|
||||
{
|
||||
"label": "npm install",
|
||||
"type": "npm",
|
||||
"script": "install",
|
||||
"options": {
|
||||
"cwd": "${workspaceFolder}/frontend"
|
||||
},
|
||||
"presentation": {
|
||||
"clear": true,
|
||||
"panel": "shared",
|
||||
"showReuseMessage": false
|
||||
},
|
||||
"problemMatcher": []
|
||||
},
|
||||
{
|
||||
"label": "npm run build",
|
||||
"type": "npm",
|
||||
"script": "build",
|
||||
"options": {
|
||||
"cwd": "${workspaceFolder}/frontend"
|
||||
},
|
||||
"presentation": {
|
||||
"clear": true,
|
||||
"panel": "shared",
|
||||
"showReuseMessage": false
|
||||
},
|
||||
"problemMatcher": []
|
||||
},
|
||||
{
|
||||
"label": "build",
|
||||
"type": "shell",
|
||||
"options": {
|
||||
"cwd": "${workspaceFolder}"
|
||||
},
|
||||
"command": "go",
|
||||
"args": ["build", "-tags", "dev", "-gcflags", "all=-N -l", "-o", "build/bin/vscode.exe"],
|
||||
"dependsOn":[
|
||||
"npm install",
|
||||
"npm run build"
|
||||
]
|
||||
|
||||
},
|
||||
]
|
||||
}
|
||||
```
|
||||
|
||||
:::info Future Enhancement
|
||||
|
||||
In the future, we hope to generate a `tasks.json` that includes the install and build steps automatically.
|
||||
|
||||
:::
|
||||
@ -0,0 +1,99 @@
|
||||
|
||||
# Manual builds
|
||||
|
||||
The Wails CLI does a lot of heavy lifting for the project, but sometimes it's desirable to manually build your project.
|
||||
This document will discuss the different operations the CLI does and how this may be achieved in different ways.
|
||||
|
||||
## Build Process
|
||||
|
||||
When either `wails build` or `wails dev` are used, the Wails CLI performs a common build process:
|
||||
|
||||
- Install frontend dependencies
|
||||
- Build frontend project
|
||||
- Generate build assets
|
||||
- Compile application
|
||||
- [optional] Compress application
|
||||
|
||||
### Install frontend dependencies
|
||||
|
||||
#### CLI Steps
|
||||
|
||||
- If the `-s` flag is given, this step is skipped
|
||||
- Checks `wails.json` to see if there is an install command in the key `frontend:install`
|
||||
- If there isn't, it skips this step
|
||||
- If there is, it checks if `package.json` exists in the frontend directory. If it doesn't exist, it skips this step
|
||||
- An MD5 sum is generated from the `package.json` file contents
|
||||
- It checks for the existence of `package.json.md5` and if it exists, will compare the contents of it (an MD5 sum)
|
||||
with the one generated to see if the contents have changed. If they are the same, this step is skipped
|
||||
- If `package.json.md5` does not exist, it creates it using the generated MD5 sum
|
||||
- If a build is now required, or `node_modules` does not exist, or the `-f` flag is given, the install command is
|
||||
executed in the frontend directory
|
||||
|
||||
#### Manual Steps
|
||||
|
||||
This step could be done from the command line or a script with `npm install`.
|
||||
|
||||
### Build frontend project
|
||||
|
||||
#### Wails CLI
|
||||
|
||||
- If the `-s` flag is given, this step is skipped
|
||||
- Checks `wails.json` to see if there is a build command in the key `frontend:build`
|
||||
- If there isn't, it skips this step
|
||||
- If there is, it is executed in the frontend directory
|
||||
|
||||
#### Manual Steps
|
||||
|
||||
This step could be done from the command line or a script with `npm run build` or whatever the frontend build script is.
|
||||
|
||||
### Generate assets
|
||||
|
||||
#### Wails CLI
|
||||
|
||||
- If `-nopackage` flag is set, this stage is skipped
|
||||
- If the `build/appicon.png` file does not exist, a default one is created
|
||||
- For Windows, see [Bundling for Windows](#windows)
|
||||
- If `build/windows/icon.ico` does not exist, it will create it from the `build/appicon.png` image.
|
||||
|
||||
##### Windows
|
||||
|
||||
- If `build/windows/icon.ico` does not exist, it will create it from `build/appicon.png` using icon sizes of 256, 128, 64, 48, 32 and 16. This is done using [winicon](https://github.com/leaanthony/winicon).
|
||||
- If the `build/windows/<projectname>.manifest` file does not exist, it creates it from a default version.
|
||||
- Compiles the application as a production build (above)
|
||||
- Uses [winres](https://github.com/tc-hib/winres) to bundle the icon and manifest into a `.syso` file ready for linking.
|
||||
|
||||
#### Manual Steps
|
||||
|
||||
- Create `icon.ico` using the [winicon](https://github.com/leaanthony/winicon) CLI tool (or any other tool).
|
||||
- Create / Update a `.manifest` file for your application
|
||||
- Use the [winres CLI](https://github.com/tc-hib/go-winres) to generate a `.syso` file.
|
||||
|
||||
### Compile application
|
||||
|
||||
#### Wails CLI
|
||||
|
||||
- If the `-clean` flag is provided, the `build` directory is deleted and recreated
|
||||
- For `wails dev`, the following default Go flags are used: `-tags dev -gcflags "all=-N -l"`
|
||||
- For `wails build`, the following default Go flags are used: `-tags desktop,production -ldflags "-w -s"`
|
||||
- On Windows, `-ldflags "-w -h -H windowsgui"`
|
||||
- Additional tags passed to the CLI using `-tags` are added to the defaults
|
||||
- Additional ldflags passed to the CLI using `-ldflags` are added to the defaults
|
||||
- The `-o` flag is passed through
|
||||
- The Go compiler specified by `-compiler` will be used for compilation
|
||||
|
||||
#### Manual steps
|
||||
|
||||
- For dev build, the minimum command would be: `go build -tags dev -gcflags "all=-N -l"`
|
||||
- For production build, the minimum command would be: `go build -tags desktop,production -ldflags "-w -s -H windowsgui"`
|
||||
- Ensure that you compile in the same directory as the `.syso` file
|
||||
|
||||
### Compress application
|
||||
|
||||
#### Wails CLI
|
||||
|
||||
- If the `-upx` flag has been given, the `upx` program will be run to compress the application with the default settings
|
||||
- If `-upxflags` is also passed, these flags are used instead of the default ones
|
||||
|
||||
#### Manual steps
|
||||
|
||||
- Run `upx [flags]` manually to compress the application.
|
||||
@ -0,0 +1,206 @@
|
||||
|
||||
# Migrating from v1
|
||||
|
||||
## Overview
|
||||
|
||||
Wails v2 is a significant change from v1. This document aims to highlight the changes and the steps in migrating an existing project.
|
||||
|
||||
### Creating the Application
|
||||
|
||||
In v1, the main application is created using `wails.CreateApp`, bindings are added with `app.Bind`, then the
|
||||
application is run using `app.Run()`.
|
||||
|
||||
Example:
|
||||
|
||||
```go title="v1"
|
||||
app := wails.CreateApp(&wails.AppConfig{
|
||||
Title: "MyApp",
|
||||
Width: 1024,
|
||||
Height: 768,
|
||||
JS: js,
|
||||
CSS: css,
|
||||
Colour: "#131313",
|
||||
})
|
||||
app.Bind(basic)
|
||||
app.Run()
|
||||
```
|
||||
|
||||
In v2, there is just a single method, `wails.Run()`, that accepts [application options](/docs/reference/options#application-options).
|
||||
|
||||
```go title="v2"
|
||||
err := wails.Run(&options.App{
|
||||
Title: "MyApp",
|
||||
Width: 800,
|
||||
Height: 600,
|
||||
Assets: assets,
|
||||
Bind: []interface{}{
|
||||
basic,
|
||||
},
|
||||
})
|
||||
```
|
||||
|
||||
### Binding
|
||||
|
||||
In v1, it was possible to bind both arbitrary functions and structs. In v2, this has been simplified to only binding structs.
|
||||
The struct instances that were previously passed to the `Bind()` method in v1, are now specified in the `Bind` field of
|
||||
the [application options](/docs/reference/options#application-options):
|
||||
|
||||
```go title="v1"
|
||||
app := wails.CreateApp(/* options */)
|
||||
app.Bind(basic)
|
||||
```
|
||||
|
||||
```go title="v2"
|
||||
err := wails.Run(&options.App{
|
||||
/* other options */
|
||||
Bind: []interface{}{
|
||||
basic,
|
||||
},
|
||||
})
|
||||
```
|
||||
|
||||
In v1, bound methods were available to the frontend at `window.backend`. This has changed to `window.go`.``
|
||||
|
||||
### Application Lifecycle
|
||||
|
||||
In v1, there were 2 special methods in a bound struct: `WailsInit()` and `WailsShutdown()`. These have
|
||||
been replaced with 3 lifecycle hooks as part of the [application options](/docs/reference/options#application-options):
|
||||
|
||||
- [OnStartup](/docs/reference/options#onstartup)
|
||||
- [OnShutdown](/docs/reference/options#onshutdown)
|
||||
- [OnDomReady](/docs/reference/options#ondomready)
|
||||
|
||||
Note: [OnDomReady](/docs/reference/options#ondomready) replaces the `wails:ready` system event in v1.
|
||||
|
||||
These methods can be standard functions, but a common practice is to have them part of a struct:
|
||||
|
||||
```go title="v2"
|
||||
basic := NewBasicApp()
|
||||
err := wails.Run(&options.App{
|
||||
/* Other Options */
|
||||
OnStartup: basic.startup,
|
||||
OnShutdown: basic.shutdown,
|
||||
OnDomReady: basic.domready,
|
||||
})
|
||||
...
|
||||
type Basic struct {
|
||||
ctx context.Context
|
||||
}
|
||||
func (b *Basic) startup(ctx context.Context) {
|
||||
b.ctx = ctx
|
||||
}
|
||||
...
|
||||
```
|
||||
|
||||
### Runtime
|
||||
|
||||
The runtime in v2 is much richer than v1 with support for menus, window manipulation
|
||||
and better dialogs. The signature of the methods has changed slightly - please refer
|
||||
the the [Runtime Reference](/docs/reference/runtime/intro).
|
||||
|
||||
In v1, the [runtime](/docs/reference/runtime/intro) was available via a struct passed to `WailsInit()`.
|
||||
In v2, the runtime has been moved out to its own package. Each method in the runtime takes the
|
||||
`context.Context` that is passed to the [OnStartup](/docs/reference/options#onstartup) method.
|
||||
|
||||
```go title="Runtime Example"
|
||||
package main
|
||||
|
||||
import "github.com/wailsapp/wails/v2/pkg/runtime"
|
||||
|
||||
type Basic struct {
|
||||
ctx context.Context
|
||||
}
|
||||
|
||||
// startup is called at application startup
|
||||
func (a *App) startup(ctx context.Context) {
|
||||
a.ctx = ctx
|
||||
runtime.LogInfo(ctx, "Application Startup called!")
|
||||
}
|
||||
|
||||
```
|
||||
|
||||
### Assets
|
||||
|
||||
The _biggest_ change in v2 is how assets are handled.
|
||||
|
||||
In v1, assets were passed via 2 application options:
|
||||
|
||||
- `JS` - The application's Javascript
|
||||
- `CSS` - The application's CSS
|
||||
|
||||
This meant that the responsibility of generating a single JS and CSS file was on the
|
||||
developer. This essentially required the use of complicated packers such as webpack.
|
||||
|
||||
In v2, Wails makes no assumptions about your frontend assets, just like a webserver.
|
||||
All of your application assets are passed to the application options as an `embed.FS`.
|
||||
|
||||
**This means there is no requirement to bundle your assets, encode images as Base64 or
|
||||
attempt the dark art of bundler configuration to use custom fonts**.
|
||||
|
||||
At startup, Wails
|
||||
will scan the given `embed.FS` for `index.html` and use its location as the root path
|
||||
for all the other application assets - just like a webserver would.
|
||||
|
||||
Example: An application has the following project layout. All final assets are placed in the
|
||||
`frontend/dist` directory:
|
||||
|
||||
```shell
|
||||
.
|
||||
├── build/
|
||||
├── frontend/
|
||||
│ └── dist/
|
||||
│ ├── index.html
|
||||
│ ├── main.js
|
||||
│ ├── main.css
|
||||
│ └── logo.svg
|
||||
├── main.go
|
||||
└── wails.json
|
||||
```
|
||||
|
||||
Those assets may be used by the application by simply creating an `embed.FS`:
|
||||
|
||||
```go title="Assets Example"
|
||||
//go:embed frontend/dist
|
||||
var assets embed.FS
|
||||
|
||||
func main() {
|
||||
err := wails.Run(&options.App{
|
||||
/* Other Options */
|
||||
Assets: assets,
|
||||
})
|
||||
}
|
||||
```
|
||||
|
||||
Of course, bundlers can be used if you wish to. The only requirement is to pass
|
||||
the final application assets directory to Wails using an `embed.FS` in the `Assets`
|
||||
key of the [application options](/docs/reference/options#application-options).
|
||||
|
||||
### Project Configuration
|
||||
|
||||
In v1, the project configuration was stored in the `project.json` file in the project root.
|
||||
In v2, the project configuration is stored in the `wails.json` file in the project root.
|
||||
|
||||
The format of the file is slightly different. Here is a comparison:
|
||||
|
||||
<p align="center">
|
||||
|
||||
| v1 | v2 | Notes |
|
||||
| ------------------ | ---------------- | --------------------------------------------------- |
|
||||
| name | name | |
|
||||
| description | | Removed |
|
||||
| author / name | author / name | |
|
||||
| author / email | author / email | |
|
||||
| version | version | |
|
||||
| binaryname | outputfilename | Changed |
|
||||
| frontend / dir | | Removed |
|
||||
| frontend / install | frontend:install | Changed |
|
||||
| frontend / build | frontend:build | Changed |
|
||||
| frontend / bridge | | Removed |
|
||||
| frontend / serve | | Removed |
|
||||
| tags | | Removed |
|
||||
| | wailsjsdir | The directory to generate wailsjs modules |
|
||||
| | assetdir | The directory of the compiled frontend assets for `dev` mode. This is normally inferred and could be left empty. |
|
||||
| | reloaddirs | Comma separated list of additional directories to watch for changes and to trigger reloads in `dev` mode. This is only needed for some more advanced asset configurations. |
|
||||
|
||||
</p>
|
||||
|
||||
@ -0,0 +1,11 @@
|
||||
|
||||
# Overscroll
|
||||
|
||||
[Overscroll](https://developer.mozilla.org/en-US/docs/Web/CSS/overscroll-behavior) is the "bounce effect" you sometimes
|
||||
get when you scroll beyond a page's content boundaries. This is common in mobile apps. This can be disabled using CSS:
|
||||
|
||||
```css
|
||||
body {
|
||||
overscroll-behavior: none;
|
||||
}
|
||||
```
|
||||
@ -0,0 +1,27 @@
|
||||
|
||||
# Routing
|
||||
|
||||
Routing is a popular way to switch views in an application. This page offers some guidance around how to do that.
|
||||
|
||||
## Vue
|
||||
|
||||
The recommended approach for routing in Vue is [Hash Mode](https://next.router.vuejs.org/guide/essentials/history-mode.html#hash-mode):
|
||||
|
||||
```js
|
||||
import { createRouter, createWebHashHistory } from 'vue-router'
|
||||
|
||||
const router = createRouter({
|
||||
history: createWebHashHistory(),
|
||||
routes: [
|
||||
//...
|
||||
],
|
||||
})
|
||||
```
|
||||
|
||||
## Angular
|
||||
|
||||
The recommended approach for routing in Angular is [HashLocationStrategy](https://codecraft.tv/courses/angular/routing/routing-strategies/#_hashlocationstrategy):
|
||||
|
||||
```ts
|
||||
RouterModule.forRoot(routes, {useHash: true})
|
||||
```
|
||||
@ -0,0 +1,95 @@
|
||||
|
||||
# Templates
|
||||
|
||||
Wails generates projects from pre-created templates. In v1, this was a difficult to maintain set of projects that were
|
||||
subject to going out of date. In v2, to empower the community, a couple of new features have been added for templates:
|
||||
|
||||
- Ability to generate projects from [Remote Templates](/docs/reference/cli#remote-templates)
|
||||
- Tooling to help create your own templates
|
||||
|
||||
## Creating Templates
|
||||
|
||||
To create a template, you can use the `wails generate template` command. To generate a default template, run:
|
||||
|
||||
`wails generate template -name mytemplate `
|
||||
|
||||
This creates the directory "mytemplate" with default files:
|
||||
|
||||
```shell title=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
|
||||
```
|
||||
|
||||
### Template Overview
|
||||
|
||||
The default template consists of the following files and directories:
|
||||
|
||||
| Filename / Dir | Description |
|
||||
| --------------- | -------------------------------------------- |
|
||||
| NEXTSTEPS.md | Instructions on how to complete the template |
|
||||
| README.md | The README published with the template |
|
||||
| app.tmpl.go | `app.go` template file |
|
||||
| frontend/ | The directory containing frontend assets |
|
||||
| go.mod.tmpl | `go.mod` template file |
|
||||
| main.tmpl.go | `main.go` template file |
|
||||
| template.json | The template metadata |
|
||||
| wails.tmpl.json | `wails.json` template file |
|
||||
|
||||
At this point it is advisable to follow the steps in `NEXTSTEPS.md`.
|
||||
|
||||
## Creating a Template from an Existing Project
|
||||
|
||||
It's possible to create a template from an existing frontend project by passing the path to the project when generating
|
||||
the template. We will now walk through how to create a Vue 3 template:
|
||||
|
||||
- Install the vue cli: `npm install -g @vue/cli`
|
||||
- Create the default project: `vue create vue3-base`
|
||||
- Select `Default (Vue 3) ([Vue 3] babel, eslint)`
|
||||
- After the project has been generated, run:
|
||||
|
||||
```shell
|
||||
> 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...
|
||||
```
|
||||
|
||||
- The template may now be customised as specified in the `NEXTSTEPS.md` file
|
||||
- Once the files are ready, it can be tested by running: `wails init -n my-vue3-project -t .\wails-vue3-template\`
|
||||
- To test the new project, run: `cd my-vue3-project` then `wails build`
|
||||
- Once the project has compiled, run it: `.\build\bin\my-vue3-project.exe`
|
||||
- You should have a fully functioning Vue3 application:
|
||||
|
||||
<div className="text--center">
|
||||
<img src="/img/vue3-template.png" width="50%" />
|
||||
</div>
|
||||
|
||||
## Publishing Templates
|
||||
|
||||
Publishing a template is simply pushing the files to GitHub. The following best practice is encouraged:
|
||||
|
||||
- Remove any unwanted files and directories (such as `.git`) from your frontend directory
|
||||
- Ensure that `template.json` is complete, especially `helpurl`
|
||||
- Push the files to GitHub
|
||||
- Create a PR on the [Community Templates](/docs/community/templates) page
|
||||
- Announce the template on the [Template Announcement](https://github.com/wailsapp/wails/discussions/825) discussion board
|
||||
@ -0,0 +1,71 @@
|
||||
|
||||
# Troubleshooting
|
||||
|
||||
An assortment of troubleshooting tips.
|
||||
|
||||
## My application is displaying a white/blank screen
|
||||
|
||||
Check that your application includes the assets from the correct directory. In your `main.go` file, you will have
|
||||
something similar to the following code:
|
||||
|
||||
```go
|
||||
//go:embed frontend/dist
|
||||
var assets embed.FS
|
||||
```
|
||||
Check that `frontend/dist` contains your application assets.
|
||||
|
||||
## Mac application not valid
|
||||
|
||||
If your built application looks like this in finder:
|
||||
|
||||
<p className="text--center">
|
||||
<img src="/img/troubleshooting/invalid_mac_app.png"></img>
|
||||
</p>
|
||||
|
||||
it's likely that your application's `info.plist` is invalid. Update the file in `build/<yourapp>.app/Contents/info.plist`
|
||||
and check if the data is valid, EG check the binary name is correct. To persist the changes, copy the file back to
|
||||
the `build/darwin` directory.
|
||||
|
||||
## Cannot call backend method from frontend with variadic arguments
|
||||
|
||||
If you have a backend method defined with variadic parameters, eg:
|
||||
```go
|
||||
func (a *App) TestFunc(msg string, args ...interface{}) error {
|
||||
// Code
|
||||
}
|
||||
```
|
||||
calling this method from the frontend like this will fail:
|
||||
```js
|
||||
var msg = "Hello: "
|
||||
var args = ["Go", "JS"]
|
||||
window.go.main.App.TestFunc(msg, ...args).then((result) => {
|
||||
//do things here
|
||||
}).catch((error) => {
|
||||
//handle error
|
||||
});
|
||||
```
|
||||
Workaround:
|
||||
```js
|
||||
var msg = "Hello "
|
||||
var args = ["Go", "JS"]
|
||||
window.go.main.App.TestFunc(msg, args).then((result) => { //without the 3 dots
|
||||
//do things here
|
||||
}).catch((error) => {
|
||||
//handle error
|
||||
});
|
||||
```
|
||||
Credit: https://github.com/wailsapp/wails/issues/1186
|
||||
|
||||
## I'm having getting proxy errors when trying to install Wails
|
||||
|
||||
If you are getting errors like this:
|
||||
```
|
||||
"https://proxy.golang.org/github.com/wailsapp/wails/cmd/wails/@v/list": dial tcp 172.217.163.49:443: connectex: A connection attempt failed because the connected party did not properly respond after a period of time, or established connection failed because connected host has failed to respond.
|
||||
```
|
||||
it's probably because the official Go Proxy is being blocked (Users in China have reported this).
|
||||
The solution is to set up the proxy manually, eg:
|
||||
```
|
||||
go env -w GO111MODULE=on
|
||||
go env -w GOPROXY=https://goproxy.cn,direct
|
||||
```
|
||||
Source: https://github.com/wailsapp/wails/issues/1233
|
||||
@ -0,0 +1,37 @@
|
||||
|
||||
# Windows
|
||||
|
||||
This page has miscellaneous guides related to developing Wails applications for Windows.
|
||||
|
||||
## Handling the WebView2 Runtime Dependency
|
||||
|
||||
Wails applications built for Windows have a runtime requirement on the Microsoft [WebView2 Runtime](https://developer.microsoft.com/en-us/microsoft-edge/webview2/).
|
||||
Windows 11 will have this installed by default, but some machines won't. Wails offers an easy approach to dealing with this dependency.
|
||||
|
||||
By using the `-webview2` flag when building, you can decide what your application will do when a suitable runtime is not detected (including if the installed runtime is too old).
|
||||
The four options are:
|
||||
|
||||
1. Download
|
||||
2. Embed
|
||||
3. Browser
|
||||
4. Error
|
||||
|
||||
### Download
|
||||
|
||||
This option will prompt the user that no suitable runtime has been found and then offer to download and run the official
|
||||
bootstrapper from Microsoft's WebView2 site. If the user proceeds, the official bootstrapper will be downloaded and run.
|
||||
|
||||
### Embed
|
||||
|
||||
This option embeds the official bootstrapper within the application. If no suitable runtime has been found, the
|
||||
application will offer to run the bootstrapper. This adds ~150k to the binary size.
|
||||
|
||||
### Browser
|
||||
|
||||
This option will prompt the user that no suitable runtime has been found and then offer to open a browser to the official
|
||||
WebView2 page where the bootstrapper can be downloaded and installed. The application will then exit, leaving the installation
|
||||
up to the user.
|
||||
|
||||
### Error
|
||||
|
||||
If no suitable runtime is found, an error is given to the user and no further action taken.
|
||||
415
website/versioned_docs/version-v2.0.0-beta.34/howdoesitwork.mdx
Normal file
415
website/versioned_docs/version-v2.0.0-beta.34/howdoesitwork.mdx
Normal file
@ -0,0 +1,415 @@
|
||||
---
|
||||
sidebar_position: 20
|
||||
---
|
||||
|
||||
# How does it work?
|
||||
|
||||
A Wails application is a standard Go application, with a webkit frontend. The Go part of the application consists of the
|
||||
application code and a runtime library that provides a number of useful operations, like controlling the application
|
||||
window. The frontend is a webkit window that will display the frontend assets. Also available to the frontend is a Javascript
|
||||
version of the runtime library. Finally, it is possible to bind Go methods to the frontend, and these will appear as
|
||||
Javascript methods that can be called, just as if they were local Javascript methods.
|
||||
|
||||
<div className="text--center">
|
||||
<img src="/img/architecture.svg" width="75%" />
|
||||
</div>
|
||||
|
||||
## The Main Application
|
||||
|
||||
### Overview
|
||||
|
||||
The main application consists of a single call to `wails.Run()`. It accepts the
|
||||
application configuration which describes the size of the application window, the window title,
|
||||
what assets to use, etc. A basic application might look like this:
|
||||
|
||||
```go title="main.go"
|
||||
package main
|
||||
|
||||
import (
|
||||
"embed"
|
||||
"log"
|
||||
|
||||
"github.com/wailsapp/wails/v2"
|
||||
"github.com/wailsapp/wails/v2/pkg/options"
|
||||
)
|
||||
|
||||
//go:embed frontend/dist
|
||||
var assets embed.FS
|
||||
|
||||
func main() {
|
||||
|
||||
app := &App{}
|
||||
|
||||
err := wails.Run(&options.App{
|
||||
Title: "Basic Demo",
|
||||
Width: 1024,
|
||||
Height: 768,
|
||||
Assets: &assets,
|
||||
OnStartup: app.startup,
|
||||
OnShutdown: app.shutdown,
|
||||
Bind: []interface{}{
|
||||
app,
|
||||
},
|
||||
})
|
||||
if err != nil {
|
||||
log.Fatal(err)
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
type App struct {
|
||||
ctx context.Context
|
||||
}
|
||||
|
||||
func (b *App) startup(ctx context.Context) {
|
||||
b.ctx = ctx
|
||||
}
|
||||
|
||||
func (b *App) shutdown(ctx context.Context) {}
|
||||
|
||||
func (b *App) Greet(name string) string {
|
||||
return fmt.Sprintf("Hello %s!", name)
|
||||
}
|
||||
```
|
||||
|
||||
### Options rundown
|
||||
|
||||
This example has the following options set:
|
||||
|
||||
- `Title` - The text that should appear in the window's title bar
|
||||
- `Width` & `Height` - The dimensions of the window
|
||||
- `Assets` - The application's frontend assets
|
||||
- `OnStartup` - A callback for when the window is created and is about to start loading the frontend assets
|
||||
- `OnShutdown` - A callback for when the application is about to quit
|
||||
- `Bind` - A slice of struct instances that we wish to expose to the frontend
|
||||
|
||||
A full list of application options can be found in the [Options Reference](/docs/reference/options).
|
||||
|
||||
#### Assets
|
||||
|
||||
The `Assets` option is mandatory as you can't have a Wails application without frontend assets. Those assets can be
|
||||
any files you would expect to find in a web application - html, js, css, svg, png, etc. **There is no requirement to
|
||||
generate asset bundles** - plain files will do. When the application starts, it will attempt to load `index.html`
|
||||
from your assets and the frontend will essentially work as a browser from that point on. It is worth noting that
|
||||
there is no requirement on where in the `embed.FS` the files live. It is likely that the embed path uses a nested
|
||||
directory relative to your main application code, such as `frontend/dist`:
|
||||
|
||||
```go title="main.go"
|
||||
//go:embed frontend/dist
|
||||
var assets embed.FS
|
||||
```
|
||||
|
||||
At startup, Wails will iterate the embedded files looking for the directory containing `index.html`. All other assets will be loaded relative
|
||||
to this directory.
|
||||
|
||||
As production binaries use the files contained in `embed.FS`, there are no external files required to be shipped with
|
||||
the application.
|
||||
|
||||
When running in development mode using the `wails dev` command, the assets are loaded off disk, and any changes result
|
||||
in a "live reload". The location of the assets will be inferred from the `embed.FS`.
|
||||
|
||||
More details can be found in the [Application Development Guide](/docs/guides/application-development).
|
||||
|
||||
#### Application Lifecycle Callbacks
|
||||
|
||||
Just before the frontend is about to load `index.html`, a callback is made to the function provided in [OnStartup](/docs/reference/options#OnStartup).
|
||||
A standard Go context is passed to this method. This context is required when calling the runtime so a standard pattern is to save
|
||||
a reference to in this method. Just before the application shuts down, the [OnShutdown](/docs/reference/options#OnShutdown) callback is called in the same way,
|
||||
again with the context. There is also an [OnDomReady](/docs/reference/options#OnDomReady) callback for when the frontend
|
||||
has completed loading all assets in `index.html` and is equivalent of the [`body onload`](https://www.w3schools.com/jsref/event_onload.asp) event in Javascript.
|
||||
It is also possible to hook into the window close (or application quit) event by setting the
|
||||
option [OnBeforeClose](/docs/reference/options#OnBeforeClose).
|
||||
|
||||
#### Method Binding
|
||||
|
||||
The `Bind` option is one of the most important options in a Wails application. It specifies which struct methods
|
||||
to expose to the frontend. When the application starts, it examines the struct instances listed in the `Bind` field in
|
||||
the options, determines which methods are public (starts with an uppercase letter) and will generate Javascript versions
|
||||
of those methods that can be called by the frontend code.
|
||||
|
||||
:::info Note
|
||||
|
||||
Wails requires that you pass in an *instance* of the struct for it to bind it correctly
|
||||
|
||||
:::
|
||||
|
||||
In this example, we create a new `App` instance and then add this instance to the `Bind` option in `wails.Run`:
|
||||
|
||||
```go {16,26} title="main.go"
|
||||
package main
|
||||
|
||||
import (
|
||||
"embed"
|
||||
"log"
|
||||
|
||||
"github.com/wailsapp/wails/v2"
|
||||
"github.com/wailsapp/wails/v2/pkg/options"
|
||||
)
|
||||
|
||||
//go:embed frontend/dist
|
||||
var assets embed.FS
|
||||
|
||||
func main() {
|
||||
|
||||
app := &App{}
|
||||
|
||||
err := wails.Run(&options.App{
|
||||
Title: "Basic Demo",
|
||||
Width: 1024,
|
||||
Height: 768,
|
||||
Assets: &assets,
|
||||
OnStartup: app.startup,
|
||||
OnShutdown: app.shutdown,
|
||||
Bind: []interface{}{
|
||||
app,
|
||||
},
|
||||
})
|
||||
if err != nil {
|
||||
log.Fatal(err)
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
type App struct {
|
||||
ctx context.Context
|
||||
}
|
||||
|
||||
func (b *App) startup(ctx context.Context) {
|
||||
b.ctx = ctx
|
||||
}
|
||||
|
||||
func (b *App) shutdown(ctx context.Context) {}
|
||||
|
||||
func (b *App) Greet(name string) string {
|
||||
return fmt.Sprintf("Hello %s!", name)
|
||||
}
|
||||
```
|
||||
|
||||
You may bind as many structs as you like. Just make sure you create an instance of it and pass it in `Bind`:
|
||||
|
||||
```go {10-12}
|
||||
...
|
||||
err := wails.Run(&options.App{
|
||||
Title: "Basic Demo",
|
||||
Width: 1024,
|
||||
Height: 768,
|
||||
Assets: &assets,
|
||||
OnStartup: app.startup,
|
||||
OnShutdown: app.shutdown,
|
||||
Bind: []interface{}{
|
||||
app,
|
||||
&mystruct1{},
|
||||
&mystruct2{},
|
||||
},
|
||||
})
|
||||
...
|
||||
```
|
||||
|
||||
The bound methods are located in the frontend at `window.go.<packagename>.<struct>.<method>`.
|
||||
In the example above, we bind `app`, which has one public method `Greet`.
|
||||
This can be called in Javascript by calling `window.go.main.App.Greet`.
|
||||
These methods return a Promise. A successful call will result in the first return value from the Go call to be passed
|
||||
to the `resolve` handler. An unsuccessful call is when a Go method that has an error type as it's second return value,
|
||||
passes an error instance back to the caller. This is passed back via the `reject` handler.
|
||||
In the example above, `Greet` only returns a `string` so the Javascript call will never reject - unless invalid data
|
||||
is passed to it.
|
||||
|
||||
All data types are correctly translated between Go and Javascript. Even structs. If you return a struct from a Go call,
|
||||
it will be returned to your frontend as a Javascript map. Note: If you wish to use structs, you **must** define `json` struct
|
||||
tags for your fields!
|
||||
|
||||
:::info Note
|
||||
Anonymous nested structs are not supported at this time.
|
||||
:::
|
||||
|
||||
It is also possible to send structs back to Go. Any Javascript map passed as an argument that
|
||||
is expecting a struct, will be converted to that struct type. To make this process a lot easier, in `dev` mode,
|
||||
a TypeScript module is generated, defining all the struct types used in bound methods. Using this module, it's possible
|
||||
to construct and send native Javascript objects to the Go code.
|
||||
|
||||
More information on Binding can be found in the [Binding Methods](/docs/guides/application-development#binding-methods)
|
||||
section of the [Application Development Guide](/docs/guides/application-development).
|
||||
|
||||
## The Frontend
|
||||
|
||||
### Overview
|
||||
|
||||
The frontend is a collection of files rendered by webkit. It's like a browser and webserver in one.
|
||||
There is virtually[^1] no limit to which frameworks or libraries you can use. The main points of interaction between
|
||||
the frontend and your Go code are:
|
||||
|
||||
- Calling bound Go methods
|
||||
- Calling runtime methods
|
||||
|
||||
[^1]:
|
||||
There is a very small subset of libraries that use features unsupported in WebViews. There are often alternatives and
|
||||
workarounds for such cases.
|
||||
|
||||
### Calling bound Go methods
|
||||
|
||||
All bound Go methods are available at `window.go.<package>.<struct>.<method>`. As stated in
|
||||
the previous section, these return a Promise where a successful call returns a value to the
|
||||
resolve handler and an error returns a value to the reject handler.
|
||||
|
||||
```go title="mycode.js"
|
||||
window.go.main.App.Greet("Bill").then((result) => {
|
||||
console.log("The greeting is: " + result);
|
||||
})
|
||||
```
|
||||
|
||||
When running the application in `dev` mode, a javascript module is generated that wraps these
|
||||
methods with JSDoc annotations. This really help with development, especially as most
|
||||
IDEs will process JSDoc to provide code completion and type hinting. This module is called `go`
|
||||
and is generated in the directory specified by the `wailsjsdir` flag. In this module is a file
|
||||
called `bindings.js` containing these wrappers. For the above example, the file contains the
|
||||
following code:
|
||||
|
||||
```js title="bindings.js"
|
||||
const go = {
|
||||
main: {
|
||||
App: {
|
||||
/**
|
||||
* Greet
|
||||
* @param {Person} arg1 - Go Type: string
|
||||
* @returns {Promise<string>} - Go Type: string
|
||||
*/
|
||||
Greet: (arg1) => {
|
||||
return window.go.main.App.Greet(arg1);
|
||||
},
|
||||
},
|
||||
},
|
||||
};
|
||||
export default go;
|
||||
```
|
||||
|
||||
#### Support for structs
|
||||
|
||||
There is also additional support for Go methods that use structs in their signature. All Go structs
|
||||
specified by bound method (either as parameters or return types) will have Typescript versions auto
|
||||
generated as part of the Go code wrapper module. Using these, it's possible to share the same data
|
||||
model between Go and Javascript. These models align with the JSDoc annotations, empowering IDE code
|
||||
completion.
|
||||
|
||||
Example: We update our `Greet` method to accept a `Person` instead of a string:
|
||||
|
||||
```go title="main.go"
|
||||
type Person struct {
|
||||
Name string `json:"name"`
|
||||
Age uint8 `json:"age"`
|
||||
Address *Address `json:"address"`
|
||||
}
|
||||
|
||||
type Address struct {
|
||||
Street string `json:"street"`
|
||||
Postcode string `json:"postcode"`
|
||||
}
|
||||
|
||||
func (a *App) Greet(p Person) string {
|
||||
return fmt.Sprintf("Hello %s (Age: %d)!", p.Name, p.Age)
|
||||
}
|
||||
```
|
||||
|
||||
Our `bindings.js` file has now been updated to reflect the change:
|
||||
|
||||
```js title="bindings.js"
|
||||
const go = {
|
||||
main: {
|
||||
App: {
|
||||
/**
|
||||
* Greet
|
||||
* @param {Person} arg1 - Go Type: main.Person
|
||||
* @returns {Promise<string>} - Go Type: string
|
||||
*/
|
||||
Greet: (arg1) => {
|
||||
return window.go.main.App.Greet(arg1);
|
||||
},
|
||||
},
|
||||
},
|
||||
};
|
||||
export default go;
|
||||
```
|
||||
|
||||
Alongside `bindings.js`, there is a file called `models.ts`. This contains our Go structs in TypeScript form:
|
||||
|
||||
```ts title="models.ts"
|
||||
export class Address {
|
||||
street: string;
|
||||
postcode: string;
|
||||
|
||||
static createFrom(source: any = {}) {
|
||||
return new Address(source);
|
||||
}
|
||||
|
||||
constructor(source: any = {}) {
|
||||
if ("string" === typeof source) source = JSON.parse(source);
|
||||
this.street = source["street"];
|
||||
this.postcode = source["postcode"];
|
||||
}
|
||||
}
|
||||
export class Person {
|
||||
name: string;
|
||||
age: number;
|
||||
address?: Address;
|
||||
|
||||
static createFrom(source: any = {}) {
|
||||
return new Person(source);
|
||||
}
|
||||
|
||||
constructor(source: any = {}) {
|
||||
if ("string" === typeof source) source = JSON.parse(source);
|
||||
this.name = source["name"];
|
||||
this.age = source["age"];
|
||||
this.address = this.convertValues(source["address"], Address);
|
||||
}
|
||||
|
||||
convertValues(a: any, classs: any, asMap: boolean = false): any {
|
||||
if (!a) {
|
||||
return a;
|
||||
}
|
||||
if (a.slice) {
|
||||
return (a as any[]).map((elem) => this.convertValues(elem, classs));
|
||||
} else if ("object" === typeof a) {
|
||||
if (asMap) {
|
||||
for (const key of Object.keys(a)) {
|
||||
a[key] = new classs(a[key]);
|
||||
}
|
||||
return a;
|
||||
}
|
||||
return new classs(a);
|
||||
}
|
||||
return a;
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
So long as you have TypeScript as part of your frontend build configuration, you can use these models in
|
||||
the following way:
|
||||
|
||||
```js title="mycode.js"
|
||||
import go from "./wailsjs/go/bindings";
|
||||
import { Person } from "./wailsjs/go/models";
|
||||
|
||||
let name = "";
|
||||
|
||||
function greet(name) {
|
||||
let p = new Person();
|
||||
p.name = name;
|
||||
p.age = 42;
|
||||
go.main.App.Greet(p).then((result) => {
|
||||
console.log(result);
|
||||
});
|
||||
}
|
||||
```
|
||||
|
||||
The combination of JSDoc and TypeScript generated models makes for a powerful development environment.
|
||||
|
||||
### Calling runtime methods
|
||||
|
||||
The Javascript runtime is located at `window.runtime` and contains many methods to do various
|
||||
tasks such as emit an event or perform logging operations:
|
||||
|
||||
```js title="mycode.js"
|
||||
window.runtime.EventsEmit("my-event", 1);
|
||||
```
|
||||
|
||||
More details about the JS runtime can be found in the [Runtime Reference](/docs/reference/runtime/intro).
|
||||
@ -0,0 +1,72 @@
|
||||
---
|
||||
sidebar_position: 1
|
||||
---
|
||||
|
||||
# Introduction
|
||||
|
||||
## Overview
|
||||
|
||||
Wails is a project that enables you to write desktop apps using Go and web technologies.
|
||||
|
||||
Consider it a lightweight and fast Electron alternative for Go. You can easily build applications with the flexibility
|
||||
and power of Go, combined with a rich, modern frontend.
|
||||
|
||||
Wails doesn't hold back with the eye candy either! This is [xbar](https://xbarapp.com) - a desktop application for MacOS
|
||||
written using Wails. It has menus, supports light and dark desktop themes, and the main window uses translucency that
|
||||
gives it that 'frosty' effect of a native app.
|
||||
|
||||
<p class="text--center">
|
||||
<a href="https://xbarapp.com">
|
||||
<img src="/img/xbar-app-preview-2.png" width="75%" />
|
||||
</a>
|
||||
</p>
|
||||
|
||||
## Native Elements
|
||||
|
||||
Wails uses a purpose built library for handling native elements such as Window, Menus, Dialogs, etc, so you can build
|
||||
good-looking, feature rich desktop applications.
|
||||
|
||||
**It does not embed a browser**, so it is resource efficient. Instead, it uses the native rendering engine for the
|
||||
platform. On Windows, this is the new Microsoft Webview2 library, built on Chromium.
|
||||
|
||||
## Go & Javascript Interoperability
|
||||
|
||||
Wails automatically makes your Go methods available to Javascript, so you can call them by name from your frontend!
|
||||
It even generates Typescript versions of the structs used by your Go methods, so you can pass the same data structures
|
||||
between Go and Javascript.
|
||||
|
||||
## Runtime Library
|
||||
|
||||
Wails provides a runtime library, for both Go and Javascript, that handles a lot of the things modern applications need,
|
||||
like Eventing, Logging, Dialogs, etc.
|
||||
|
||||
## Live Development Experience
|
||||
|
||||
### Automatic Rebuilds
|
||||
|
||||
When you run your application in "dev" mode, Wails will build your application as a native desktop application, but will
|
||||
read your assets from disk. It will detect any changes to your Go code and automatically rebuild and relaunch your
|
||||
application.
|
||||
|
||||
### Automatic Reloads
|
||||
|
||||
When changes to your application assets are detected, your running application will "reload", reflecting your changes
|
||||
almost immediately.
|
||||
|
||||
### Develop your application in a Browser
|
||||
|
||||
If you prefer to debug and develop in a browser then Wails has you covered. The running application also has a webserver
|
||||
that will run your application in any browser that connects to it. It will even refresh when your assets change on disk.
|
||||
|
||||
## Production-ready Native Binaries
|
||||
|
||||
When you're ready to do the final build of your application, the CLI will compile it down to a single executable, with
|
||||
all the assets bundled into it. On Windows and MacOS, it is possible to create a native package for distribution. The
|
||||
assets used in packaging (icon, info.plist, manifest file, etc) are part of your project and may be customised, giving
|
||||
you total control over how your applications are built.
|
||||
|
||||
## Tooling
|
||||
|
||||
The Wails CLI provides a hassle-free way to generate, build and bundle your applications. It will do the heavy lifting
|
||||
of creating icons, compiling your application with optimal settings and delivering a distributable, production ready
|
||||
binary. Choose from a number of starter templates to get up and running quickly!
|
||||
@ -0,0 +1,4 @@
|
||||
{
|
||||
"label": "Reference",
|
||||
"position": 40
|
||||
}
|
||||
218
website/versioned_docs/version-v2.0.0-beta.34/reference/cli.mdx
Normal file
218
website/versioned_docs/version-v2.0.0-beta.34/reference/cli.mdx
Normal file
@ -0,0 +1,218 @@
|
||||
---
|
||||
sidebar_position: 2
|
||||
---
|
||||
|
||||
# CLI
|
||||
|
||||
The Wails CLI has a number of commands that are used for managing your projects. All commands are run in the following way:
|
||||
|
||||
`wails <command> <flags>`
|
||||
|
||||
## init
|
||||
|
||||
`wails init` is used for generating projects.
|
||||
|
||||
| Flag | Description | Default |
|
||||
| :------------------- | :------------------------------------- | :-------------------------: |
|
||||
| -n "project name" | Name of the project. **Mandatory**. | |
|
||||
| -d "project dir" | Project directory to create | Name of the project |
|
||||
| -g | Initialise git repository | |
|
||||
| -l | List available project templates | |
|
||||
| -q | Suppress output to console | |
|
||||
| -t "template name" | The project template to use. This can be the name of a default template or a URL to a remote template hosted on github. | vanilla |
|
||||
| -ide | Generate IDE project files | |
|
||||
| -f | Force build application | false |
|
||||
|
||||
Example:
|
||||
`wails init -n test -d mytestproject -g -ide vscode -q`
|
||||
|
||||
This will generate a a project called "test" in the "mytestproject" directory, initialise git,
|
||||
generate vscode project files and do so silently.
|
||||
|
||||
More information on using IDEs with Wails can be found [here](/docs/guides/ides).
|
||||
|
||||
### Remote Templates
|
||||
|
||||
Remote templates (hosted on GitHub) are supported and can be installed by using the template's project URL.
|
||||
|
||||
Example:
|
||||
`wails init -n test -t https://github.com/leaanthony/testtemplate[@v1.0.0]`
|
||||
|
||||
A list of community maintained templates can be found [here](/docs/community/templates)
|
||||
|
||||
:::warning Attention
|
||||
|
||||
**The Wails project does not maintain, is not responsible nor liable for 3rd party templates!**
|
||||
|
||||
If you are unsure about a template, inspect `package.json` and `wails.json` for what scripts are run and what packages are installed.
|
||||
|
||||
:::
|
||||
|
||||
## build
|
||||
|
||||
`wails build` is used for compiling your project to a production-ready binary.
|
||||
|
||||
| Flag | Description | Default |
|
||||
| :------------------- | :-------------------------------------- | :------------------------- |
|
||||
| -platform | Build for the given (comma delimited) [platforms](/docs/reference/cli#platforms) eg. `windows/arm64`. Note, if you do not give the architecture, `runtime.GOARCH` is used. | runtime.GOOS/runtime.GOARCH |
|
||||
| -clean | Cleans the `build/bin` directory | |
|
||||
| -compiler "compiler"| Use a different go compiler to build, eg go1.15beta1 | go |
|
||||
| -ldflags "flags" | Additional ldflags to pass to the compiler | |
|
||||
| -nopackage | Do not package application | |
|
||||
| -o filename | Output filename | |
|
||||
| -s | Skip building the frontend | |
|
||||
| -f | Force build application | false |
|
||||
| -tags "extra tags" | Build tags to pass to compiler (quoted and space separated) | |
|
||||
| -upx | Compress final binary using "upx" | |
|
||||
| -upxflags | Flags to pass to upx | |
|
||||
| -v int | Verbosity level (0 - silent, 1 - default, 2 - verbose) | 1 |
|
||||
| -webview2 | WebView2 installer strategy: download,embed,browser,error | download |
|
||||
| -u | Updates your project's `go.mod` to use the same version of Wails as the CLI | |
|
||||
| -debug | Retains debug information in the application | false |
|
||||
|
||||
For a detailed description of the `webview2` flag, please refer to the [Windows](/docs/guides/windows) Guide.
|
||||
|
||||
If you prefer to build using standard Go tooling, please consult the [Manual Builds](/docs/guides/manual-builds)
|
||||
guide.
|
||||
|
||||
Example:
|
||||
|
||||
`wails build -clean -o myproject.exe`
|
||||
|
||||
:::info UPX on Apple Silicon
|
||||
|
||||
There are [issues](https://github.com/upx/upx/issues/446) with using UPX with Apple Silicon.
|
||||
|
||||
:::
|
||||
|
||||
:::info UPX on Windows
|
||||
|
||||
Some Antivirus vendors false positively mark `upx` compressed binaries as virus, see [issue](https://github.com/upx/upx/issues/437).
|
||||
|
||||
:::
|
||||
|
||||
### Platforms
|
||||
|
||||
Supported platforms are:
|
||||
|
||||
| Platform | Description |
|
||||
|:---------------- |:--------------------------------------------- |
|
||||
| darwin | MacOS + architecture of build machine |
|
||||
| darwin/amd64 | MacOS 10.13+ AMD64 |
|
||||
| darwin/arm64 | MacOS 11.0+ ARM64 |
|
||||
| darwin/universal | MacOS AMD64+ARM64 universal application |
|
||||
| windows | Windows 10/11 + architecture of build machine |
|
||||
| windows/amd64 | Windows 10/11 AMD64 |
|
||||
| windows/arm64 | Windows 10/11 ARM64 |
|
||||
| linux | Linux + architecture of build machine |
|
||||
| linux/amd64 | Linux AMD64 |
|
||||
| linux/arm64 | Linux ARM64 |
|
||||
|
||||
|
||||
## doctor
|
||||
|
||||
`wails doctor` will run diagnostics to ensure that your system is ready for development.
|
||||
|
||||
Example:
|
||||
```
|
||||
Wails CLI v2.0.0-beta
|
||||
|
||||
Scanning system - Please wait (this may take a long time)...Done.
|
||||
|
||||
System
|
||||
------
|
||||
OS: Windows 10 Pro
|
||||
Version: 2009 (Build: 19043)
|
||||
ID: 21H1
|
||||
Go Version: go1.17
|
||||
Platform: windows
|
||||
Architecture: amd64
|
||||
|
||||
Dependency Package Name Status Version
|
||||
---------- ------------ ------ -------
|
||||
WebView2 N/A Installed 93.0.961.52
|
||||
npm N/A Installed 6.14.15
|
||||
*upx N/A Installed upx 3.96
|
||||
|
||||
* - Optional Dependency
|
||||
|
||||
Diagnosis
|
||||
---------
|
||||
Your system is ready for Wails development!
|
||||
|
||||
```
|
||||
|
||||
## dev
|
||||
|
||||
`wails dev` is used to run your application in a "live development" mode. This means:
|
||||
|
||||
- The application's `go.mod` will be updated to use the same version of Wails as the CLI
|
||||
- The application is compiled and run automatically
|
||||
- A watcher is started and will trigger a rebuild of your dev app if it detects changes to your go files
|
||||
- A webserver is started on `http://localhost:34115` which serves your application (not just frontend) over http. This allows you to use your favourite browser development extensions
|
||||
- All application assets are loaded from disk. If they are changed, the application will automatically reload (not rebuild). All connected browsers will also reload
|
||||
- A JS module is generated that provides the following:
|
||||
- Javascript wrappers of your Go methods with autogenerated JSDoc, providing code hinting
|
||||
- TypeScript versions of your Go structs, that can be constructed and passed to your go methods
|
||||
- A second JS module is generated that provides a wrapper + TS declaration for the runtime
|
||||
|
||||
| Flag | Description | Default |
|
||||
| :------------------- | :-------------------------------------- | :------------------------- |
|
||||
| -assetdir "./path/to/assets" | Serve assets from the given directory instead of using the provided asset FS | Value in `wails.json` |
|
||||
| -browser | Opens a browser to `http://localhost:34115` on startup | |
|
||||
| -compiler "compiler"| Use a different go compiler to build, eg go1.15beta1 | go |
|
||||
| -e | Extensions to trigger rebuilds (comma separated) | go |
|
||||
| -reloaddirs | Additional directories to trigger reloads (comma separated) | Value in `wails.json` |
|
||||
| -ldflags "flags" | Additional ldflags to pass to the compiler | |
|
||||
| -tags "extra tags" | Build tags to pass to compiler (quoted and space separated) | |
|
||||
| -loglevel "loglevel"| Loglevel to use - Trace, Debug, Info, Warning, Error | Debug |
|
||||
| -noreload | Disable automatic reload when assets change | |
|
||||
| -v | Verbosity level (0 - silent, 1 - standard, 2 - verbose) | 1 |
|
||||
| -wailsjsdir | The directory to generate the generated Wails JS modules | Value in `wails.json` |
|
||||
| -debounce | The time to wait for reload after an asset change is detected | 100 (milliseconds) |
|
||||
| -devserverurl "url" | Use 3rd party dev server url, EG Vite | "http://localhost:34115" |
|
||||
| -appargs "args" | Arguments passed to the application in shell style | |
|
||||
| -platform "platform" | Platform/Arch to target | `runtime.GOOS` |
|
||||
| -save | Saves the given `assetdir`, `reloaddirs`, `wailsjsdir`, `debounce` and `devserverurl` flags in
|
||||
`wails.json` to become the defaults for subsequent invocations. | |
|
||||
|
||||
Example:
|
||||
|
||||
`wails dev -assetdir ./frontend/dist -wailsjsdir ./frontend/src -browser`
|
||||
|
||||
This command will do the following:
|
||||
|
||||
- Build the application and run it (more details [here](/docs/guides/manual-builds)
|
||||
- Generate the Wails JS modules in `./frontend/src`
|
||||
- Watch for updates to files in `./frontend/dist` and reload on any change
|
||||
- Open a browser and connect to the application
|
||||
|
||||
There is more information on using this feature with existing framework scripts [here](/docs/guides/application-development#live-reloading).
|
||||
|
||||
## generate
|
||||
|
||||
### template
|
||||
|
||||
Wails uses templates for project generation. The `wails generate template` command helps scaffold a template so that
|
||||
it may be used for generating projects.
|
||||
|
||||
| Flag | Description |
|
||||
| :------------------- | :------------------------------------------- |
|
||||
| -name | The template name (Mandatory) |
|
||||
| -frontend "path" | Path to frontend project to use in template |
|
||||
|
||||
For more details on creating templates, consult the [Templates guide](/docs/guides/templates).
|
||||
|
||||
## update
|
||||
|
||||
`wails update` will update the version of the Wails CLI.
|
||||
|
||||
| Flag | Description |
|
||||
| :------------------- | :-------------------------------------- |
|
||||
| -pre | Update to latest pre-release version |
|
||||
| -version "version" | Install a specific version of the CLI |
|
||||
|
||||
|
||||
## version
|
||||
|
||||
`wails version` will simply output the current CLI version.
|
||||
@ -0,0 +1,250 @@
|
||||
---
|
||||
sidebar_position: 4
|
||||
---
|
||||
|
||||
# Menus
|
||||
|
||||
It is possible to add an application menu to Wails projects. This is achieved by defining a [Menu](#menu) struct and
|
||||
setting the [`Menu`](/docs/reference/options#menu) option, or by calling the runtime method [MenuSetApplicationMenu](/docs/reference/runtime/menu#menusetapplicationmenu).
|
||||
|
||||
It is also possible to dynamically update the menu, by updating the menu struct and calling
|
||||
[MenuUpdateApplicationMenu](/docs/reference/runtime/menu#menuupdateapplicationmenu).
|
||||
|
||||
Example:
|
||||
|
||||
```go
|
||||
myMenu := menu.NewMenuFromItems(
|
||||
menu.SubMenu("File", menu.NewMenuFromItems(
|
||||
menu.Text("&Open", keys.CmdOrCtrl("o"), openFile),
|
||||
menu.Separator(),
|
||||
menu.Text("Quit", keys.CmdOrCtrl("q"), func(_ *menu.CallbackData) {
|
||||
runtime.Quit()
|
||||
}),
|
||||
)),
|
||||
)
|
||||
|
||||
runtime.MenuSetApplicationMenu(myMenu)
|
||||
|
||||
```
|
||||
|
||||
The example above uses helper methods, however it's possible to build the menu structs manually.
|
||||
|
||||
## Menu
|
||||
|
||||
A Menu is a collection of MenuItems:
|
||||
|
||||
```go title="Package: github.com/wailsapp/wails/v2/pkg/menu"
|
||||
type Menu struct {
|
||||
Items []*MenuItem
|
||||
}
|
||||
```
|
||||
|
||||
For the Application menu, each MenuItem represents a single menu such as "Edit".
|
||||
|
||||
A simple helper method is provided for building menus:
|
||||
|
||||
```go title="Package: github.com/wailsapp/wails/v2/pkg/menu"
|
||||
func NewMenuFromItems(first *MenuItem, rest ...*MenuItem) *Menu
|
||||
```
|
||||
|
||||
This makes the layout of the code more like that of a menu without the need to add the menu items manually after creating them.
|
||||
Alternatively, you can just create the menu items and add them to the menu manually.
|
||||
|
||||
## MenuItem
|
||||
|
||||
A MenuItem represents an item within a Menu.
|
||||
|
||||
```go title="Package: github.com/wailsapp/wails/v2/pkg/menu"
|
||||
// MenuItem represents a menu item contained in a menu
|
||||
type MenuItem struct {
|
||||
Label string
|
||||
Role Role
|
||||
Accelerator *keys.Accelerator
|
||||
Type Type
|
||||
Disabled bool
|
||||
Hidden bool
|
||||
Checked bool
|
||||
SubMenu *Menu
|
||||
Click Callback
|
||||
}
|
||||
```
|
||||
|
||||
| Field | Type | Notes |
|
||||
| ---------------- | ---------------------------------- | ----------------------------------------------------- |
|
||||
| Label | string | The menu text |
|
||||
| Accelerator | [\*keys.Accelerator](#accelerator) | Key binding for this menu item |
|
||||
| Type | [Type](#type) | Type of MenuItem |
|
||||
| Disabled | bool | Disables the menu item |
|
||||
| Hidden | bool | Hides this menu item |
|
||||
| Checked | bool | Adds check to item (Checkbox & Radio types) |
|
||||
| SubMenu | [\*Menu](#menu) | Sets the submenu |
|
||||
| Click | [Callback](#callback) | Callback function when menu clicked |
|
||||
| Role | string | Defines a [role](#role) for this menu item. Mac only for now. |
|
||||
|
||||
### Accelerator
|
||||
|
||||
Accelerators (sometimes called keyboard shortcuts) define a binding between a keystroke and a menu item. Wails defines
|
||||
an Accelerator as a combination or key + [Modifier](#modifier). They are available in the `"github.com/wailsapp/wails/v2/pkg/menu/keys"` package.
|
||||
|
||||
Example:
|
||||
|
||||
```go title="Package: github.com/wailsapp/wails/v2/pkg/menu/keys"
|
||||
// Defines cmd+o on Mac and ctrl-o on Window/Linux
|
||||
myShortcut := keys.CmdOrCtrl("o")
|
||||
```
|
||||
|
||||
Keys are any single character on a keyboard with the exception of `+`, which is defined as `plus`.
|
||||
Some keys cannot be represented as characters so there are a set of named characters that may be used:
|
||||
|
||||
- `backspace`
|
||||
- `tab`
|
||||
- `return`
|
||||
- `enter`
|
||||
- `escape`
|
||||
- `left`
|
||||
- `right`
|
||||
- `up`
|
||||
- `down`
|
||||
- `space`
|
||||
- `delete`
|
||||
- `home`
|
||||
- `end`
|
||||
- `page up`
|
||||
- `page down`
|
||||
- `f1`
|
||||
- `f2`
|
||||
- `f3`
|
||||
- `f4`
|
||||
- `f5`
|
||||
- `f6`
|
||||
- `f7`
|
||||
- `f8`
|
||||
- `f9`
|
||||
- `f10`
|
||||
- `f11`
|
||||
- `f12`
|
||||
- `f13`
|
||||
- `f14`
|
||||
- `f15`
|
||||
- `f16`
|
||||
- `f17`
|
||||
- `f18`
|
||||
- `f19`
|
||||
- `f20`
|
||||
- `f21`
|
||||
- `f22`
|
||||
- `f23`
|
||||
- `f24`
|
||||
- `f25`
|
||||
- `f26`
|
||||
- `f27`
|
||||
- `f28`
|
||||
- `f29`
|
||||
- `f30`
|
||||
- `f31`
|
||||
- `f32`
|
||||
- `f33`
|
||||
- `f34`
|
||||
- `f35`
|
||||
- `numlock`
|
||||
|
||||
Wails also supports parsing accelerators using the same syntax as Electron. This is useful for storing accelerators in
|
||||
config files.
|
||||
|
||||
Example:
|
||||
|
||||
```go title="Package: github.com/wailsapp/wails/v2/pkg/menu/keys"
|
||||
// Defines cmd+o on Mac and ctrl-o on Window/Linux
|
||||
myShortcut, err := keys.Parse("Ctrl+Option+A")
|
||||
```
|
||||
|
||||
#### Modifier
|
||||
|
||||
The following modifiers are keys that may be used in combination with the accelerator key:
|
||||
|
||||
```go title="Package: github.com/wailsapp/wails/v2/pkg/menu/keys"
|
||||
const (
|
||||
// CmdOrCtrlKey represents Command on Mac and Control on other platforms
|
||||
CmdOrCtrlKey Modifier = "cmdorctrl"
|
||||
// OptionOrAltKey represents Option on Mac and Alt on other platforms
|
||||
OptionOrAltKey Modifier = "optionoralt"
|
||||
// ShiftKey represents the shift key on all systems
|
||||
ShiftKey Modifier = "shift"
|
||||
// ControlKey represents the control key on all systems
|
||||
ControlKey Modifier = "ctrl"
|
||||
)
|
||||
```
|
||||
A number of helper methods are available to create Accelerators using modifiers:
|
||||
|
||||
```go title="Package: github.com/wailsapp/wails/v2/pkg/menu/keys"
|
||||
func CmdOrCtrl(key string) *Accelerator
|
||||
func OptionOrAlt(key string) *Accelerator
|
||||
func Shift(key string) *Accelerator
|
||||
func Control(key string) *Accelerator
|
||||
```
|
||||
|
||||
Modifiers can be combined using `keys.Combo(key string, modifier1 Modifier, modifier2 Modifier, rest ...Modifier)`:
|
||||
|
||||
```go title="Package: github.com/wailsapp/wails/v2/pkg/menu/keys"
|
||||
// Defines "Ctrl+Option+A" on Mac and "Ctrl+Alt+A" on Window/Linux
|
||||
myShortcut := keys.Combo("a", ControlKey, OptionOrAltKey)
|
||||
```
|
||||
|
||||
### Type
|
||||
|
||||
Each menu item must have a type and there are 5 types available:
|
||||
|
||||
```go title="Package: github.com/wailsapp/wails/v2/pkg/menu"
|
||||
const (
|
||||
TextType Type = "Text"
|
||||
SeparatorType Type = "Separator"
|
||||
SubmenuType Type = "Submenu"
|
||||
CheckboxType Type = "Checkbox"
|
||||
RadioType Type = "Radio"
|
||||
)
|
||||
```
|
||||
|
||||
For convenience, helper methods are provided to quickly create a menu item:
|
||||
|
||||
```go title="Package: github.com/wailsapp/wails/v2/pkg/menu"
|
||||
func Text(label string, accelerator *keys.Accelerator, click Callback) *MenuItem
|
||||
func Separator() *MenuItem
|
||||
func Radio(label string, selected bool, accelerator *keys.Accelerator, click Callback) *MenuItem
|
||||
func Checkbox(label string, checked bool, accelerator *keys.Accelerator, click Callback) *MenuItem
|
||||
func SubMenu(label string, menu *Menu) *MenuItem
|
||||
```
|
||||
|
||||
A note on radio groups: A radio group is defined as a number of radio menu items that are next to each other in the menu.
|
||||
This means that you do not need to group items together as it is automatic. However, that also means you cannot have 2
|
||||
radio groups next to each other - there must be a non-radio item between them.
|
||||
|
||||
### Callback
|
||||
|
||||
Each menu item may have a callback that is executed when the item is clicked:
|
||||
|
||||
```go title="Package: github.com/wailsapp/wails/v2/pkg/menu"
|
||||
type Callback func(*CallbackData)
|
||||
|
||||
type CallbackData struct {
|
||||
MenuItem *MenuItem
|
||||
}
|
||||
```
|
||||
|
||||
The function is given a `CallbackData` struct which indicates which menu item triggered the callback. This is useful when
|
||||
using radio groups that may share a callback.
|
||||
|
||||
### Role
|
||||
|
||||
:::info Roles
|
||||
|
||||
Roles are currently supported on Mac only.
|
||||
|
||||
:::
|
||||
|
||||
A menu item may have a role, which is essentially a pre-defined menu item. We currently support the following roles:
|
||||
|
||||
| Role | Description |
|
||||
| ---- | ----------- |
|
||||
| AppMenuRole | The standard Mac application menu. Can be created using `menu.AppMenu()` |
|
||||
| EditMenuRole | The standard Mac edit menu. Can be created using `menu.EditMenu()` |
|
||||
|
||||
@ -0,0 +1,552 @@
|
||||
---
|
||||
sidebar_position: 3
|
||||
---
|
||||
|
||||
# Options
|
||||
|
||||
## Application Options
|
||||
|
||||
The `Options.App` struct contains the application configuration.
|
||||
It is passed to the `wails.Run()` method:
|
||||
|
||||
```go title="Example"
|
||||
import "github.com/wailsapp/wails/v2/pkg/options"
|
||||
|
||||
func main() {
|
||||
|
||||
err := wails.Run(&options.App{
|
||||
Title: "Menus Demo",
|
||||
Width: 800,
|
||||
Height: 600,
|
||||
DisableResize: false,
|
||||
Fullscreen: false,
|
||||
Frameless: true,
|
||||
MinWidth: 400,
|
||||
MinHeight: 400,
|
||||
MaxWidth: 1280,
|
||||
MaxHeight: 1024,
|
||||
StartHidden: false,
|
||||
HideWindowOnClose: false,
|
||||
RGBA: &options.RGBA{R: 0, G: 0, B: 0, A: 255},
|
||||
AlwaysOnTop: false,
|
||||
Assets: assets,
|
||||
Menu: app.applicationMenu(),
|
||||
Logger: nil,
|
||||
LogLevel: logger.DEBUG,
|
||||
OnStartup: app.startup,
|
||||
OnDomReady: app.domready,
|
||||
OnShutdown: app.shutdown,
|
||||
OnBeforeClose: app.beforeClose,
|
||||
WindowStartState: options.Maximised,
|
||||
Bind: []interface{}{
|
||||
app,
|
||||
},
|
||||
Windows: &windows.Options{
|
||||
WebviewIsTransparent: false,
|
||||
WindowIsTranslucent: false,
|
||||
DisableWindowIcon: false,
|
||||
DisableFramelessWindowDecorations: false,
|
||||
WebviewUserDataPath: "",
|
||||
Theme: windows.SystemDefault,
|
||||
CustomTheme: &windows.ThemeSettings{
|
||||
DarkModeTitleBar: windows.RGB(20, 20, 20),
|
||||
DarkModeTitleText: windows.RGB(200, 200, 200),
|
||||
DarkModeBorder: windows.RGB(20, 0, 20),
|
||||
LightModeTitleBar: windows.RGB(200, 200, 200),
|
||||
LightModeTitleText: windows.RGB(20, 20, 20),
|
||||
LightModeBorder: windows.RGB(200, 200, 200),
|
||||
},
|
||||
},
|
||||
Mac: &mac.Options{
|
||||
TitleBar: &mac.TitleBar{
|
||||
TitlebarAppearsTransparent: true,
|
||||
HideTitle: false,
|
||||
HideTitleBar: false,
|
||||
FullSizeContent: false,
|
||||
UseToolbar: false,
|
||||
HideToolbarSeparator: true,
|
||||
},
|
||||
Appearance: mac.NSAppearanceNameDarkAqua,
|
||||
WebviewIsTransparent: true,
|
||||
WindowIsTranslucent: false,
|
||||
About: &mac.AboutInfo{
|
||||
Title: "My Application",
|
||||
Message: "© 2021 Me",
|
||||
Icon: icon,
|
||||
},
|
||||
},
|
||||
})
|
||||
if err != nil {
|
||||
log.Fatal(err)
|
||||
}
|
||||
}
|
||||
|
||||
```
|
||||
|
||||
|
||||
|
||||
### Title
|
||||
|
||||
Name: Title
|
||||
|
||||
Type: string
|
||||
|
||||
The text shown in the window's title bar.
|
||||
|
||||
### Width
|
||||
|
||||
Name: Width
|
||||
|
||||
Type: int
|
||||
|
||||
The initial width of the window.
|
||||
Default: 1024.
|
||||
|
||||
### Height
|
||||
|
||||
Name: Height
|
||||
|
||||
Type: int
|
||||
|
||||
The initial height of the window.
|
||||
Default: 768
|
||||
|
||||
### DisableResize
|
||||
|
||||
Name: DisableResize
|
||||
|
||||
Type: bool
|
||||
|
||||
By default, the main window is resizable. Setting this to `true` will keep it a fixed size.
|
||||
|
||||
### Fullscreen
|
||||
|
||||
Name: Fullscreen
|
||||
|
||||
Type: bool
|
||||
|
||||
Setting this to `true` will make the window fullscreen at startup.
|
||||
|
||||
### Frameless
|
||||
|
||||
Name: Frameless
|
||||
|
||||
Type: bool
|
||||
|
||||
When set to `true`, the window will have no borders or title bar.
|
||||
Also see [Frameless Windows](/docs/guides/frameless).
|
||||
|
||||
### MinWidth
|
||||
|
||||
Name: MinWidth
|
||||
|
||||
Type: int
|
||||
|
||||
This sets the minimum width for the window. If the value given in `Width` is less than this value,
|
||||
the window will be set to `MinWidth` by default.
|
||||
|
||||
### MinHeight
|
||||
|
||||
Name: MinHeight
|
||||
|
||||
Type: int
|
||||
|
||||
This sets the minimum height for the window. If the value given in `Height` is less than this value,
|
||||
the window will be set to `MinHeight` by default.
|
||||
|
||||
### MaxWidth
|
||||
|
||||
Name: MaxWidth
|
||||
|
||||
Type: int
|
||||
|
||||
This sets the maximum width for the window. If the value given in `Width` is more than this value,
|
||||
the window will be set to `MaxWidth` by default.
|
||||
|
||||
### MaxHeight
|
||||
|
||||
Name: MaxHeight
|
||||
|
||||
Type: int
|
||||
|
||||
This sets the maximum height for the window. If the value given in `Height` is more than this value,
|
||||
the window will be set to `MaxHeight` by default.
|
||||
|
||||
### StartHidden
|
||||
|
||||
Name: StartHidden
|
||||
|
||||
Type: bool
|
||||
|
||||
When set to `true`, the application will be hidden until [WindowShow](/docs/reference/runtime/window#WindowShow)
|
||||
is called.
|
||||
|
||||
### HideWindowOnClose
|
||||
|
||||
Name: HideWindowOnClose
|
||||
|
||||
Type: bool
|
||||
|
||||
By default, closing the window will close the application. Setting this to `true` means closing the window will
|
||||
hide the window instead.
|
||||
|
||||
### RGBA
|
||||
|
||||
Name: RGBA
|
||||
|
||||
Type: int (0xRRGGBBAA)
|
||||
Example: 0xFF000088 - Red at 50% transparency
|
||||
|
||||
This value is the RGBA value to set the window by default.
|
||||
Default: 0xFFFFFFFF.
|
||||
|
||||
### AlwaysOnTop
|
||||
|
||||
Name: AlwaysOnTop
|
||||
|
||||
Type: bool
|
||||
|
||||
Indicates that the window should stay above other windows when losing focus.
|
||||
|
||||
### Assets
|
||||
|
||||
Name: Assets
|
||||
|
||||
Type: \*embed.FS
|
||||
|
||||
The frontend assets to be used by the application. Requires an `index.html` file.
|
||||
|
||||
### Menu
|
||||
|
||||
Name: Menu
|
||||
|
||||
Type: \*menu.Menu
|
||||
|
||||
The menu to be used by the application. More details about Menus in the [Menu Reference](/docs/reference/runtime/menu).
|
||||
|
||||
NOTE: On Mac, if no menu is specified, a default menu will be created.
|
||||
|
||||
### Logger
|
||||
|
||||
Name: Logger
|
||||
|
||||
Type: logger.Logger
|
||||
|
||||
Default: Logger to Stdout
|
||||
|
||||
The logger to be used by the application. More details about logging in the [Log Reference](/docs/reference/runtime/log).
|
||||
|
||||
### LogLevel
|
||||
|
||||
Name: LogLevel
|
||||
|
||||
Type: logger.LogLevel
|
||||
|
||||
Default: `Info` in dev mode, `Error` in production mode
|
||||
|
||||
The default log level. More details about logging in the [Log Reference](/docs/reference/runtime/log).
|
||||
|
||||
### OnStartup
|
||||
|
||||
Name: OnStartup
|
||||
|
||||
Type: func(ctx context.Context)
|
||||
|
||||
This callback is called after the frontend has been created, but before `index.html` has been loaded. It is given
|
||||
the application context.
|
||||
|
||||
### OnDomReady
|
||||
|
||||
Name: OnDomReady
|
||||
|
||||
Type: func(ctx context.Context)
|
||||
|
||||
This callback is called after the frontend has loaded `index.html` and its resources. It is given
|
||||
the application context.
|
||||
|
||||
### OnShutdown
|
||||
|
||||
Name: OnShutdown
|
||||
|
||||
Type: func(ctx context.Context)
|
||||
|
||||
This callback is called after the frontend has been destroyed, just before the application terminates. It is given
|
||||
the application context.
|
||||
|
||||
### OnBeforeClose
|
||||
|
||||
Name: OnBeforeClose
|
||||
|
||||
Type: func(ctx context.Context) bool
|
||||
|
||||
If this callback is set, it will be called when the application is about to quit, either by clicking the window close
|
||||
button or calling `runtime.Quit`. Returning true will cause the application to continue, false will continue shutdown
|
||||
as normal. This is good for confirming with the user that they wish to exit the program.
|
||||
|
||||
Example:
|
||||
```go title=windowsapp.go
|
||||
func (b *App) beforeClose(ctx context.Context) (prevent bool) {
|
||||
dialog, err := runtime.MessageDialog(ctx, runtime.MessageDialogOptions{
|
||||
Type: runtime.QuestionDialog,
|
||||
Title: "Quit?",
|
||||
Message: "Are you sure you want to quit?",
|
||||
})
|
||||
|
||||
if err != nil {
|
||||
return false
|
||||
}
|
||||
return dialog != "Yes"
|
||||
}
|
||||
```
|
||||
|
||||
### WindowStartState
|
||||
|
||||
Name: WindowStartState
|
||||
|
||||
Type: options.WindowStartState
|
||||
|
||||
Defines how the window should present itself at startup.
|
||||
|
||||
| Value | Win | Mac | Lin |
|
||||
| --------------- | --- | --- | --- |
|
||||
| Fullscreen | ✅ | ✅ | ✅ |
|
||||
| Maximised | ✅ | ✅ | ✅ |
|
||||
| Minimised | ✅ | | ✅ |
|
||||
|
||||
### Bind
|
||||
|
||||
Name: Bind
|
||||
|
||||
Type: []interface{}
|
||||
|
||||
A slice of struct instances defining methods that need to be bound to the frontend.
|
||||
|
||||
### Windows
|
||||
|
||||
Name: Windows
|
||||
|
||||
Type: \*windows.Options
|
||||
|
||||
This defines [Windows specific options](#windows-specific-options).
|
||||
|
||||
### Mac
|
||||
|
||||
Name: Mac
|
||||
|
||||
Type: \*mac.Options
|
||||
|
||||
This defines [Mac specific options](#mac-specific-options).
|
||||
|
||||
## Windows Specific Options
|
||||
|
||||
### WebviewIsTransparent
|
||||
|
||||
Name: WebviewIsTransparent
|
||||
|
||||
Type: bool
|
||||
|
||||
Setting this to `true` will make the webview background transparent when an alpha value of `0` is used.
|
||||
This means that if you use `rgba(0,0,0,0)`, the host window will show through.
|
||||
Often combined with [WindowIsTranslucent](#WindowIsTranslucent) to make frosty-looking applications.
|
||||
|
||||
### WindowIsTranslucent
|
||||
|
||||
Name: WindowIsTranslucent
|
||||
|
||||
Type: bool
|
||||
|
||||
Setting this to `true` will make the window background translucent. Often combined
|
||||
with [WebviewIsTransparent](#WebviewIsTransparent) to make frosty-looking applications.
|
||||
|
||||
### DisableWindowIcon
|
||||
|
||||
Name: DisableWindowIcon
|
||||
|
||||
Type: bool
|
||||
|
||||
Setting this to `true` will remove the icon in the top left corner of the title bar.
|
||||
|
||||
### DisableFramelessWindowDecorations
|
||||
|
||||
Name: DisableFramelessWindowDecorations
|
||||
|
||||
Type: bool
|
||||
|
||||
Setting this to `true` will remove the window decorations in [Frameless](#Frameless) mode. This means there will be no
|
||||
'Aero Shadow' and no 'Rounded Corners' shown for the window. Please note that 'Rounded Corners' are only supported on
|
||||
Windows 11.
|
||||
|
||||
### WebviewUserDataPath
|
||||
|
||||
Name: WebviewUserDataPath
|
||||
|
||||
Type: string
|
||||
|
||||
This defines the path where the WebView2 stores the user data. If empty `%APPDATA%\[BinaryName.exe]` will be used.
|
||||
|
||||
## Mac Specific Options
|
||||
|
||||
### TitleBar
|
||||
|
||||
Name: TitleBar
|
||||
|
||||
Type: [*mac.TitleBar](#titlebar-struct)
|
||||
|
||||
The TitleBar struct provides the ability to configure the look and feel of the title bar.
|
||||
|
||||
### Appearance
|
||||
|
||||
Name: Appearance
|
||||
|
||||
Type: [AppearanceType](#appearance-type)
|
||||
|
||||
Appearance is used to set the style of your app in accordance with Apple's [NSAppearance](https://developer.apple.com/documentation/appkit/nsappearancename?language=objc) names.
|
||||
|
||||
### WebviewIsTransparent
|
||||
|
||||
Name: WebviewIsTransparent
|
||||
|
||||
Type: bool
|
||||
|
||||
Setting this to `true` will make the webview background transparent when an alpha value of `0` is used.
|
||||
This means that if you use `rgba(0,0,0,0)`, the host window will show through.
|
||||
Often combined with [WindowIsTranslucent](#WindowIsTranslucent) to make frosty-looking applications.
|
||||
|
||||
### WindowIsTranslucent
|
||||
|
||||
Name: WindowIsTranslucent
|
||||
|
||||
Type: bool
|
||||
|
||||
Setting this to `true` will make the window background translucent. Often combined
|
||||
with [WebviewIsTransparent](#WebviewIsTransparent) to make frosty-looking applications.
|
||||
|
||||
### About
|
||||
|
||||
Name: About
|
||||
|
||||
Type: [About](#about-struct)
|
||||
|
||||
This configuration lets you set the title, message and icon for the "About" menu item in the app menu created by the "AppMenu" role.
|
||||
|
||||
#### Titlebar struct
|
||||
|
||||
The titlebar of the application can be customised by using the TitleBar options:
|
||||
|
||||
```go
|
||||
type TitleBar struct {
|
||||
TitlebarAppearsTransparent bool
|
||||
HideTitle bool
|
||||
HideTitleBar bool
|
||||
FullSizeContent bool
|
||||
UseToolbar bool
|
||||
HideToolbarSeparator bool
|
||||
}
|
||||
```
|
||||
|
||||
| Name | Description |
|
||||
| ---- | ----------- |
|
||||
| TitlebarAppearsTransparent | Makes the titlebar transparent. [Apple Docs](https://developer.apple.com/documentation/appkit/nswindow/1419167-titlebarappearstransparent?language=objc) |
|
||||
| HideTitle | Hides the title of the window. [Apple Docs](https://developer.apple.com/documentation/appkit/nswindowtitlevisibility?language=objc) |
|
||||
| HideTitleBar | Removes [NSWindowStyleMaskTitled](https://developer.apple.com/documentation/appkit/nswindowstylemask/nswindowstylemasktitled/) from the style mask |
|
||||
| FullSizeContent | Makes the webview fill the entire window. [Apple Docs](https://developer.apple.com/documentation/appkit/nswindowstylemask/nswindowstylemaskfullsizecontentview)|
|
||||
| UseToolbar | Adds a default toolbar to the window. [Apple Docs](https://developer.apple.com/documentation/appkit/nstoolbar?language=objc) |
|
||||
| HideToolbarSeparator | Removes the line beneath the toolbar. [Apple Docs](https://developer.apple.com/documentation/appkit/nstoolbar/1516954-showsbaselineseparator?language=objc) |
|
||||
|
||||
Preconfigured titlebar settings are available:
|
||||
|
||||
| Setting | Example |
|
||||
| ------- | ------- |
|
||||
|`mac.TitleBarDefault()` |  |
|
||||
|`mac.TitleBarHidden()` |  |
|
||||
|`mac.TitleBarHiddenInset()` |  |
|
||||
|
||||
Example:
|
||||
```go
|
||||
Mac: &mac.Options{
|
||||
TitleBar: mac.TitleBarHiddenInset(),
|
||||
}
|
||||
```
|
||||
|
||||
Click [here](https://github.com/lukakerr/NSWindowStyles) for some inspiration on customising the titlebar.
|
||||
|
||||
#### Appearance type
|
||||
|
||||
You can specify the application's [appearance](https://developer.apple.com/documentation/appkit/nsappearance?language=objc).
|
||||
|
||||
| Value | Description |
|
||||
| --------------- | ------------------ |
|
||||
| DefaultAppearance | DefaultAppearance uses the default system value |
|
||||
| NSAppearanceNameAqua | The standard light system appearance |
|
||||
| NSAppearanceNameDarkAqua | The standard dark system appearance |
|
||||
| NSAppearanceNameVibrantLight | The light vibrant appearance |
|
||||
| NSAppearanceNameAccessibilityHighContrastAqua | A high-contrast version of the standard light system appearance |
|
||||
| NSAppearanceNameAccessibilityHighContrastDarkAqua | A high-contrast version of the standard dark system appearance |
|
||||
| NSAppearanceNameAccessibilityHighContrastVibrantLight | A high-contrast version of the light vibrant appearance |
|
||||
| NSAppearanceNameAccessibilityHighContrastVibrantDark | A high-contrast version of the dark vibrant appearance |
|
||||
|
||||
Example:
|
||||
```go
|
||||
Mac: &mac.Options{
|
||||
Appearance: mac.NSAppearanceNameDarkAqua,
|
||||
}
|
||||
```
|
||||
|
||||
#### About struct
|
||||
|
||||
```go
|
||||
type AboutInfo struct {
|
||||
Title string
|
||||
Message string
|
||||
Icon []byte
|
||||
}
|
||||
```
|
||||
If these settings are provided, an "About" menu item will appear in the app menu (when using the `AppMenu` role).
|
||||
Given this configuration:
|
||||
```go
|
||||
//go:embed build/appicon.png
|
||||
var icon []byte
|
||||
|
||||
func main() {
|
||||
err := wails.Run(&options.App{
|
||||
...
|
||||
Mac: &mac.Options{
|
||||
About: &mac.AboutInfo{
|
||||
Title: "My Application",
|
||||
Message: "© 2021 Me",
|
||||
Icon: icon,
|
||||
},
|
||||
},
|
||||
})
|
||||
```
|
||||
The "About" menu item will appear in the app menu:
|
||||
|
||||
<div class="text--center">
|
||||
<img src="/img/reference/about-menu.png" style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px"}}/>
|
||||
</div>
|
||||
<br/>
|
||||
|
||||
When clicked, that will open an about message box:
|
||||
|
||||
<div class="text--center">
|
||||
<img src="/img/reference/about-dialog.png" width="40%" style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px"}}/>
|
||||
</div>
|
||||
<br/>
|
||||
|
||||
## Linux Specific Options
|
||||
|
||||
### Icon
|
||||
|
||||
Name: Icon
|
||||
|
||||
Type: []byte
|
||||
|
||||
Sets up the icon representing the window. This icon is used when the window is minimized (also known as iconified).
|
||||
Some window managers or desktop environments may also place it in the window frame, or display it in other contexts.
|
||||
On others, the icon is not used at all, so your mileage may vary.
|
||||
|
||||
NOTE: Gnome on Wayland at least does not display this icon. To have a application icon there, a `.desktop` file has to be used.
|
||||
On KDE it should work.
|
||||
|
||||
The icon should be provided in whatever size it was naturally drawn; that is, don’t scale the image before passing it.
|
||||
Scaling is postponed until the last minute, when the desired final size is known, to allow best quality.
|
||||
@ -0,0 +1,44 @@
|
||||
---
|
||||
sidebar_position: 5
|
||||
---
|
||||
|
||||
# Project Config
|
||||
|
||||
The project config resides in the `wails.json` file in the project directory. The structure of the config is:
|
||||
|
||||
```json
|
||||
{
|
||||
"name": "[The project name]",
|
||||
"assetdir": "[Relative path to the directory containing the compiled assets, this is normally inferred and could be left empty]",
|
||||
"reloaddirs": "[Additional directories to trigger reloads (comma separated), this is only used for some advanced asset configurations]",
|
||||
"frontend:install": "[The command to install node dependencies, run in the frontend directory - often `npm install`]",
|
||||
"frontend:build": "[The command to build the assets, run in the frontend directory - often `npm run build`]",
|
||||
"frontend:dev": "[This command is the dev equivalent of frontend:build. If not specified falls back to frontend:build]",
|
||||
"frontend:dev:watcher": "[This command is run in a separate process on `wails dev`. Useful for 3rd party watchers]",
|
||||
"wailsjsdir": "[Relative path to the directory that the auto-generated JS modules will be created]",
|
||||
"version": "[Project config version]",
|
||||
"outputfilename": "[The name of the binary]",
|
||||
"debounceMS": 100, // The default time the dev server waits to reload when it detects a vhange in assets
|
||||
"devserverurl": "[URL to the dev server serving local assets. Default: http://localhost:34115]",
|
||||
"appargs": "[Arguments passed to the application in shell style when in dev mode]",
|
||||
"runNonNativeBuildHooks": false, // Defines if build hooks should be run though they are defined for an OS other than the host OS.
|
||||
"postBuildHooks": {
|
||||
"GOOS/GOARCH": "[The command that will be executed after a build of the specified GOOS/GOARCH: ${platform} is replaced with the "GOOS/GOARCH" and ${bin} with the path to the compiled binary. The "GOOS/GOARCH" hook is executed before the "GOOS/*" and "*/*" hook.]",
|
||||
"GOOS/*": "[The command that will be executed after a build of the specified GOOS: ${platform} is replaced with the "GOOS/GOARCH" and ${bin} with the path to the compiled binary. The "GOOS/*" hook is executed before the "*/*" hook.]",
|
||||
"*/*": "[The command that will be executed after every build: ${platform} is replaced with the "GOOS/GOARCH" and ${bin} with the path to the compiled binary.]"
|
||||
},
|
||||
"info": { // Data used to populate manifests and version info.
|
||||
"companyName": "[The company name. Default: [The project name]]",
|
||||
"productName": "[The product name. Default: [The project name]]",
|
||||
"productVersion": "[The version of the product. Default: '1.0.0']",
|
||||
"copyright": "[The copyright of the product. Default: 'Copyright.........']",
|
||||
"comments": "[A short comment of the app. Default: 'Built using Wails (https://wails.app)']"
|
||||
},
|
||||
"nsisType": "['multiple': One installer per achitecture. 'single': Single universal installer for all architectures being built. Default: 'multiple']"
|
||||
}
|
||||
```
|
||||
|
||||
This file is read by the Wails CLI when running `wails build` or `wails dev`.
|
||||
|
||||
The `assetdir`, `reloaddirs`, `wailsjsdir`, `debounceMS` and `devserverurl` flags in `wails build/dev` will update the project config
|
||||
and thus become defaults for subsequent runs.
|
||||
@ -0,0 +1,4 @@
|
||||
{
|
||||
"label": "Runtime",
|
||||
"position": 1
|
||||
}
|
||||
@ -0,0 +1,20 @@
|
||||
---
|
||||
sidebar_position: 7
|
||||
---
|
||||
|
||||
# Browser
|
||||
|
||||
## Overview
|
||||
|
||||
These methods are related to the system browser.
|
||||
|
||||
### BrowserOpenURL
|
||||
Go Signature: `BrowserOpenURL(ctx context.Context, url string)`
|
||||
|
||||
JS Signature: `BrowserOpenURL(url string)`
|
||||
|
||||
Opens the given URL in the system browser.
|
||||
|
||||
|
||||
|
||||
|
||||
@ -0,0 +1,263 @@
|
||||
---
|
||||
sidebar_position: 5
|
||||
---
|
||||
|
||||
# Dialog
|
||||
|
||||
## Overview
|
||||
|
||||
This part of the runtime provides access to native dialogs, such as File Selectors and Message boxes.
|
||||
|
||||
:::info Javascript
|
||||
Dialog is currently unsupported in the JS runtime.
|
||||
:::
|
||||
|
||||
### OpenDirectoryDialog
|
||||
|
||||
Opens a dialog that prompts the user to select a directory. Can be customised using [OpenDialogOptions](#opendialogoptions).
|
||||
|
||||
Go Signature: `OpenDirectoryDialog(ctx context.Context, dialogOptions OpenDialogOptions) (string, error)`
|
||||
|
||||
Returns: Selected directory (blank if the user cancelled) or an error
|
||||
|
||||
|
||||
### OpenFileDialog
|
||||
|
||||
Opens a dialog that prompts the user to select a file. Can be customised using [OpenDialogOptions](#opendialogoptions).
|
||||
|
||||
Go Signature: `OpenFileDialog(ctx context.Context, dialogOptions OpenDialogOptions) (string, error)`
|
||||
|
||||
Returns: Selected file (blank if the user cancelled) or an error
|
||||
|
||||
|
||||
|
||||
### OpenMultipleFilesDialog
|
||||
|
||||
Opens a dialog that prompts the user to select multiple files. Can be customised using [OpenDialogOptions](#opendialogoptions).
|
||||
|
||||
Go Signature: `OpenMultipleFilesDialog(ctx context.Context, dialogOptions OpenDialogOptions) ([]string, error)`
|
||||
|
||||
Returns: Selected files (nil if the user cancelled) or an error
|
||||
|
||||
|
||||
|
||||
### SaveFileDialog
|
||||
|
||||
Opens a dialog that prompts the user to select a filename for the purposes of saving. Can be customised using [SaveDialogOptions](#savedialogoptions).
|
||||
|
||||
Go Signature: `SaveFileDialog(ctx context.Context, dialogOptions SaveDialogOptions) (string, error)`
|
||||
|
||||
Returns: The selected file (blank if the user cancelled) or an error
|
||||
|
||||
|
||||
|
||||
### MessageDialog
|
||||
|
||||
Displays a message using a message dialog. Can be customised using [MessageDialogOptions](#messagedialogoptions).
|
||||
|
||||
Go Signature: `MessageDialog(ctx context.Context, dialogOptions MessageDialogOptions) (string, error)`
|
||||
|
||||
Returns: The text of the selected button or an error
|
||||
|
||||
## Options
|
||||
|
||||
### OpenDialogOptions
|
||||
|
||||
```go
|
||||
type OpenDialogOptions struct {
|
||||
DefaultDirectory string
|
||||
DefaultFilename string
|
||||
Title string
|
||||
Filters []FileFilter
|
||||
ShowHiddenFiles bool
|
||||
CanCreateDirectories bool
|
||||
ResolvesAliases bool
|
||||
TreatPackagesAsDirectories bool
|
||||
}
|
||||
```
|
||||
| Field | Description | Win | Mac | Lin |
|
||||
| -------------------------- | ---------------------------------------------- | --- | --- | --- |
|
||||
| DefaultDirectory | The directory the dialog will show when opened | ✅ | ✅ | ✅ |
|
||||
| DefaultFilename | The default filename | ✅ | ✅ | ✅ |
|
||||
| Title | Title for the dialog | ✅ | ✅ | ✅ |
|
||||
| [Filters](#filefilter) | A list of file filters | ✅ | ✅ | ✅ |
|
||||
| ShowHiddenFiles | Show files hidden by the system | | ✅ | ✅ |
|
||||
| CanCreateDirectories | Allow user to create directories | | ✅ | |
|
||||
| ResolvesAliases | If true, returns the file not the alias | | ✅ | |
|
||||
| TreatPackagesAsDirectories | Allow navigating into packages | | ✅ | |
|
||||
|
||||
|
||||
### SaveDialogOptions
|
||||
|
||||
```go
|
||||
type SaveDialogOptions struct {
|
||||
DefaultDirectory string
|
||||
DefaultFilename string
|
||||
Title string
|
||||
Filters []FileFilter
|
||||
ShowHiddenFiles bool
|
||||
CanCreateDirectories bool
|
||||
TreatPackagesAsDirectories bool
|
||||
}
|
||||
```
|
||||
|
||||
| Field | Description | Win | Mac | Lin |
|
||||
| -------------------------- | ---------------------------------------------- | --- | --- | --- |
|
||||
| DefaultDirectory | The directory the dialog will show when opened | ✅ | ✅ | ✅ |
|
||||
| DefaultFilename | The default filename | ✅ | ✅ | ✅ |
|
||||
| Title | Title for the dialog | ✅ | ✅ | ✅ |
|
||||
| [Filters](#filefilter) | A list of file filters | ✅ | ✅ | ✅ |
|
||||
| ShowHiddenFiles | Show files hidden by the system | | ✅ | ✅ |
|
||||
| CanCreateDirectories | Allow user to create directories | | ✅ | |
|
||||
| TreatPackagesAsDirectories | Allow navigating into packages | | ✅ | |
|
||||
|
||||
### MessageDialogOptions
|
||||
|
||||
```go
|
||||
type MessageDialogOptions struct {
|
||||
Type DialogType
|
||||
Title string
|
||||
Message string
|
||||
Buttons []string
|
||||
DefaultButton string
|
||||
CancelButton string
|
||||
}
|
||||
```
|
||||
| Field | Description | Win | Mac | Lin |
|
||||
| ------------- | ------------------------------------------------------------------------- | --- | --- | --- |
|
||||
| Type | The type of message dialog, eg question, info... | ✅ | ✅ | ✅ |
|
||||
| Title | Title for the dialog | ✅ | ✅ | ✅ |
|
||||
| Message | The message to show the user | ✅ | ✅ | ✅ |
|
||||
| Buttons | A list of button titles | | ✅ | |
|
||||
| DefaultButton | The button with this text should be treated as default. Bound to `return` | | ✅ | |
|
||||
| CancelButton | The button with this text should be treated as cancel. Bound to `escape` | | ✅ | |
|
||||
|
||||
#### Windows
|
||||
|
||||
Windows has standard dialog types in which the buttons are not customisable.
|
||||
The value returned will be one of: "Ok", "Cancel", "Abort", "Retry", "Ignore", "Yes", "No", "Try Again" or "Continue"
|
||||
|
||||
#### Linux
|
||||
|
||||
Linux has standard dialog types in which the buttons are not customisable.
|
||||
The value returned will be one of: "Ok", "Cancel", "Yes", "No"
|
||||
|
||||
#### Mac
|
||||
|
||||
A message dialog on Mac may specify up to 4 buttons. If no `DefaultButton` or `CancelButton` is given, the first button
|
||||
is considered default and is bound to the `return` key.
|
||||
|
||||
For the following code:
|
||||
```go
|
||||
selection, err := runtime.MessageDialog(b.ctx, runtime.MessageDialogOptions{
|
||||
Title: "It's your turn!",
|
||||
Message: "Select a number",
|
||||
Buttons: []string{"one", "two", "three", "four"},
|
||||
})
|
||||
```
|
||||
the first button is shown as default:
|
||||
<div class="text--center">
|
||||
<img src="/img/runtime/dialog_no_defaults.png" width="30%" style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px"}}/>
|
||||
</div>
|
||||
<br/>
|
||||
|
||||
And if we specify `DefaultButton` to be "two":
|
||||
```go
|
||||
selection, err := runtime.MessageDialog(b.ctx, runtime.MessageDialogOptions{
|
||||
Title: "It's your turn!",
|
||||
Message: "Select a number",
|
||||
Buttons: []string{"one", "two", "three", "four"},
|
||||
DefaultButton: "two",
|
||||
})
|
||||
```
|
||||
the second button is shown as default. When `return` is pressed, the value "two" is returned.
|
||||
<div class="text--center">
|
||||
<img src="/img/runtime/dialog_default_button.png" width="30%" style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px"}}/>
|
||||
</div>
|
||||
<br/>
|
||||
|
||||
If we now specify `CancelButton` to be "three":
|
||||
```go
|
||||
selection, err := runtime.MessageDialog(b.ctx, runtime.MessageDialogOptions{
|
||||
Title: "It's your turn!",
|
||||
Message: "Select a number",
|
||||
Buttons: []string{"one", "two", "three", "four"},
|
||||
DefaultButton: "two",
|
||||
CancelButton: "three",
|
||||
})
|
||||
```
|
||||
the button with "three" is shown at the bottom of the dialog. When `escape` is pressed, the value "three" is returned:
|
||||
<div class="text--center">
|
||||
<img src="/img/runtime/dialog_default_cancel.png" width="30%" style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px"}}/>
|
||||
</div>
|
||||
<br/>
|
||||
<br/>
|
||||
<br/>
|
||||
|
||||
|
||||
#### DialogType
|
||||
|
||||
```go
|
||||
const (
|
||||
InfoDialog DialogType = "info"
|
||||
WarningDialog DialogType = "warning"
|
||||
ErrorDialog DialogType = "error"
|
||||
QuestionDialog DialogType = "question"
|
||||
)
|
||||
```
|
||||
|
||||
### FileFilter
|
||||
|
||||
```go
|
||||
type FileFilter struct {
|
||||
DisplayName string // Filter information EG: "Image Files (*.jpg, *.png)"
|
||||
Pattern string // semi-colon separated list of extensions, EG: "*.jpg;*.png"
|
||||
}
|
||||
```
|
||||
|
||||
#### Windows
|
||||
|
||||
Windows allows you to use multiple file filters in dialog boxes. Each FileFilter will show up as a separate entry in the
|
||||
dialog:
|
||||
|
||||
<div class="text--center">
|
||||
<img src="/img/runtime/dialog_win_filters.png" width="50%" style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px"}}/>
|
||||
</div>
|
||||
<br/>
|
||||
<br/>
|
||||
<br/>
|
||||
|
||||
#### Linux
|
||||
|
||||
Linux allows you to use multiple file filters in dialog boxes. Each FileFilter will show up as a separate entry in the
|
||||
dialog:
|
||||
|
||||
<div class="text--center">
|
||||
<img src="/img/runtime/dialog_lin_filters.png" width="50%" style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px"}}/>
|
||||
</div>
|
||||
<br/>
|
||||
<br/>
|
||||
<br/>
|
||||
|
||||
|
||||
#### Mac
|
||||
|
||||
Mac dialogs only have the concept of a single set of patterns to filter files. If multiple FileFilters are provided,
|
||||
Wails will use all the Patterns defined.
|
||||
|
||||
Example:
|
||||
```go
|
||||
selection, err := runtime.OpenFileDialog(b.ctx, runtime.OpenDialogOptions{
|
||||
Title: "Select File",
|
||||
Filters: []runtime.FileFilter{
|
||||
{
|
||||
DisplayName: "Images (*.png;*.jpg)",
|
||||
Pattern: "*.png;*.jpg",
|
||||
}, {
|
||||
DisplayName: "Videos (*.mov;*.mp4)",
|
||||
Pattern: "*.mov;*.mp4",
|
||||
},
|
||||
},
|
||||
})
|
||||
```
|
||||
This will result in the Open File dialog using `*.png,*.jpg,*.mov,*.mp4` as a filter.
|
||||
@ -0,0 +1,51 @@
|
||||
---
|
||||
sidebar_position: 2
|
||||
---
|
||||
|
||||
# Events
|
||||
|
||||
## Overview
|
||||
|
||||
The Wails runtime provides a unified events system, where events can be emitted or received by either Go or Javascript.
|
||||
Optionally, data may be passed with the events. Listeners will receive the data in the local data types.
|
||||
|
||||
### EventsOn
|
||||
|
||||
Go Signature: `EventsOn(ctx context.Context, eventName string, callback func(optionalData ...interface{}))`
|
||||
|
||||
JS Signature: `EventsOn(eventName string, callback function(optionalData?: any))`
|
||||
|
||||
This method sets up a listener for the given event name. When an event of type `eventName` is [emitted](#EventsEmit),
|
||||
the callback is triggered. Any additional data sent with the emitted event will be passed to the callback.
|
||||
|
||||
### EventsOff
|
||||
|
||||
Go Signature: `EventsOff(ctx context.Context, eventName string)`
|
||||
|
||||
JS Signature: `EventsOff(eventName string)`
|
||||
|
||||
This method unregisters the listener for the given event name.
|
||||
|
||||
### EventsOnce
|
||||
|
||||
Go Signature: `EventsOnce(ctx context.Context, eventName string, callback func(optionalData ...interface{}))`
|
||||
|
||||
JS Signature: `EventsOnce(eventName string, callback function(optionalData?: any))`
|
||||
|
||||
This method sets up a listener for the given event name, but will only trigger once.
|
||||
|
||||
### EventsOnMultiple
|
||||
|
||||
Go Signature: `EventsOnMultiple(ctx context.Context, eventName string, callback func(optionalData ...interface{}), counter int)`
|
||||
|
||||
JS Signature: `EventsOnMultiple(eventName string, callback function(optionalData?: any), counter int)`
|
||||
|
||||
This method sets up a listener for the given event name, but will only trigger a maximum of `counter` times.
|
||||
|
||||
### EventsEmit
|
||||
|
||||
Go Signature: `EventsEmit(ctx context.Context, eventName string, optionalData ...interface{})`
|
||||
|
||||
JS Signature: `EventsEmit(ctx context, optionalData function(optionalData?: any))`
|
||||
|
||||
This method emits the given event. Optional data may be passed with the event. This will trigger any event listeners.
|
||||
@ -0,0 +1,47 @@
|
||||
---
|
||||
sidebar_position: 1
|
||||
---
|
||||
|
||||
# Introduction
|
||||
|
||||
The runtime is a library that provides utility methods for your application. There is both a Go and Javascript runtime
|
||||
and the aim is to try and keep them at parity where possible.
|
||||
|
||||
The Go Runtime is available through importing `github.com/wailsapp/wails/v2/pkg/runtime`. All methods in this package
|
||||
take a context as the first parameter. This context should be obtained from the [OnStartup](/docs/reference/options#onstartup)
|
||||
or [OnDomReady](/docs/reference/options#ondomready) hooks.
|
||||
|
||||
:::info Note
|
||||
|
||||
Whilst the context will be provided to the
|
||||
[OnStartup](/docs/reference/options#onstartup) method, there's no guarantee the runtime will work in this method as
|
||||
the window is initialising in a different thread. If
|
||||
you wish to call runtime methods at startup, use [OnDomReady](/docs/reference/options#ondomready).
|
||||
|
||||
:::
|
||||
|
||||
The Javascript library is available to the frontend via the `window.runtime` map. There is a runtime package generated when using `dev`
|
||||
mode that provides Typescript declarations for the runtime. This should be located in the `wailsjs` directory in your
|
||||
frontend directory.
|
||||
|
||||
### Quit
|
||||
|
||||
Go Signature: `Quit(ctx context.Context)`
|
||||
|
||||
Quits the application.
|
||||
|
||||
### Environment
|
||||
|
||||
Go Signature: `Enviromnent(ctx context.Context) EnvironmentInfo`
|
||||
|
||||
Returns details of the current environment.
|
||||
|
||||
#### EnvironmentInfo
|
||||
|
||||
```go
|
||||
type EnvironmentInfo struct {
|
||||
BuildType string // Either "production", "debug" or "dev"
|
||||
}
|
||||
```
|
||||
|
||||
|
||||
@ -0,0 +1,114 @@
|
||||
---
|
||||
sidebar_position: 3
|
||||
---
|
||||
|
||||
# Log
|
||||
|
||||
## Overview
|
||||
|
||||
The Wails runtime provides a logging mechanism that may be called from Go or Javascript. Like most
|
||||
loggers, there are a number of log levels:
|
||||
|
||||
- Trace
|
||||
- Debug
|
||||
- Info
|
||||
- Warning
|
||||
- Error
|
||||
- Fatal
|
||||
|
||||
The logger will output any log message at the current, or higher, log level. Example: The `Debug` log
|
||||
level will output all messages except `Trace` messages.
|
||||
|
||||
### LogPrint
|
||||
|
||||
Go Signature: `LogPrint(ctx context.Context, message string)`
|
||||
|
||||
JS Signature: `LogPrint(message: string)`
|
||||
|
||||
Logs the given message as a raw message.
|
||||
|
||||
### LogTrace
|
||||
|
||||
Go Signature: `LogTrace(ctx context.Context, message string)`
|
||||
|
||||
JS Signature: `LogTrace(message: string)`
|
||||
|
||||
Logs the given message at the `Trace` log level.
|
||||
|
||||
### LogDebug
|
||||
|
||||
Go Signature: `LogDebug(ctx context.Context, message string)`
|
||||
|
||||
JS Signature: `LogDebug(message: string)`
|
||||
|
||||
Logs the given message at the `Debug` log level.
|
||||
|
||||
|
||||
### LogInfo
|
||||
|
||||
Go Signature: `LogInfo(ctx context.Context, message string)`
|
||||
|
||||
JS Signature: `LogInfo(message: string)`
|
||||
|
||||
Logs the given message at the `Info` log level.
|
||||
|
||||
|
||||
### LogWarning
|
||||
|
||||
Go Signature: `LogWarning(ctx context.Context, message string)`
|
||||
|
||||
JS Signature: `LogWarning(message: string)`
|
||||
|
||||
Logs the given message at the `Warning` log level.
|
||||
|
||||
|
||||
### LogError
|
||||
|
||||
Go Signature: `LogError(ctx context.Context, message string)`
|
||||
|
||||
JS Signature: `LogError(message: string)`
|
||||
|
||||
Logs the given message at the `Error` log level.
|
||||
|
||||
|
||||
### LogFatal
|
||||
Go Signature: `LogFatal(ctx context.Context, message string)`
|
||||
|
||||
JS Signature: `LogFatal(message: string)`
|
||||
|
||||
Logs the given message at the `Fatal` log level.
|
||||
|
||||
### LogSetLogLevel
|
||||
|
||||
Go Signature: `LogSetLogLevel(ctx context.Context, level logger.LogLevel)`
|
||||
|
||||
JS Signature: `LogSetLogLevel(level: number)`
|
||||
|
||||
Sets the log level. In Javascript, the number relates to the following log levels:
|
||||
|
||||
| Value | Log Level |
|
||||
| ----- | --------- |
|
||||
| 1 | Trace |
|
||||
| 2 | Debug |
|
||||
| 3 | Info |
|
||||
| 4 | Warning |
|
||||
| 5 | Error |
|
||||
|
||||
## Using a Custom Logger
|
||||
|
||||
A custom logger may be used by providing it using the [Logger](/docs/reference/options#logger)
|
||||
application option. The only requirement is that the logger implements the `logger.Logger` interface
|
||||
defined in `github.com/wailsapp/wails/v2/pkg/logger`:
|
||||
|
||||
```go title="logger.go"
|
||||
type Logger interface {
|
||||
Print(message string)
|
||||
Trace(message string)
|
||||
Debug(message string)
|
||||
Info(message string)
|
||||
Warning(message string)
|
||||
Error(message string)
|
||||
Fatal(message string)
|
||||
}
|
||||
```
|
||||
|
||||
@ -0,0 +1,25 @@
|
||||
---
|
||||
sidebar_position: 6
|
||||
---
|
||||
|
||||
# Menu
|
||||
|
||||
## Overview
|
||||
|
||||
These methods are related to the application menu.
|
||||
|
||||
:::info Javascript
|
||||
Menu is currently unsupported in the JS runtime.
|
||||
:::
|
||||
|
||||
### MenuSetApplicationMenu
|
||||
Go Signature: `MenuSetApplicationMenu(ctx context.Context, menu *menu.Menu)`
|
||||
|
||||
Sets the application menu to the given [menu](/docs/reference/menus) .
|
||||
|
||||
### MenuUpdateApplicationMenu
|
||||
Go Signature: `MenuUpdateApplicationMenu(ctx context.Context)`
|
||||
|
||||
Updates the application menu, picking up any changes to the menu passed to `MenuSetApplicationMenu`.
|
||||
|
||||
|
||||
@ -0,0 +1,180 @@
|
||||
---
|
||||
sidebar_position: 4
|
||||
---
|
||||
|
||||
# Window
|
||||
|
||||
## Overview
|
||||
|
||||
These methods give control of the application window.
|
||||
|
||||
### WindowSetTitle
|
||||
Go Signature: `WindowSetTitle(ctx context.Context, title string)`
|
||||
|
||||
JS Signature: `WindowSetTitle(title: string)`
|
||||
|
||||
Sets the text in the window title bar.
|
||||
|
||||
### WindowFullscreen
|
||||
Go Signature: `WindowFullscreen(ctx context.Context)`
|
||||
|
||||
JS Signature: `WindowFullscreen()`
|
||||
|
||||
Makes the window full screen.
|
||||
|
||||
### WindowUnfullscreen
|
||||
Go Signature: `WindowUnfullscreen(ctx context.Context)`
|
||||
|
||||
JS Signature: `WindowUnfullscreen()`
|
||||
|
||||
Restores the previous window dimensions and position prior to full screen.
|
||||
|
||||
### WindowCenter
|
||||
Go Signature: `WindowCenter(ctx context.Context)`
|
||||
|
||||
JS Signature: `WindowCenter()`
|
||||
|
||||
Centers the window on the monitor the window is currently on.
|
||||
|
||||
### WindowReload
|
||||
Go Signature: `WindowReload(ctx context.Context)`
|
||||
|
||||
JS Signature: `WindowReload()`
|
||||
|
||||
Performs a "reload" (Reloads index.html)
|
||||
|
||||
### WindowShow
|
||||
Go Signature: `WindowShow(ctx context.Context)`
|
||||
|
||||
JS Signature: `WindowShow()`
|
||||
|
||||
Shows the window, if it is currently hidden.
|
||||
|
||||
### WindowHide
|
||||
Go Signature: `WindowHide(ctx context.Context)`
|
||||
|
||||
JS Signature: `WindowHide()`
|
||||
|
||||
Hides the window, if it is currently visible.
|
||||
|
||||
### WindowSetSize
|
||||
Go Signature: `WindowSetSize(ctx context.Context, width int, height int)`
|
||||
|
||||
JS Signature: `WindowSetSize(size: Size)`
|
||||
|
||||
Sets the width and height of the window.
|
||||
|
||||
### WindowGetSize
|
||||
Go Signature: `WindowGetSize(ctx context.Context) (width int, height int)`
|
||||
|
||||
JS Signature: `WindowGetSize() : Size`
|
||||
|
||||
Gets the width and height of the window.
|
||||
|
||||
### WindowSetMinSize
|
||||
Go Signature: `WindowSetMinSize(ctx context.Context, width int, height int)`
|
||||
|
||||
JS Signature: `WindowSetMinSize(size: Size)`
|
||||
|
||||
Sets the minimum window size.
|
||||
Will resize the window if the window is currently smaller than the given dimensions.
|
||||
|
||||
Setting a size of `0,0` will disable this constraint.
|
||||
|
||||
### WindowSetMaxSize
|
||||
Go Signature: `WindowSetMaxSize(ctx context.Context, width int, height int)`
|
||||
|
||||
JS Signature: `WindowSetMaxSize(size: Size)`
|
||||
|
||||
Sets the maximum window size.
|
||||
Will resize the window if the window is currently larger than the given dimensions.
|
||||
|
||||
Setting a size of `0,0` will disable this constraint.
|
||||
|
||||
### WindowSetPosition
|
||||
Go Signature: `WindowSetPosition(ctx context.Context, x int, y int)`
|
||||
|
||||
JS Signature: `WindowSetPosition(position: Position)`
|
||||
|
||||
Sets the window position relative to the monitor the window is currently on.
|
||||
|
||||
### WindowGetPosition
|
||||
Go Signature: `WindowGetPosition(ctx context.Context) (x int, y int)`
|
||||
|
||||
JS Signature: `WindowGetPosition() : Position`
|
||||
|
||||
Gets the window position relative to the monitor the window is currently on.
|
||||
|
||||
### WindowMaximise
|
||||
Go Signature: `WindowMaximise(ctx context.Context)`
|
||||
|
||||
JS Signature: `WindowMaximise()`
|
||||
|
||||
Maximises the window to fill the screen.
|
||||
|
||||
### WindowUnmaximise
|
||||
Go Signature: `WindowUnmaximise(ctx context.Context)`
|
||||
|
||||
JS Signature: `WindowUnmaximise()`
|
||||
|
||||
Restores the window to the dimensions and position prior to maximising.
|
||||
|
||||
### WindowToggleMaximise
|
||||
Go Signature: `WindowToggleMaximise(ctx context.Context)`
|
||||
|
||||
JS Signature: `WindowToggleMaximise()`
|
||||
|
||||
Toggles between Maximised and UnMaximised.
|
||||
|
||||
### WindowMinimise
|
||||
Go Signature: `WindowMinimise(ctx context.Context)`
|
||||
|
||||
JS Signature: `WindowMinimise()`
|
||||
|
||||
Minimises the window.
|
||||
|
||||
### WindowUnminimise
|
||||
Go Signature: `WindowUnminimise(ctx context.Context)`
|
||||
|
||||
JS Signature: `WindowUnminimise()`
|
||||
|
||||
Restores the window to the dimensions and position prior to minimising.
|
||||
|
||||
### WindowSetRGBA
|
||||
Go Signature: `WindowSetRGBA(ctx context.Context, R, G, B, A uint8)`
|
||||
|
||||
JS Signature: `WindowSetRGBA(R, G, B, A)`
|
||||
|
||||
Sets the background colour of the window to the given RGBA colour definition.
|
||||
This colour will show through for all transparent pixels.
|
||||
|
||||
Valid values for R, G, B and A are 0-255.
|
||||
|
||||
:::info Windows
|
||||
|
||||
On Windows, only alpha values of 0 or 255 are supported.
|
||||
Any value that is not 0 will be considered 255.
|
||||
|
||||
:::
|
||||
|
||||
## Typescript Object Definitions
|
||||
|
||||
### Position
|
||||
|
||||
```ts
|
||||
interface Position {
|
||||
x: number;
|
||||
y: number;
|
||||
}
|
||||
```
|
||||
|
||||
### Size
|
||||
|
||||
```ts
|
||||
interface Size {
|
||||
w: number;
|
||||
h: number;
|
||||
}
|
||||
```
|
||||
|
||||
|
||||
24
website/versioned_docs/version-v2.0.0-beta.34/stats.mdx
Normal file
24
website/versioned_docs/version-v2.0.0-beta.34/stats.mdx
Normal file
@ -0,0 +1,24 @@
|
||||
---
|
||||
sidebar_position: 100
|
||||
---
|
||||
|
||||
# Website Stats
|
||||
|
||||
To enable us to understand how better to focus our efforts on translations and platform support,
|
||||
we use [Plausible](https://plausible.io/privacy-focused-web-analytics) to gather **anonymous** stats like country and platform.
|
||||
We chose Plausible because we believe in respecting the privacy of our users.
|
||||
We also believe in transparency, therefore have made the dashboard public.
|
||||
|
||||
If you have any concerns or suggestions, please raise them in the projects github discussions.
|
||||
|
||||
<head>
|
||||
<script async src="https://plausible.io/js/embed.host.js"></script>
|
||||
</head>
|
||||
|
||||
export const NewComponent = () => (
|
||||
<div>
|
||||
<iframe plausible-embed="true" src="https://plausible.io/share/wails.io?auth=Ll6cPlScOwOi_wgwZwMBn&embed=true&theme=system" scrolling="no" frameBorder={0} loading="lazy" style={{width: '1px', minWidth: '100%', height: '1600px'}} />
|
||||
</div>
|
||||
);
|
||||
|
||||
<NewComponent/>
|
||||
@ -0,0 +1,8 @@
|
||||
{
|
||||
"tutorialSidebar": [
|
||||
{
|
||||
"type": "autogenerated",
|
||||
"dirName": "."
|
||||
}
|
||||
]
|
||||
}
|
||||
3
website/versions.json
Normal file
3
website/versions.json
Normal file
@ -0,0 +1,3 @@
|
||||
[
|
||||
"v2.0.0-beta.34"
|
||||
]
|
||||
Loading…
Reference in New Issue
Block a user