deblan-mirror/wails
1
0
Fork 0
mirror of https://github.com/wailsapp/wails.git synced 2026-03-14 14:45:49 +01:00
Code Issues Projects Releases Packages Wiki Activity

docs: sync translations (#3569)

Browse source 
Co-authored-by: leaanthony <leaanthony@users.noreply.github.com>
Co-authored-by: Lea Anthony <lea.anthony@gmail.com>
This commit is contained in:
github-actions[bot] 2025-08-12 20:58:06 +10:00 • committed by GitHub
commit 4d7b0b487c
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
312 changed files with 12688 additions and 389 deletions
Download patch file Download diff file Expand all files Collapse all files

10
website/i18n/ar/docusaurus-plugin-content-docs/current/community/showcase/grpcmd-gui.mdx Normal file
View file

@ -0,0 +1,10 @@
# grpcmd-gui
```mdx-code-block
<p style={{ "text-align": "center" }}>
<img src={require("@site/static/img/showcase/grpcmd-gui.webp").default} />
<br />
</p>
```
[grpcmd-gui](https://grpc.md/gui) is a modern cross-platform desktop app and API client for gRPC development and testing.

23
website/i18n/ar/docusaurus-plugin-content-docs/current/community/showcase/kafka-king.mdx Normal file
View file

@ -0,0 +1,23 @@
# Kafka-King
```mdx-code-block
<p style={{ "text-align": "center" }}>
<img src={require("@site/static/img/showcase/kafka-King-img_3.webp").default} />
<br />
</p>
```
[Kafka-King](https://github.com/Bronya0/Kafka-King) is a kafka GUI client that supports various systems and is compact and easy to use.
This is made of Wails+vue3
# Kafka-King function list
- [x] View the cluster node list, support dynamic configuration of broker and topic configuration items
- [x] Supports consumer clients, consumes the specified topic, size, and timeout according to the specified group, and displays the message information in various dimensions in a table
- [x] Supports PLAIN, SSL, SASL, kerberos, sasl_plaintext, etc. etc.
- [x] Create topics (support batches), delete topics, specify replicas, partitions
- [x] Support statistics of the total number of messages, total number of submissions, and backlog for each topic based on consumer groups
- [x] Support viewing topics Detailed information (offset) of the partition, and support adding additional partitions
- [x] Support simulated producers, batch sending messages, specify headers, partitions
- [x] Health check
- [x] Support viewing consumer groups , Consumer- ……

10
website/i18n/ar/docusaurus-plugin-content-docs/current/community/showcase/minesweeper-xp.mdx Normal file
View file

@ -0,0 +1,10 @@
# Minesweeper XP
```mdx-code-block
<p style={{ "text-align": "center" }}>
<img src={require("@site/static/img/showcase/minesweeper-xp.webp").default} />
<br />
</p>
```
[Minesweeper-XP](https://git.new/Minesweeper-XP) allows you to experience the classic Minesweeper XP (+ 98 and 3.1) on macOS, Windows, and Linux!

10
website/i18n/ar/docusaurus-plugin-content-docs/current/community/showcase/resizem.mdx Normal file
View file

@ -0,0 +1,10 @@
# Resizem
```mdx-code-block
<p style={{ "text-align": "center" }}>
<img src={require("@site/static/img/showcase/resizem.webp").default} />
<br />
</p>
```
[Resizem](https://github.com/barats/resizem) - is an app designed for bulk image process. It is particularly useful for users who need to resize, convert, and manage large numbers of image files at once.

10
website/i18n/ar/docusaurus-plugin-content-docs/current/community/showcase/wailsterm.mdx Normal file
View file

@ -0,0 +1,10 @@
# WailsTerm
```mdx-code-block
<p style={{ "text-align": "center" }}>
<img src={require("@site/static/img/showcase/wailsterm.webp").default} />
<br />
</p>
```
[WailsTerm](https://github.com/rlshukhov/wailsterm) is a simple translucent terminal app powered by Wails and Xterm.js.

3
website/i18n/ar/docusaurus-plugin-content-docs/current/community/templates.mdx
View file

@ -26,6 +26,7 @@ If you are unsure about a template, inspect `package.json` and `wails.json` for
- [wails-template-quasar-js](https://github.com/sgosiaco/wails-template-quasar-js) - A template using JavaScript + Quasar V2 (Vue 3, Vite, Sass, Pinia, ESLint, Prettier)
- [wails-template-quasar-ts](https://github.com/sgosiaco/wails-template-quasar-ts) - A template using TypeScript + Quasar V2 (Vue 3, Vite, Sass, Pinia, ESLint, Prettier, Composition API with &lt;script setup&gt;)
- [wails-template-naive](https://github.com/tk103331/wails-template-naive) - Wails template based on Naive UI (A Vue 3 Component Library)
- [wails-template-tdesign-js](https://github.com/tongque0/wails-template-tdesign-js) - Wails template based on TDesign UI (a Vue 3 UI library by Tencent), using Vite, Pinia, Vue Router, ESLint, and Prettier.
## Angular
@ -40,13 +41,13 @@ If you are unsure about a template, inspect `package.json` and `wails.json` for
- [wails-template-nextjs-app-router](https://github.com/thisisvk-in/wails-template-nextjs-app-router) - A template using Next.js and TypeScript with App router
- [wails-vite-react-ts-tailwind-template](https://github.com/hotafrika/wails-vite-react-ts-tailwind-template) - A template for React + TypeScript + Vite + TailwindCSS
- [wails-vite-react-ts-tailwind-shadcnui-template](https://github.com/Mahcks/wails-vite-react-tailwind-shadcnui-ts) - A template with Vite, React, TypeScript, TailwindCSS, and shadcn/ui
- [wails-nextjs-tailwind-template](https://github.com/kairo913/wails-nextjs-tailwind-template) - A template using Next.js and Typescript with TailwindCSS
## 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-ts-tailwind-template](https://github.com/xvertile/wails-vite-svelte-tailwind-template) - A template using Wails, Svelte, Vite, TypeScript, and TailwindCSS v3
- [wails-vite-svelte-tailwind-template](https://github.com/xvertile/wails-vite-svelte-tailwind-template) - A template using Svelte and Vite with TailwindCSS v3
- [wails-vite-svelte-tailwind-template](https://github.com/BillBuilt/wails-vite-svelte-tailwind-template) - A template using Svelte and Vite with TailwindCSS v3
- [wails-svelte-tailwind-vite-template](https://github.com/PylotLight/wails-vite-svelte-tailwind-template/tree/master) - An updated template using Svelte v4.2.0 and Vite with TailwindCSS v3.3.3
- [wails-sveltekit-template](https://github.com/h8gi/wails-sveltekit-template) - A template using SvelteKit

6
website/i18n/ar/docusaurus-plugin-content-docs/current/gettingstarted/installation.mdx
View file

@ -7,7 +7,7 @@ sidebar_position: 1
## Supported Platforms
- Windows 10/11 AMD64/ARM64
- MacOS 10.13+ AMD64
- MacOS 10.15+ AMD64 for development, MacOS 10.13+ for release
- MacOS 11.0+ ARM64
- Linux AMD64/ARM64
@ -15,7 +15,7 @@ sidebar_position: 1
Wails has a number of common dependencies that are required before installation:
- Go 1.20+
- Go 1.21+ (macOS 15+ requires Go 1.23.3+)
- NPM (Node 15+)
### Go
@ -58,6 +58,8 @@ import TabItem from "@theme/TabItem";
</TabItem>
<TabItem value={"Linux"}>
Linux requires 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.
<br/><strong>Note:</strong><br/>
If you are using latest Linux version (example: Ubuntu 24.04) and it is not supporting <code>libwebkit2gtk-4.0-dev</code>, then you might encounter an issue in <code>wails doctor</code>: <code>libwebkit</code> not found. To resolve this issue you can install <code>libwebkit2gtk-4.1-dev</code> and during your build use the tag <code>-tags webkit2_41</code>.
</TabItem>
</Tabs>
```

2
website/i18n/ar/docusaurus-plugin-content-docs/current/guides/application-development.mdx
View file

@ -235,7 +235,7 @@ If these 2 keys aren't given, then Wails does absolutely nothing with the fronte
### AssetsHandler
A Wails v2 app can optionally define a `http.Handler` in the `options.App`, which allows hooking into the AssetServer to create files on the fly or process POST/PUT requests. GET requests are always first handled by the `assets` FS. If the FS doesn't find the requested file the request will be forwarded to the `http.Handler` for serving. Any requests other than GET will be directly processed by the `AssetsHandler` if specified. It's also possible to only use the `AssetsHandler` by specifiy `nil` as the `Assets` option.
A Wails v2 app can optionally define a `http.Handler` in the `options.App`, which allows hooking into the AssetServer to create files on the fly or process POST/PUT requests. GET requests are always first handled by the `assets` FS. If the FS doesn't find the requested file the request will be forwarded to the `http.Handler` for serving. Any requests other than GET will be directly processed by the `AssetsHandler` if specified. It's also possible to only use the `AssetsHandler` by specifying `nil` as the `Assets` option.
## Built in Dev Server

2
website/i18n/ar/docusaurus-plugin-content-docs/current/guides/crossplatform-build.mdx
View file

@ -61,6 +61,6 @@ This example offers opportunities for various enhancements, including:
- Caching dependencies
- Code signing
- Uploading to platforms like S3, Supbase, etc.
- Uploading to platforms like S3, Supabase, etc.
- Injecting secrets as environment variables
- Utilizing environment variables as build variables (such as version variable extracted from the current Git tag)

2
website/i18n/ar/docusaurus-plugin-content-docs/current/guides/frontend.mdx
View file

@ -44,7 +44,7 @@ The options are as follows:
| noautoinjectipc | Disable the autoinjection of `/wails/ipc.js` |
| noautoinject | Disable all autoinjection of scripts |
Multiple options may be used provided they are comma seperated.
Multiple options may be used provided they are comma separated.
This code is perfectly valid and operates the same as the autoinjection version:

6
website/i18n/ar/docusaurus-plugin-content-docs/current/guides/mac-appstore.mdx
View file

@ -61,7 +61,7 @@ This is an example entitlements file from the [RiftShare](https://github.com/ach
</plist>
```
**Add the Embedded Provisioning Profile** The Provisioning Profile created above needs to be added to the root of the applicaton. It needs to be named embedded.provisionprofile.
**Add the Embedded Provisioning Profile** The Provisioning Profile created above needs to be added to the root of the application. It needs to be named embedded.provisionprofile.
#### Build and Sign the App Package
@ -80,9 +80,9 @@ wails build -platform darwin/universal -clean
cp ./embedded.provisionprofile "./build/bin/$APP_NAME.app/Contents"
codesign --timestamp --options=runtime -s "$APP_CERTIFICATE" -v --entitlements ./build/darwin/entitlements.plist ./build/bin/$APP_NAME.app
codesign --timestamp --options=runtime -s "$APP_CERTIFICATE" -v --entitlements ./build/darwin/entitlements.plist "./build/bin/$APP_NAME.app"
productbuild --sign "$PKG_CERTIFICATE" --component ./build/bin/$APP_NAME.app /Applications ./$APP_NAME.pkg
productbuild --sign "$PKG_CERTIFICATE" --component "./build/bin/$APP_NAME.app" /Applications "./$APP_NAME.pkg"
```
#### Upload App Bundle

2
website/i18n/ar/docusaurus-plugin-content-docs/current/guides/nixos-font.mdx
View file

@ -1,6 +1,6 @@
# NixOS FontSize Bug
NixOS/Wayland can cause a bug where the `font-size` css property doesnt affect the rendered page. To fix this add the following to your devShell.
NixOS/Wayland can cause a bug where the `font-size` css property doesn't affect the rendered page. To fix this add the following to your devShell.
```shell
shellHook = with pkgs; ''

6
website/i18n/ar/docusaurus-plugin-content-docs/current/guides/signing.mdx
View file

@ -232,7 +232,7 @@ Now we need to configure some gon config files in our `build/darwin` directory:
"bundle_id": "app.myapp",
"apple_id": {
"username": "my-appleid@email.com",
"password": "@env:APPLE_PASSWORD",
"password": "your-app-specific-password",
"provider": "ABCDE12345"
},
"sign": {
@ -246,11 +246,13 @@ Here is a brief break down of the above fields:
- `source`: The location of your wails binary to be signed
- `apple_id`:
- `username`: Your Apple ID email address
- `password`: Your app-specific password, referenced using Gon's environment variable syntax
- `password`: Your app-specific password
- `provider`: Your team ID for your App Store Connect account
- `sign`:
- `application_identity`: Your Apple developer identity
The (https://developer.apple.com/documentation/technotes/tn3147-migrating-to-the-latest-notarization-tool)[deprecated Apple's altool]'s syntax supporting `@env:` is no longer available since Apple has migrated to the new notarytool.
Your developer identity and team ID can both by found on macOS by running the following command:
```bash

8
website/i18n/ar/docusaurus-plugin-content-docs/current/guides/sveltekit.mdx
View file

@ -2,7 +2,7 @@
This guide will go into:
1. Miminal Installation Steps - The steps needed to get a minimum Wails setup working for SvelteKit.
1. Minimal Installation Steps - The steps needed to get a minimum Wails setup working for SvelteKit.
2. Install Script - Bash script for accomplishing the Minimal Installation Steps with optional Wails branding.
3. Important Notes - Issues that can be encountered when using SvelteKit + Wails and fixes.
@ -17,9 +17,9 @@ This guide will go into:
- Navigate into your newly created myapp folder.
- Delete the folder named "frontend"
##### While in the Wails project root. Use your favorite package manager and install SvelteKit as the new frontend. Follow the prompts.
##### While in the Wails project root. Use the Svelte CLI to create a SvelteKit project as the new frontend. Follow the prompts, nothing Wails specific is needed here.
- `npm create svelte@latest frontend`
- `npx sv create frontend`
##### Modify wails.json.
@ -124,7 +124,7 @@ wails dev
See https://wails.io/docs/guides/frontend for more information.
##### Inital data can be loaded and refreshed from +page.ts/+page.js to +page.svelte.
##### Initial data can be loaded and refreshed from +page.ts/+page.js to +page.svelte.
- \+page.ts/+page.js works well with load() https://kit.svelte.dev/docs/load#page-data
- invalidateAll() in +page.svelte will call load() from +page.ts/+page.js https://kit.svelte.dev/docs/load#rerunning-load-functions-manual-invalidation.

8
website/i18n/ar/docusaurus-plugin-content-docs/current/reference/cli.mdx
View file

@ -66,7 +66,7 @@ If you are unsure about a template, inspect `package.json` and `wails.json` for
| -nsis | Generate NSIS installer for Windows | |
| -o filename | Output filename | |
| -obfuscated | Obfuscate the application using [garble](https://github.com/burrowers/garble) | |
| -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. | platform = `GOOS` environment variable if given else `runtime.GOOS`.<br/>arch = `GOARCH` envrionment variable if given else `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. | platform = `GOOS` environment variable if given else `runtime.GOOS`.<br/>arch = `GOARCH` environment variable if given else `runtime.GOARCH`. |
| -race | Build with Go's race detector | |
| -s | Skip building the frontend | |
| -skipbindings | Skip bindings generation | |
@ -99,6 +99,12 @@ There are [issues](https://github.com/upx/upx/issues/446) with using UPX with Ap
:::
:::info Set minimal version for MacOS
You can override default [minimal version](../gettingstarted/installation#supported-platforms) of macOS for your app by providing version via `CGO_CFLAGS` and `CGO_LDFLAGS` environment variables. e.g. `CGO_CFLAGS=-mmacosx-version-min=10.15.0 CGO_LDFLAGS=-mmacosx-version-min=10.15.0 wails build`
:::
:::info UPX on Windows
Some Antivirus vendors false positively mark `upx` compressed binaries as virus, see [issue](https://github.com/upx/upx/issues/437).

12
website/i18n/ar/docusaurus-plugin-content-docs/current/reference/menus.mdx
View file

@ -13,15 +13,21 @@ An example of how to create a menu:
app := NewApp()
AppMenu := menu.NewMenu()
if runtime.GOOS == "darwin" {
AppMenu.Append(menu.AppMenu()) // On macOS platform, this must be done right after `NewMenu()`
}
FileMenu := AppMenu.AddSubmenu("File")
FileMenu.AddText("&Open", keys.CmdOrCtrl("o"), openFile)
FileMenu.AddText("&Open", keys.CmdOrCtrl("o"), func(_ *menu.CallbackData) {
// do something
})
FileMenu.AddSeparator()
FileMenu.AddText("Quit", keys.CmdOrCtrl("q"), func(_ *menu.CallbackData) {
runtime.Quit(app.ctx)
// `rt` is an alias of "github.com/wailsapp/wails/v2/pkg/runtime" to prevent collision with standard package
rt.Quit(app.ctx)
})
if runtime.GOOS == "darwin" {
AppMenu.Append(menu.EditMenu()) // on macos platform, we should append EditMenu to enable Cmd+C,Cmd+V,Cmd+Z... shortcut
AppMenu.Append(menu.EditMenu()) // On macOS platform, EditMenu should be appended to enable Cmd+C, Cmd+V, Cmd+Z... shortcuts
}
err := wails.Run(&options.App{

10
website/i18n/ar/docusaurus-plugin-content-docs/current/reference/options.mdx
View file

@ -98,7 +98,9 @@ func main() {
// OnResume is called when Windows resumes from low power mode
OnResume: func(),
// Disable GPU hardware acceleration for the webview
WebviewGpuDisabled: false,
WebviewGpuDisabled: false,
// Class name for the window. If empty, 'wailsWindow' will be used.
WindowClassName: "MyWindow",
},
Mac: &mac.Options{
TitleBar: &mac.TitleBar{
@ -690,6 +692,12 @@ Setting this to `true` will enable swipe gestures for the webview.
Name: EnableSwipeGestures<br/> Type: `bool`
#### WindowClassName
Class name for the window. If empty, 'wailsWindow' will be used.
Name: WindowClassName<br/> Type: `string`
### Mac
This defines [Mac specific options](#mac).

2
website/i18n/ar/docusaurus-plugin-content-docs/current/reference/runtime/events.mdx
View file

@ -14,7 +14,7 @@ Go: `EventsOn(ctx context.Context, eventName string, callback func(optionalData
### EventsOff
This method unregisters the listener for the given event name, optionally multiple listeneres can be unregistered via `additionalEventNames`.
This method unregisters the listener for the given event name, optionally multiple listeners can be unregistered via `additionalEventNames`.
Go: `EventsOff(ctx context.Context, eventName string, additionalEventNames ...string)`<br/> JS: `EventsOff(eventName string, ...additionalEventNames)`

2
website/i18n/ar/docusaurus-plugin-content-docs/current/reference/runtime/window.mdx
View file

@ -202,7 +202,7 @@ Go: `WindowSetBackgroundColour(ctx context.Context, R, G, B, A uint8)`<br/> JS:
### WindowPrint
Opens tha native print dialog.
Opens the native print dialog.
Go: `WindowPrint(ctx context.Context)`<br/> JS: `WindowPrint()`

38
website/i18n/ar/docusaurus-plugin-content-docs/version-v2.10.json Normal file
View file

@ -0,0 +1,38 @@
{
"version.label": {
"message": "v2.10",
"description": "The label for version v2.10"
},
"sidebar.docs.category.Getting Started": {
"message": "Getting Started",
"description": "The label for category Getting Started in sidebar docs"
},
"sidebar.docs.category.Reference": {
"message": "Reference",
"description": "The label for category Reference in sidebar docs"
},
"sidebar.docs.category.Runtime": {
"message": "Runtime",
"description": "The label for category Runtime in sidebar docs"
},
"sidebar.docs.category.Community": {
"message": "Community",
"description": "The label for category Community in sidebar docs"
},
"sidebar.docs.category.Showcase": {
"message": "Showcase",
"description": "The label for category Showcase in sidebar docs"
},
"sidebar.docs.category.Guides": {
"message": "Guides",
"description": "The label for category Guides in sidebar docs"
},
"sidebar.docs.category.Tutorials": {
"message": "Tutorials",
"description": "The label for category Tutorials in sidebar docs"
},
"sidebar.docs.link.Contributing": {
"message": "Contributing",
"description": "The label for link Contributing in sidebar docs, linking to /community-guide#ways-of-contributing"
}
}

73
website/i18n/ar/docusaurus-plugin-content-pages/changelog.mdx
View file

@ -13,6 +13,79 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
## [Unreleased]
### Changed
- Updated recommendation for Svelte router in [#4085](https://github.com/wailsapp/wails/pull/4085) by [@benmccann](https://github.com/benmccann)
### Added
- Added "Branding" section to `wails doctor` to correctly identify Windows 11 [#3891](https://github.com/wailsapp/wails/pull/3891) by [@ronen25](https://github.com/ronen25)
## v2.10.1 - 2025-02-24
### Fixed
- Fixed [listenerOff issue](https://github.com/wailsapp/wails/issues/3850) by @leaanthony.
- Fixed issues building with `darwin/universal` target by @leaanthony.
## v2.10 - 2025-02-15
### Added
- Added option to set window class name on Windows. Added in [PR](https://github.com/wailsapp/wails/pull/3828) by @APshenkin
### Fixed
- Fixed dev mode logging bug by @attperac in [#3972](https://wailsapp/wails/pull/3972)
- Fixed `reloaddirs` wails.json config options by @atterpac in [#4005](https//github.com/wailsapp/wails/pull/4005)
- Fixed cross compilation failed with CGO [PR](https://github.com/wailsapp/wails/pull/3795) by [@fcying](https://github.com/fcying)
- Using go-webview2 v0.1.17 to fix native webview2loader issue, by @leaanthony
- Fixed example for macOS menu by @takuyahara in [PR](https://github.com/wailsapp/wails/pull/3847)
- Fixed typo by @takuyahara in [PR](https://github.com/wailsapp/wails/pull/3846)
- Fixed incorrect TS definition of `WindowSetSize` by @leaanthony
- Ensure showHiddenFiles works with directory dialog by @leaanthony in [PR](https://github.com/wailsapp/wails/pull/3904)
- chore: fix some comments in [PR](https://github.com/wailsapp/wails/pull/3932) by @lvyaoting
- [windows] Fixed frameless window flickering when minimizing/restoring by preventing unnecessary redraws [#3951](https://github.com/wailsapp/wails/issues/3951)
- Fixed failed models.ts build due to non-json-encodable Go types [PR](https://github.com/wailsapp/wails/pull/3975) by [@pbnjay](https://github.com/pbnjay)
- Fixed more binding and typescript export bugs [PR](https://github.com/wailsapp/wails/pull/3978) by [@pbnjay](https://github.com/pbnjay)
- Fixed Dispatcher.ProcessMessage crash process instead of return error [PR](https://github.com/wailsapp/wails/pull/4016) [#4015](https://github.com/wailsapp/wails/issues/4015) by [@ronaldinho_x86](https://github.com/RonaldinhoL)
- Fixed Windows SaveDialog crash by [@leaanthony](https://github.com/leaanthony)
- Fixed `buildvcs` errors by [@leaanthony](https://github.com/leaanthony)
- Fixed updating menus on MacOS by [@stffabi](https://github.com/stffabi)
- Fixed a build error on macOS that occurred when the `outputfilename` and `name` fields in wails.json were different. Fixed in [PR](https://github.com/wailsapp/wails/pull/3789) by [@nickisworking](https://github.com/nickisworking)
### Changed
- Removed documentation references for 'The default module name in go.mod is "changeme". You should change this to something more appropriate.' as it appears to be no longer relevant.
- Update script in Mac App Store guide to support app names containing spaces by @cristianrgreco
- Allow to specify macos-min-version externally. Implemented by @APshenkin in [PR](https://github.com/wailsapp/wails/pull/3756)
- Updated installation docs for latest linux os version and libwebkit issue [PR](https://github.com/wailsapp/wails/pull/3806) by [@pratikmota](https://github.com/pratikmota)
## v2.9.3 - 2025-02-13
### Added
- Go 1.24 support by [@leaanthony](https://github.com/leaanthony)
### Fixed
- Now using `-buildvcs=false` build tag by default to remove `error obtaining VCS status: exit status 128` errors by [@leaanthony](https://github.com/leaanthony)
## v2.9.2 - 2024-09-18
### Fixed
- Fixed CGO memory issue on Darwin by @leaanthony in [PR](https://github.com/wailsapp/wails/pull/3590)
- Fixed an error that occurred when an author name contains a string that is not suitable for JSON. Fixed by @taiseiotsuka in [PR](https://github.com/wailsapp/wails/pull/3638)
- Fixed MacOS build to use `outputfilename` from wails.json. [#3200](https://github.com/wailsapp/wails/issues/3200)
- Fixed file drop events on windows. Fixed in [PR](https://github.com/wailsapp/wails/pull/3595) by @FrancescoLuzzi
- Fixed doctor command not finding pkg-config on Solus. [PR #3670](https://github.com/wailsapp/wails/pull/3670) by [@ianmjones](https://github.com/ianmjones)
- Fixed binding for struct fields that were exported but had no json tags. [PR #3678](https://github.com/wailsapp/wails/pull/3678)
- Fixed file drop events on Windows in [PR](https://github.com/wailsapp/wails/pull/3595) by @FrancescoLuzzi
- Modified `ZoomFactor` and `IsZoomControlEnabled` options to be Windows-only options in PR[#3644](https://github.com/wailsapp/wails/pull/3644) by @levinit
- Added nil check for Drag-n-Drop on Windows. Fixed by in [PR](https://github.com/wailsapp/wails/pull/3597) by @leaanthony based on the suggestion by @Alpa-1 in [#3596](https://github.com/wailsapp/wails/issues/3596).
- Fixed typos in various .mdx files. [PR #3628](https://github.com/wailsapp/wails/pull/3628) by [@deining](https://github.com/deining)
- Fixed `notifyListeners()` race condition when terminated mid-emission [PR](https://github.com/wailsapp/wails/pull/3695) by [@mrf345](https://github.com/mrf345)
- Fixed dialogs in Windows when using Go 1.23 in [PR](https://github.com/wailsapp/wails/pull/3707) by [@leaanthony](https://github.com/leaanthony)
- More syscall fixes for Go 1.23 support in [PR](https://github.com/wailsapp/wails/pull/3713) by [@leaanthony](https://github.com/leaanthony)
- Fixed drag and drop missing cursor icon [PR](https://github.com/wailsapp/wails/pull/3703) by [@mrf345](https://github.com/mrf345)
### Changed
- Modified docs to reflect the correct password syntax for the `gon-sign.json` file [PR](https://github.com/wailsapp/wails/pull/3620) by [@ignasbernotas](github.com/ignasbernotas)
## v2.9.1 - 2024-06-18
### Fixed

3
website/i18n/ar/docusaurus-plugin-content-pages/credits.mdx
View file

@ -6,6 +6,7 @@
- [Atterpac](https://github.com/atterpac) - Developer, support guru, powerhouse
- [Simon Thomas](mailto:enquiries@wails.io) - Growth Hacker
- [Lyimmi](https://github.com/Lyimmi) - All things Linux
- [fbbdev](https://github.com/fbbdev) - Bindings Generator guru & core contributor
## Sponsors
<img src="/img/sponsors.svg" style={{"width":"85%","max-width":"800px;"}} />
@ -38,7 +39,7 @@
</tr>
<tr>
<td align="center" valign="top" width="12.5%"><a href="https://github.com/k-muchmore"><img src="https://avatars.githubusercontent.com/u/16393095?v=4?s=75" width="75px;" alt="k-muchmore"/><br /><sub><b>k-muchmore</b></sub></a><br /><a href="https://github.com/wailsapp/wails/commits?author=k-muchmore" title="Code">💻</a></td>
<td align="center" valign="top" width="12.5%"><a href="https://peakd.com/@snider"><img src="https://avatars.githubusercontent.com/u/631881?v=4?s=75" width="75px;" alt="Snider"/><br /><sub><b>Snider</b></sub></a><br /><a href="https://github.com/wailsapp/wails/commits?author=Snider" title="Code">💻</a> <a href="#ideas-Snider" title="Ideas, Planning, & Feedback">🤔</a> <a href="https://github.com/wailsapp/wails/commits?author=Snider" title="Documentation">📖</a> <a href="#financial-Snider" title="Financial">💵</a></td>
<td align="center" valign="top" width="12.5%"><a href="https://github.com/Snider"><img src="https://avatars.githubusercontent.com/u/631881?v=4?s=75" width="75px;" alt="Snider"/><br /><sub><b>Snider</b></sub></a><br /><a href="https://github.com/wailsapp/wails/commits?author=Snider" title="Code">💻</a> <a href="#ideas-Snider" title="Ideas, Planning, & Feedback">🤔</a> <a href="https://github.com/wailsapp/wails/commits?author=Snider" title="Documentation">📖</a> <a href="#financial-Snider" title="Financial">💵</a><a href="https://github.com/dappServer/wails-build-action" title="Tools">🔧</a></td>
<td align="center" valign="top" width="12.5%"><a href="https://github.com/albert-sun"><img src="https://avatars.githubusercontent.com/u/54585592?v=4?s=75" width="75px;" alt="Albert Sun"/><br /><sub><b>Albert Sun</b></sub></a><br /><a href="https://github.com/wailsapp/wails/commits?author=albert-sun" title="Code">💻</a> <a href="https://github.com/wailsapp/wails/commits?author=albert-sun" title="Tests">⚠️</a></td>
<td align="center" valign="top" width="12.5%"><a href="https://github.com/adalessa"><img src="https://avatars.githubusercontent.com/u/7914601?v=4?s=75" width="75px;" alt="Ariel"/><br /><sub><b>Ariel</b></sub></a><br /><a href="https://github.com/wailsapp/wails/commits?author=adalessa" title="Code">💻</a> <a href="https://github.com/wailsapp/wails/issues?q=author%3Aadalessa" title="Bug reports">🐛</a></td>
<td align="center" valign="top" width="12.5%"><a href="https://triplebits.com/"><img src="https://avatars.githubusercontent.com/u/4365245?v=4?s=75" width="75px;" alt="Ilgıt Yıldırım"/><br /><sub><b>Ilgıt Yıldırım</b></sub></a><br /><a href="https://github.com/wailsapp/wails/commits?author=ilgityildirim" title="Code">💻</a> <a href="https://github.com/wailsapp/wails/issues?q=author%3Ailgityildirim" title="Bug reports">🐛</a> <a href="#financial-ilgityildirim" title="Financial">💵</a></td>

431
website/i18n/de/code.json Normal file
View file

@ -0,0 +1,431 @@
{
"homepage.Features.Title1": {
"message": "Feature Rich"
},
"homepage.Features.Description1": {
"message": "Build comprehensive cross-platform applications using native UI elements such as menus and dialogs."
},
"homepage.Features.Title2": {
"message": "Familiar"
},
"homepage.Features.Description2": {
"message": "Use the technologies you already know to build amazing applications."
},
"homepage.Features.Title3": {
"message": "Fast"
},
"homepage.Features.Description3": {
"message": "Quickly generate, build and package your projects using the Wails CLI."
},
"homepage.Tagline": {
"message": "Build beautiful cross-platform applications using Go"
},
"homepage.ButtonText": {
"message": "Get Started"
},
"homepage.LearnMoreButtonText": {
"message": "Learn More"
},
"theme.ErrorPageContent.title": {
"message": "This page crashed.",
"description": "The title of the fallback page when the page crashed"
},
"theme.ErrorPageContent.tryAgain": {
"message": "Try again",
"description": "The label of the button to try again rendering when the React error boundary captures an error"
},
"theme.NotFound.title": {
"message": "Page Not Found",
"description": "The title of the 404 page"
},
"theme.NotFound.p1": {
"message": "We could not find what you were looking for.",
"description": "The first paragraph of the 404 page"
},
"theme.NotFound.p2": {
"message": "Please contact the owner of the site that linked you to the original URL and let them know their link is broken.",
"description": "The 2nd paragraph of the 404 page"
},
"theme.AnnouncementBar.closeButtonAriaLabel": {
"message": "Close",
"description": "The ARIA label for close button of announcement bar"
},
"theme.blog.archive.title": {
"message": "Archive",
"description": "The page & hero title of the blog archive page"
},
"theme.blog.archive.description": {
"message": "Archive",
"description": "The page & hero description of the blog archive page"
},
"theme.BackToTopButton.buttonAriaLabel": {
"message": "Scroll back to top",
"description": "The ARIA label for the back to top button"
},
"theme.blog.paginator.navAriaLabel": {
"message": "Blog list page navigation",
"description": "The ARIA label for the blog pagination"
},
"theme.blog.paginator.newerEntries": {
"message": "Newer Entries",
"description": "The label used to navigate to the newer blog posts page (previous page)"
},
"theme.blog.paginator.olderEntries": {
"message": "Older Entries",
"description": "The label used to navigate to the older blog posts page (next page)"
},
"theme.blog.post.readingTime.plurals": {
"message": "One min read|{readingTime} min read",
"description": "Pluralized label for \"{readingTime} min read\". Use as much plural forms (separated by \"|\") as your language support (see https://www.unicode.org/cldr/cldr-aux/charts/34/supplemental/language_plural_rules.html)"
},
"theme.blog.post.readMoreLabel": {
"message": "Read more about {title}",
"description": "The ARIA label for the link to full blog posts from excerpts"
},
"theme.blog.post.readMore": {
"message": "Read More",
"description": "The label used in blog post item excerpts to link to full blog posts"
},
"theme.blog.post.paginator.navAriaLabel": {
"message": "Blog post page navigation",
"description": "The ARIA label for the blog posts pagination"
},
"theme.blog.post.paginator.newerPost": {
"message": "Newer Post",
"description": "The blog post button label to navigate to the newer/previous post"
},
"theme.blog.post.paginator.olderPost": {
"message": "Older Post",
"description": "The blog post button label to navigate to the older/next post"
},
"theme.blog.sidebar.navAriaLabel": {
"message": "Blog recent posts navigation",
"description": "The ARIA label for recent posts in the blog sidebar"
},
"theme.blog.post.plurals": {
"message": "One post|{count} posts",
"description": "Pluralized label for \"{count} posts\". Use as much plural forms (separated by \"|\") as your language support (see https://www.unicode.org/cldr/cldr-aux/charts/34/supplemental/language_plural_rules.html)"
},
"theme.blog.tagTitle": {
"message": "{nPosts} tagged with \"{tagName}\"",
"description": "The title of the page for a blog tag"
},
"theme.tags.tagsPageLink": {
"message": "View All Tags",
"description": "The label of the link targeting the tag list page"
},
"theme.CodeBlock.copyButtonAriaLabel": {
"message": "Copy code to clipboard",
"description": "The ARIA label for copy code blocks button"
},
"theme.CodeBlock.copied": {
"message": "Copied",
"description": "The copied button label on code blocks"
},
"theme.CodeBlock.copy": {
"message": "Copy",
"description": "The copy button label on code blocks"
},
"theme.colorToggle.ariaLabel": {
"message": "Switch between dark and light mode (currently {mode})",
"description": "The ARIA label for the navbar color mode toggle"
},
"theme.colorToggle.ariaLabel.mode.dark": {
"message": "dark mode",
"description": "The name for the dark color mode"
},
"theme.colorToggle.ariaLabel.mode.light": {
"message": "light mode",
"description": "The name for the light color mode"
},
"theme.docs.DocCard.categoryDescription": {
"message": "{count} items",
"description": "The default description for a category card in the generated index about how many items this category includes"
},
"theme.docs.sidebar.expandButtonTitle": {
"message": "Expand sidebar",
"description": "The ARIA label and title attribute for expand button of doc sidebar"
},
"theme.docs.sidebar.expandButtonAriaLabel": {
"message": "Expand sidebar",
"description": "The ARIA label and title attribute for expand button of doc sidebar"
},
"theme.docs.paginator.navAriaLabel": {
"message": "Docs pages navigation",
"description": "The ARIA label for the docs pagination"
},
"theme.docs.paginator.previous": {
"message": "Previous",
"description": "The label used to navigate to the previous doc"
},
"theme.docs.paginator.next": {
"message": "Next",
"description": "The label used to navigate to the next doc"
},
"theme.docs.sidebar.collapseButtonTitle": {
"message": "Collapse sidebar",
"description": "The title attribute for collapse button of doc sidebar"
},
"theme.docs.sidebar.collapseButtonAriaLabel": {
"message": "Collapse sidebar",
"description": "The title attribute for collapse button of doc sidebar"
},
"theme.DocSidebarItem.toggleCollapsedCategoryAriaLabel": {
"message": "Toggle the collapsible sidebar category '{label}'",
"description": "The ARIA label to toggle the collapsible sidebar category"
},
"theme.docs.tagDocListPageTitle.nDocsTagged": {
"message": "One doc tagged|{count} docs tagged",
"description": "Pluralized label for \"{count} docs tagged\". Use as much plural forms (separated by \"|\") as your language support (see https://www.unicode.org/cldr/cldr-aux/charts/34/supplemental/language_plural_rules.html)"
},
"theme.docs.tagDocListPageTitle": {
"message": "{nDocsTagged} with \"{tagName}\"",
"description": "The title of the page for a docs tag"
},
"theme.docs.versionBadge.label": {
"message": "Version: {versionLabel}"
},
"theme.docs.versions.unreleasedVersionLabel": {
"message": "This is unreleased documentation for {siteTitle} {versionLabel} version.",
"description": "The label used to tell the user that he's browsing an unreleased doc version"
},
"theme.docs.versions.unmaintainedVersionLabel": {
"message": "This is documentation for {siteTitle} {versionLabel}, which is no longer actively maintained.",
"description": "The label used to tell the user that he's browsing an unmaintained doc version"
},
"theme.docs.versions.latestVersionSuggestionLabel": {
"message": "For up-to-date documentation, see the {latestVersionLink} ({versionLabel}).",
"description": "The label used to tell the user to check the latest version"
},
"theme.docs.versions.latestVersionLinkLabel": {
"message": "latest version",
"description": "The label used for the latest version suggestion link label"
},
"theme.common.editThisPage": {
"message": "Edit this page",
"description": "The link label to edit the current page"
},
"theme.common.headingLinkTitle": {
"message": "Direct link to heading",
"description": "Title for link to heading"
},
"theme.lastUpdated.atDate": {
"message": " on {date}",
"description": "The words used to describe on which date a page has been last updated"
},
"theme.lastUpdated.byUser": {
"message": " by {user}",
"description": "The words used to describe by who the page has been last updated"
},
"theme.lastUpdated.lastUpdatedAtBy": {
"message": "Last updated{atDate}{byUser}",
"description": "The sentence used to display when a page has been last updated, and by who"
},
"theme.navbar.mobileSidebarSecondaryMenu.backButtonLabel": {
"message": "← Back to main menu",
"description": "The label of the back button to return to main menu, inside the mobile navbar sidebar secondary menu (notably used to display the docs sidebar)"
},
"theme.navbar.mobileVersionsDropdown.label": {
"message": "Versions",
"description": "The label for the navbar versions dropdown on mobile view"
},
"theme.common.skipToMainContent": {
"message": "Skip to main content",
"description": "The skip to content label used for accessibility, allowing to rapidly navigate to main content with keyboard tab/enter navigation"
},
"theme.tags.tagsListLabel": {
"message": "Tags:",
"description": "The label alongside a tag list"
},
"theme.TOCCollapsible.toggleButtonLabel": {
"message": "On this page",
"description": "The label used by the button on the collapsible TOC component"
},
"theme.navbar.mobileLanguageDropdown.label": {
"message": "Languages",
"description": "The label for the mobile language switcher dropdown"
},
"theme.SearchBar.seeAll": {
"message": "See all {count} results"
},
"theme.SearchBar.label": {
"message": "Search",
"description": "The ARIA label and placeholder for search button"
},
"theme.SearchPage.documentsFound.plurals": {
"message": "One document found|{count} documents found",
"description": "Pluralized label for \"{count} documents found\". Use as much plural forms (separated by \"|\") as your language support (see https://www.unicode.org/cldr/cldr-aux/charts/34/supplemental/language_plural_rules.html)"
},
"theme.SearchPage.existingResultsTitle": {
"message": "Search results for \"{query}\"",
"description": "The search page title for non-empty query"
},
"theme.SearchPage.emptyResultsTitle": {
"message": "Search the documentation",
"description": "The search page title for empty query"
},
"theme.SearchPage.inputPlaceholder": {
"message": "Type your search here",
"description": "The placeholder for search page input"
},
"theme.SearchPage.inputLabel": {
"message": "Search",
"description": "The ARIA label for search page input"
},
"theme.SearchPage.algoliaLabel": {
"message": "Search by Algolia",
"description": "The ARIA label for Algolia mention"
},
"theme.SearchPage.noResultsText": {
"message": "No results were found",
"description": "The paragraph for empty search result"
},
"theme.SearchPage.fetchingNewResults": {
"message": "Fetching new results...",
"description": "The paragraph for fetching new search results"
},
"theme.tags.tagsPageTitle": {
"message": "Tags",
"description": "The title of the tag list page"
},
"theme.docs.breadcrumbs.home": {
"message": "Home page",
"description": "The ARIA label for the home page in the breadcrumbs"
},
"theme.docs.breadcrumbs.navAriaLabel": {
"message": "Breadcrumbs",
"description": "The ARIA label for the breadcrumbs"
},
"theme.CodeBlock.wordWrapToggle": {
"message": "Toggle word wrap",
"description": "The title attribute for toggle word wrapping button of code block lines"
},
"theme.admonition.note": {
"message": "note",
"description": "The default label used for the Note admonition (:::note)"
},
"theme.admonition.tip": {
"message": "tip",
"description": "The default label used for the Tip admonition (:::tip)"
},
"theme.admonition.danger": {
"message": "danger",
"description": "The default label used for the Danger admonition (:::danger)"
},
"theme.admonition.info": {
"message": "info",
"description": "The default label used for the Info admonition (:::info)"
},
"theme.admonition.caution": {
"message": "caution",
"description": "The default label used for the Caution admonition (:::caution)"
},
"theme.SearchModal.searchBox.resetButtonTitle": {
"message": "Clear the query",
"description": "The label and ARIA label for search box reset button"
},
"theme.SearchModal.searchBox.cancelButtonText": {
"message": "Cancel",
"description": "The label and ARIA label for search box cancel button"
},
"theme.SearchModal.startScreen.recentSearchesTitle": {
"message": "Recent",
"description": "The title for recent searches"
},
"theme.SearchModal.startScreen.noRecentSearchesText": {
"message": "No recent searches",
"description": "The text when no recent searches"
},
"theme.SearchModal.startScreen.saveRecentSearchButtonTitle": {
"message": "Save this search",
"description": "The label for save recent search button"
},
"theme.SearchModal.startScreen.removeRecentSearchButtonTitle": {
"message": "Remove this search from history",
"description": "The label for remove recent search button"
},
"theme.SearchModal.startScreen.favoriteSearchesTitle": {
"message": "Favorite",
"description": "The title for favorite searches"
},
"theme.SearchModal.startScreen.removeFavoriteSearchButtonTitle": {
"message": "Remove this search from favorites",
"description": "The label for remove favorite search button"
},
"theme.SearchModal.errorScreen.titleText": {
"message": "Unable to fetch results",
"description": "The title for error screen of search modal"
},
"theme.SearchModal.errorScreen.helpText": {
"message": "You might want to check your network connection.",
"description": "The help text for error screen of search modal"
},
"theme.SearchModal.footer.selectText": {
"message": "to select",
"description": "The explanatory text of the action for the enter key"
},
"theme.SearchModal.footer.selectKeyAriaLabel": {
"message": "Enter key",
"description": "The ARIA label for the Enter key button that makes the selection"
},
"theme.SearchModal.footer.navigateText": {
"message": "to navigate",
"description": "The explanatory text of the action for the Arrow up and Arrow down key"
},
"theme.SearchModal.footer.navigateUpKeyAriaLabel": {
"message": "Arrow up",
"description": "The ARIA label for the Arrow up key button that makes the navigation"
},
"theme.SearchModal.footer.navigateDownKeyAriaLabel": {
"message": "Arrow down",
"description": "The ARIA label for the Arrow down key button that makes the navigation"
},
"theme.SearchModal.footer.closeText": {
"message": "to close",
"description": "The explanatory text of the action for Escape key"
},
"theme.SearchModal.footer.closeKeyAriaLabel": {
"message": "Escape key",
"description": "The ARIA label for the Escape key button that close the modal"
},
"theme.SearchModal.footer.searchByText": {
"message": "Search by",
"description": "The text explain that the search is making by Algolia"
},
"theme.SearchModal.noResultsScreen.noResultsText": {
"message": "No results for",
"description": "The text explains that there are no results for the following search"
},
"theme.SearchModal.noResultsScreen.suggestedQueryText": {
"message": "Try searching for",
"description": "The text for the suggested query when no results are found for the following search"
},
"theme.SearchModal.noResultsScreen.reportMissingResultsText": {
"message": "Believe this query should return results?",
"description": "The text for the question where the user thinks there are missing results"
},
"theme.SearchModal.noResultsScreen.reportMissingResultsLinkText": {
"message": "Let us know.",
"description": "The text for the link to report missing results"
},
"theme.SearchModal.placeholder": {
"message": "Search docs",
"description": "The placeholder of the input of the DocSearch pop-up modal"
},
"theme.docs.sidebar.closeSidebarButtonAriaLabel": {
"message": "Close navigation bar",
"description": "The ARIA label for close button of mobile sidebar"
},
"theme.docs.sidebar.toggleSidebarButtonAriaLabel": {
"message": "Toggle navigation bar",
"description": "The ARIA label for hamburger menu button of mobile navigation"
},
"theme.NavBar.navAriaLabel": {
"message": "Main",
"description": "The ARIA label for the main navigation"
},
"theme.docs.sidebar.navAriaLabel": {
"message": "Docs sidebar",
"description": "The ARIA label for the sidebar navigation"
}
}

161
website/i18n/de/docusaurus-plugin-content-blog/2021-09-27-v2-beta1-release-notes.mdx Normal file
View file

@ -0,0 +1,161 @@
---
slug: wails-v2-beta-for-windows
title: Wails v2 Beta for Windows
authors:
- leaanthony
tags:
- wails
- v2
---
```mdx-code-block
<div class="text--center">
<img
src={require("@site/static/img/wails.webp").default}
width="40%"
class="screenshot"
/>
</div>
<br />
```
When I first announced Wails on Reddit, just over 2 years ago from a train in Sydney, I did not expect it to get much attention. A few days later, a prolific tech vlogger released a tutorial video, gave it a positive review and from that point on, interest in the project has skyrocketed.
It was clear that people were excited about adding web frontends to their Go projects, and almost immediately pushed the project beyond the proof of concept that I had created. At the time, Wails used the [webview](https://github.com/webview/webview) project to handle the frontend, and the only option for Windows was the IE11 renderer. Many bug reports were rooted in this limitation: poor JavaScript/CSS support and no dev tools to debug it. This was a frustrating development experience but there wasn't much that could have been done to rectify it.
For a long time, I'd firmly believed that Microsoft would eventually have to sort out their browser situation. The world was moving on, frontend development was booming and IE wasn't cutting it. When Microsoft announced the move to using Chromium as the basis for their new browser direction, I knew it was only a matter of time until Wails could use it, and move the Windows developer experience to the next level.
Today, I am pleased to announce: **Wails v2 Beta for Windows**! There's a huge amount to unpack in this release, so grab a drink, take a seat and we'll begin...
### No CGO Dependency!
No, I'm not joking: _No_ _CGO_ _dependency_ 🤯! The thing about Windows is that, unlike MacOS and Linux, it doesn't come with a default compiler. In addition, CGO requires a mingw compiler and there's a ton of different installation options. Removing the CGO requirement has massively simplified setup, as well as making debugging an awful lot easier. Whilst I have put a fair bit of effort in getting this working, the majority of the credit should go to [John Chadwick](https://github.com/jchv) for not only starting a couple of projects to make this possible, but also being open to someone taking those projects and building on them. Credit also to [Tad Vizbaras](https://github.com/tadvi) whose [winc](https://github.com/tadvi/winc) project started me down this path.
### WebView2 Chromium Renderer
```mdx-code-block
<div class="text--center">
<img
src={require("@site/static/img/devtools.png").default}
width="75%"
class="screenshot"
/>
</div>
<br />
```
Finally, Windows developers get a first class rendering engine for their applications! Gone are the days of contorting your frontend code to work on Windows. On top of that, you get a first-class developer tools experience!
The WebView2 component does, however, have a requirement to have the `WebView2Loader.dll` sitting alongside the binary. This makes distribution just that little bit more painful than we gophers are used to. All solutions and libraries (that I know of) that use WebView2 have this dependency.
However, I'm really excited to announce that Wails applications _have no such requirement_! Thanks to the wizardry of [John Chadwick](https://github.com/jchv), we are able to bundle this dll inside the binary and get Windows to load it as if it were present on disk.
Gophers rejoice! The single binary dream lives on!
### New Features
```mdx-code-block
<div class="text--center">
<img
src={require("@site/static/img/wails-menus.webp").default}
width="60%"
class="screenshot"
/>
</div>
<br />
```
There were a lot of requests for native menu support. Wails has finally got you covered. Application menus are now available and include support for most native menu features. This includes standard menu items, checkboxes, radio groups, submenus and separators.
There were a huge number of requests in v1 for the ability to have greater control of the window itself. I'm happy to announce that there's new runtime APIs specifically for this. It's feature-rich and supports multi-monitor configurations. There is also an improved dialogs API: Now, you can have modern, native dialogs with rich configuration to cater for all your dialog needs.
There is now the option to generate IDE configuration along with your project. This means that if you open your project in a supported IDE, it will already be configured for building and debugging your application. Currently VSCode is supported but we hope to support other IDEs such as Goland soon.
```mdx-code-block
<div class="text--center">
<img
src={require("@site/static/img/vscode.webp").default}
width="100%"
class="screenshot"
/>
</div>
<br />
```
### No requirement to bundle assets
A huge pain-point of v1 was the need to condense your entire application down to single JS & CSS files. I'm happy to announce that for v2, there is no requirement to bundle assets, in any way, shape or form. Want to load a local image? Use an `<img>` tag with a local src path. Want to use a cool font? Copy it in and add the path to it in your CSS.
> Wow, that sounds like a webserver...
Yes, it works just like a webserver, except it isn't.
> So how do I include my assets?
You just pass a single `embed.FS` that contains all your assets into your application configuration. They don't even need to be in the top directory - Wails will just work it out for you.
### New Development Experience
```mdx-code-block
<div class="text--center">
<img
src={require("@site/static/img/browser.webp").default}
width="60%"
class="screenshot"
/>
</div>
<br />
```
Now that assets don't need to be bundled, it's enabled a whole new development experience. The new `wails dev` command will build and run your application, but instead of using the assets in the `embed.FS`, it loads them directly from disk.
It also provides the additional features:
- Hot reload - Any changes to frontend assets will trigger and auto reload of the application frontend
- Auto rebuild - Any changes to your Go code will rebuild and relaunch your application
In addition to this, a webserver will start on port 34115. This will serve your application to any browser that connects to it. All connected web browsers will respond to system events like hot reload on asset change.
In Go, we are used to dealing with structs in our applications. It's often useful to send structs to our frontend and use them as state in our application. In v1, this was a very manual process and a bit of a burden on the developer. I'm happy to announce that in v2, any application run in dev mode will automatically generate TypeScript models for all structs that are input or output parameters to bound methods. This enables seamless interchange of data models between the two worlds.
In addition to this, another JS module is dynamically generated wrapping all your bound methods. This provides JSDoc for your methods, providing code completion and hinting in your IDE. It's really cool when you get data models auto-imported when hitting tab in an auto-generated module wrapping your Go code!
### Remote Templates
```mdx-code-block
<div class="text--center">
<img
src={require("@site/static/img/remote.webp").default}
width="60%"
class="screenshot"
/>
</div>
<br />
```
Getting an application up and running quickly was always a key goal for the Wails project. When we launched, we tried to cover a lot of the modern frameworks at the time: react, vue and angular. The world of frontend development is very opinionated, fast moving and hard to keep on top of! As a result, we found our base templates getting out of date pretty quickly and this caused a maintenance headache. It also meant that we didn't have cool modern templates for the latest and greatest tech stacks.
With v2, I wanted to empower the community by giving you the ability to create and host templates yourselves, rather than rely on the Wails project. So now you can create projects using community supported templates! I hope this will inspire developers to create a vibrant ecosystem of project templates. I'm really quite excited about what our developer community can create!
### In Conclusion
Wails v2 represents a new foundation for the project. The aim of this release is to get feedback on the new approach, and to iron out any bugs before a full release. Your input would be most welcome. Please direct any feedback to the [v2 Beta](https://github.com/wailsapp/wails/discussions/828) discussion board.
There were many twists and turns, pivots and u-turns to get to this point. This was due partly to early technical decisions that needed changing, and partly because some core problems we had spent time building workarounds for were fixed upstream: Go’s embed feature is a good example. Fortunately, everything came together at the right time, and today we have the very best solution that we can have. I believe the wait has been worth it - this would not have been possible even 2 months ago.
I also need to give a huge thank you :pray: to the following people because without them, this release just wouldn't exist:
- [Misite Bao](https://github.com/misitebao) - An absolute workhorse on the Chinese translations and an incredible bug finder.
- [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 we have today possible.
- [Tad Vizbaras](https://github.com/tadvi) - Experimenting with his [winc](https://github.com/tadvi/winc) project was the first step down the path to a pure Go Wails.
- [Mat Ryer](https://github.com/matryer) - His support, encouragement and feedback has really helped drive the project forward.
And finally, I'd like to give a special thank you to all the [project sponsors](/credits#sponsors), including [JetBrains](https://www.jetbrains.com?from=Wails), whose support drive the project in many ways behind the scenes.
I look forward to seeing what people build with Wails in this next exciting phase of the project!
Lea.
PS: MacOS and Linux users need not feel left out - porting to this new foundation is actively under way and most of the hard work has already been done. Hang in there!
PPS: If you or your company find Wails useful, please consider [sponsoring the project](https://github.com/sponsors/leaanthony). Thanks!

170
website/i18n/de/docusaurus-plugin-content-blog/2021-11-08-v2-beta2-release-notes.mdx Normal file
View file

@ -0,0 +1,170 @@
---
slug: wails-v2-beta-for-mac
title: Wails v2 Beta for MacOS
authors:
- leaanthony
tags:
- wails
- v2
---
```mdx-code-block
<div class="text--center">
<img
src={require("@site/static/img/wails-mac.webp").default}
width="60%"
class="screenshot"
/>
</div>
<br />
```
Today marks the first beta release of Wails v2 for Mac! It's taken quite a while to get to this point and I'm hoping that today's release will give you something that's reasonably useful. There have been a number of twists and turns to get to this point and I'm hoping, with your help, to iron out the crinkles and get the Mac port polished for the final v2 release.
You mean this isn't ready for production? For your use case, it may well be ready, but there are still a number of known issues so keep your eye on [this project board](https://github.com/wailsapp/wails/projects/7) and if you would like to contribute, you'd be very welcome!
So what's new for Wails v2 for Mac vs v1? Hint: It's pretty similar to the Windows Beta :wink:
### New Features
```mdx-code-block
<div class="text--center">
<img
src={require("@site/static/img/wails-menus-mac.webp").default}
width="80%"
class="screenshot"
/>
</div>
<br />
```
There were a lot of requests for native menu support. Wails has finally got you covered. Application menus are now available and include support for most native menu features. This includes standard menu items, checkboxes, radio groups, submenus and separators.
There were a huge number of requests in v1 for the ability to have greater control of the window itself. I'm happy to announce that there's new runtime APIs specifically for this. It's feature-rich and supports multi-monitor configurations. There is also an improved dialogs API: Now, you can have modern, native dialogs with rich configuration to cater for all your dialog needs.
### Mac Specific Options
In addition to the normal application options, Wails v2 for Mac also brings some Mac extras:
- Make your window all funky and translucent, like all the pretty swift apps!
- Highly customisable titlebar
- We support the NSAppearance options for the application
- Simple config to auto-create an "About" menu
### No requirement to bundle assets
A huge pain-point of v1 was the need to condense your entire application down to single JS & CSS files. I'm happy to announce that for v2, there is no requirement to bundle assets, in any way, shape or form. Want to load a local image? Use an `<img>` tag with a local src path. Want to use a cool font? Copy it in and add the path to it in your CSS.
> Wow, that sounds like a webserver...
Yes, it works just like a webserver, except it isn't.
> So how do I include my assets?
You just pass a single `embed.FS` that contains all your assets into your application configuration. They don't even need to be in the top directory - Wails will just work it out for you.
### New Development Experience
Now that assets don't need to be bundled, it's enabled a whole new development experience. The new `wails dev` command will build and run your application, but instead of using the assets in the `embed.FS`, it loads them directly from disk.
It also provides the additional features:
- Hot reload - Any changes to frontend assets will trigger and auto reload of the application frontend
- Auto rebuild - Any changes to your Go code will rebuild and relaunch your application
In addition to this, a webserver will start on port 34115. This will serve your application to any browser that connects to it. All connected web browsers will respond to system events like hot reload on asset change.
In Go, we are used to dealing with structs in our applications. It's often useful to send structs to our frontend and use them as state in our application. In v1, this was a very manual process and a bit of a burden on the developer. I'm happy to announce that in v2, any application run in dev mode will automatically generate TypeScript models for all structs that are input or output parameters to bound methods. This enables seamless interchange of data models between the two worlds.
In addition to this, another JS module is dynamically generated wrapping all your bound methods. This provides JSDoc for your methods, providing code completion and hinting in your IDE. It's really cool when you get data models auto-imported when hitting tab in an auto-generated module wrapping your Go code!
### Remote Templates
```mdx-code-block
<div class="text--center">
<img
src={require("@site/static/img/remote-mac.webp").default}
width="80%"
class="screenshot"
/>
</div>
<br />
```
Getting an application up and running quickly was always a key goal for the Wails project. When we launched, we tried to cover a lot of the modern frameworks at the time: react, vue and angular. The world of frontend development is very opinionated, fast moving and hard to keep on top of! As a result, we found our base templates getting out of date pretty quickly and this caused a maintenance headache. It also meant that we didn't have cool modern templates for the latest and greatest tech stacks.
With v2, I wanted to empower the community by giving you the ability to create and host templates yourselves, rather than rely on the Wails project. So now you can create projects using community supported templates! I hope this will inspire developers to create a vibrant ecosystem of project templates. I'm really quite excited about what our developer community can create!
### Native M1 Support
Thanks to the amazing support of [Mat Ryer](https://github.com/matryer/), the Wails project now supports M1 native builds:
```mdx-code-block
<div class="text--center">
<img
src={require("@site/static/img/build-darwin-arm.webp").default}
width="80%"
class="screenshot"
/>
</div>
<br />
```
You can also specify `darwin/amd64` as a target too:
```mdx-code-block
<div class="text--center">
<img
src={require("@site/static/img/build-darwin-amd.webp").default}
width="80%"
class="screenshot"
/>
</div>
<br />
```
Oh, I almost forgot.... you can also do `darwin/universal`.... :wink:
```mdx-code-block
<div class="text--center">
<img
src={require("@site/static/img/build-darwin-universal.webp").default}
width="80%"
class="screenshot"
/>
</div>
<br />
```
### Cross Compilation to Windows
Because Wails v2 for Windows is pure Go, you can target Windows builds without docker.
```mdx-code-block
<div class="text--center">
<img
src={require("@site/static/img/build-cross-windows.webp").default}
width="80%"
class="screenshot"
/>
</div>
<br />
```
### WKWebView Renderer
V1 relied on a (now deprecated) WebView component. V2 uses the most recent WKWebKit component so expect the latest and greatest from Apple.
### In Conclusion
As I'd said in the Windows release notes, Wails v2 represents a new foundation for the project. The aim of this release is to get feedback on the new approach, and to iron out any bugs before a full release. Your input would be most welcome! Please direct any feedback to the [v2 Beta](https://github.com/wailsapp/wails/discussions/828) discussion board.
And finally, I'd like to give a special thank you to all the [project sponsors](/credits#sponsors), including [JetBrains](https://www.jetbrains.com?from=Wails), whose support drive the project in many ways behind the scenes.
I look forward to seeing what people build with Wails in this next exciting phase of the project!
Lea.
PS: Linux users, you're next!
PPS: If you or your company find Wails useful, please consider [sponsoring the project](https://github.com/sponsors/leaanthony). Thanks!

114
website/i18n/de/docusaurus-plugin-content-blog/2022-02-22-v2-beta3-release-notes.mdx Normal file
View file

@ -0,0 +1,114 @@
---
slug: wails-v2-beta-for-linux
title: Wails v2 Beta for Linux
authors:
- leaanthony
tags:
- wails
- v2
---
```mdx-code-block
<div class="text--center">
<img
src={require("@site/static/img/wails-linux.webp").default}
width="40%"
class="screenshot"
/>
</div>
<br />
```
I'm pleased to finally announce that Wails v2 is now in beta for Linux! It is somewhat ironic that the very first experiments with v2 was on Linux and yet it has ended up as the last release. That being said, the v2 we have today is very different from those first experiments. So without further ado, let's go over the new features:
### New Features
```mdx-code-block
<div class="text--center">
<img
src={require("@site/static/img/wails-menus-linux.webp").default}
width="50%"
class="screenshot"
/>
</div>
<br />
```
There were a lot of requests for native menu support. Wails has finally got you covered. Application menus are now available and include support for most native menu features. This includes standard menu items, checkboxes, radio groups, submenus and separators.
There were a huge number of requests in v1 for the ability to have greater control of the window itself. I'm happy to announce that there's new runtime APIs specifically for this. It's feature-rich and supports multi-monitor configurations. There is also an improved dialogs API: Now, you can have modern, native dialogs with rich configuration to cater for all your dialog needs.
### No requirement to bundle assets
A huge pain-point of v1 was the need to condense your entire application down to single JS & CSS files. I'm happy to announce that for v2, there is no requirement to bundle assets, in any way, shape or form. Want to load a local image? Use an `<img>` tag with a local src path. Want to use a cool font? Copy it in and add the path to it in your CSS.
> Wow, that sounds like a webserver...
Yes, it works just like a webserver, except it isn't.
> So how do I include my assets?
You just pass a single `embed.FS` that contains all your assets into your application configuration. They don't even need to be in the top directory - Wails will just work it out for you.
### New Development Experience
Now that assets don't need to be bundled, it's enabled a whole new development experience. The new `wails dev` command will build and run your application, but instead of using the assets in the `embed.FS`, it loads them directly from disk.
It also provides the additional features:
- Hot reload - Any changes to frontend assets will trigger and auto reload of the application frontend
- Auto rebuild - Any changes to your Go code will rebuild and relaunch your application
In addition to this, a webserver will start on port 34115. This will serve your application to any browser that connects to it. All connected web browsers will respond to system events like hot reload on asset change.
In Go, we are used to dealing with structs in our applications. It's often useful to send structs to our frontend and use them as state in our application. In v1, this was a very manual process and a bit of a burden on the developer. I'm happy to announce that in v2, any application run in dev mode will automatically generate TypeScript models for all structs that are input or output parameters to bound methods. This enables seamless interchange of data models between the two worlds.
In addition to this, another JS module is dynamically generated wrapping all your bound methods. This provides JSDoc for your methods, providing code completion and hinting in your IDE. It's really cool when you get data models auto-imported when hitting tab in an auto-generated module wrapping your Go code!
### Remote Templates
```mdx-code-block
<div class="text--center">
<img
src={require("@site/static/img/remote-linux.webp").default}
width="80%"
class="screenshot"
/>
</div>
<br />
```
Getting an application up and running quickly was always a key goal for the Wails project. When we launched, we tried to cover a lot of the modern frameworks at the time: react, vue and angular. The world of frontend development is very opinionated, fast moving and hard to keep on top of! As a result, we found our base templates getting out of date pretty quickly and this caused a maintenance headache. It also meant that we didn't have cool modern templates for the latest and greatest tech stacks.
With v2, I wanted to empower the community by giving you the ability to create and host templates yourselves, rather than rely on the Wails project. So now you can create projects using community supported templates! I hope this will inspire developers to create a vibrant ecosystem of project templates. I'm really quite excited about what our developer community can create!
### Cross Compilation to Windows
Because Wails v2 for Windows is pure Go, you can target Windows builds without docker.
```mdx-code-block
<div class="text--center">
<img
src={require("@site/static/img/linux-build-cross-windows.webp").default}
width="80%"
class="screenshot"
/>
</div>
<br />
```
### In Conclusion
As I'd said in the Windows release notes, Wails v2 represents a new foundation for the project. The aim of this release is to get feedback on the new approach, and to iron out any bugs before a full release. Your input would be most welcome! Please direct any feedback to the [v2 Beta](https://github.com/wailsapp/wails/discussions/828) discussion board.
Linux is **hard** to support. We expect there to be a number of quirks with the beta. Please help us to help you by filing detailed bug reports!
Finally, I'd like to give a special thank you to all the [project sponsors](/credits#sponsors) whose support drive the project in many ways behind the scenes.
I look forward to seeing what people build with Wails in this next exciting phase of the project!
Lea.
PS: The v2 release isn't far off now!
PPS: If you or your company find Wails useful, please consider [sponsoring the project](https://github.com/sponsors/leaanthony). Thanks!

98
website/i18n/de/docusaurus-plugin-content-blog/2022-09-22-v2-release-notes.mdx Normal file
View file

@ -0,0 +1,98 @@
---
slug: wails-v2-released
title: Wails v2 Released
authors:
- leaanthony
tags:
- wails
- v2
---
```mdx-code-block
<div class="text--center">
<img
src={require("@site/static/img/blog/montage.png").default}
width="75%"
/>
</div>
<br />
```
# It's here!
Today marks the release of [Wails](https://wails.io) v2. It's been about 18 months since the first v2 alpha and about a year from the first beta release. I'm truly grateful to everyone involved in the evolution of the project.
Part of the reason it took that long was due to wanting to get to some definition of completeness before officially calling it v2. The truth is, there's never a perfect time to tag a release - there's always outstanding issues or "just one more" feature to squeeze in. What tagging an imperfect major release does do, however, is to provide a bit of stability for users of the project, as well as a bit of a reset for the developers.
This release is more than I'd ever expected it to be. I hope it gives you as much pleasure as it has given us to develop it.
# What _is_ Wails?
If you are unfamiliar with Wails, it is a project that enables Go programmers to provide rich frontends for their Go programs using familiar web technologies. It's a lightweight, Go alternative to Electron. Much more information can be found on the [official site](https://wails.io/docs/introduction).
# What's new?
The v2 release is a huge leap forward for the project, addressing many of the pain points of v1. If you have not read any of the blog posts on the Beta releases for [macOS](/blog/wails-v2-beta-for-mac), [Windows](/blog/wails-v2-beta-for-windows) or [Linux](/blog/wails-v2-beta-for-linux), then I encourage you to do so as it covers all the major changes in more detail. In summary:
- Webview2 component for Windows that supports modern web standards and debugging capabilities.
- [Dark / Light theme](/docs/reference/options#theme) + [custom theming](/docs/reference/options#customtheme) on Windows.
- Windows now has no CGO requirements.
- Out-of-the-box support for Svelte, Vue, React, Preact, Lit & Vanilla project templates.
- [Vite](https://vitejs.dev/) integration providing a hot-reload development environment for your application.
- Native application [menus](/docs/guides/application-development#application-menu) and [dialogs](/docs/reference/runtime/dialog).
- Native window translucency effects for [Windows](/docs/reference/options#windowistranslucent) and [macOS](/docs/reference/options#windowistranslucent-1). Support for Mica & Acrylic backdrops.
- Easily generate an [NSIS installer](/docs/guides/windows-installer) for Windows deployments.
- A rich [runtime library](/docs/reference/runtime/intro) providing utility methods for window manipulation, eventing, dialogs, menus and logging.
- Support for [obfuscating](/docs/guides/obfuscated) your application using [garble](https://github.com/burrowers/garble).
- Support for compressing your application using [UPX](https://upx.github.io/).
- Automatic TypeScript generation of Go structs. More info [here](/docs/howdoesitwork#calling-bound-go-methods).
- No extra libraries or DLLs are required to be shipped with your application. For any platform.
- No requirement to bundle frontend assets. Just develop your application like any other web application.
# Credit & Thanks
Getting to v2 has been a huge effort. There have been ~2.2K commits by 89 contributors between the initial alpha and the release today, and many, many more that have provided translations, testing, feedback and help on the discussion forums as well as the issue tracker. I'm so unbelievably grateful to each one of you. I'd also like to give an extra special thank you to all the project sponsors who have provided guidance, advice and feedback. Everything you do is hugely appreciated.
There are a few people I'd like to give special mention to:
Firstly, a **huge** thank you to [@stffabi](https://github.com/stffabi) who has provided so many contributions which we all benefit from, as well as providing a lot of support on many issues. He has provided some key features such as the external dev server support which transformed our dev mode offering by allowing us to hook into [Vite](https://vitejs.dev/)'s superpowers. It's fair to say that Wails v2 would be a far less exciting release without his [incredible contributions](https://github.com/wailsapp/wails/commits?author=stffabi&since=2020-01-04). Thank you so much @stffabi!
I'd also like to give a huge shout-out to [@misitebao](https://github.com/misitebao) who has tirelessly been maintaining the website, as well as providing Chinese translations, managing Crowdin and helping new translators get up to speed. This is a hugely important task, and I'm extremely grateful for all the time and effort put into this! You rock!
Last, but not least, a huge thank you to Mat Ryer who has provided advice and support during the development of v2. Writing xBar together using an early Alpha of v2 was helpful in shaping the direction of v2, as well as give me an understanding of some design flaws in the early releases. I'm happy to announce that as of today, we will start to port xBar to Wails v2, and it will become the flagship application for the project. Cheers Mat!
# Lessons Learnt
There are a number of lessons learnt in getting to v2 that will shape development moving forward.
## Smaller, Quicker, Focused Releases
In the course of developing v2, there were many features and bug fixes that were developed on an ad-hoc basis. This led to longer release cycles and were harder to debug. Moving forward, we are going to create releases more often that will include a reduced number of features. A release will involve updates to documentation as well as thorough testing. Hopefully, these smaller, quicker, focussed releases will lead to fewer regressions and better quality documentation.
## Encourage Engagement
When starting this project, I wanted to immediately help everyone who had a problem. Issues were "personal" and I wanted them resolved as quickly as possible. This is unsustainable and ultimately works against the longevity of the project. Moving forward, I will be giving more space for people to get involved in answering questions and triaging issues. It would be good to get some tooling to help with this so if you have any suggestions, please join in the discussion [here](https://github.com/wailsapp/wails/discussions/1855).
## Learning to say No
The more people that engage with an Open Source project, the more requests there will be for additional features that may or may not be useful to the majority of people. These features will take an initial amount of time to develop and debug, and incur an ongoing maintenance cost from that point on. I myself am the most guilty of this, often wanting to "boil the sea" rather than provide the minimum viable feature. Moving forward, we will need to say "No" a bit more to adding core features and focus our energies on a way to empower developers to provide that functionality themselves. We are looking seriously into plugins for this scenario. This will allow anyone to extend the project as they see fit, as well as providing an easy way to contribute towards the project.
# Looking to the Future
There are so many core features we are looking at to add to Wails in the next major development cycle already. The [roadmap](https://github.com/wailsapp/wails/discussions/1484) is full of interesting ideas, and I'm keen to start work on them. One of the big asks has been for multiple window support. It's a tricky one and to do it right, and we may need to look at providing an alternative API, as the current one was not designed with this in mind. Based on some preliminary ideas and feedback, I think you'll like where we're looking to go with it.
I'm personally very excited at the prospect of getting Wails apps running on mobile. We already have a demo project showing that it is possible to run a Wails app on Android, so I'm really keen to explore where we can go with this!
A final point I'd like to raise is that of feature parity. It has long been a core principle that we wouldn't add anything to the project without there being full cross-platform support for it. Whilst this has proven to be (mainly) achievable so far, it has really held the project back in releasing new features. Moving forward, we will be adopting a slightly different approach: any new feature that cannot be immediately released for all platforms will be released under an experimental configuration or API. This allows early adopters on certain platforms to try the feature and provide feedback that will feed into the final design of the feature. This, of course, means that there are no guarantees of API stability until it is fully supported by all the platforms it can be supported on, but at least it will unblock development.
# Final Words
I'm really proud of what we've been able to achieve with the V2 release. It's amazing to see what people have already been able to build using the beta releases so far. Quality applications like [Varly](https://varly.app/), [Surge](https://getsurge.io/) and [October](https://october.utf9k.net/). I encourage you to check them out.
This release was achieved through the hard work of many contributors. Whilst it is free to download and use, it has not come about through zero cost. Make no mistakes, this project has come at considerable cost. It has not only been my time and the time of each and every contributor, but also the cost of absence from friends and families of each of those people too. That's why I'm extremely grateful for every second that has been dedicated to making this project happen. The more contributors we have, the more this effort can be spread out and the more we can achieve together. I'd like to encourage you all to pick one thing that you can contribute, whether it is confirming someone's bug, suggesting a fix, making a documentation change or helping out someone who needs it. All of these small things have such a huge impact! It would be so awesome if you too were part of the story in getting to v3.
Enjoy!
&dash; Lea
PS: If you or your company find Wails useful, please consider [sponsoring the project](https://github.com/sponsors/leaanthony). Thanks!

184
website/i18n/de/docusaurus-plugin-content-blog/2023-01-17-v3-roadmap.mdx Normal file
View file

@ -0,0 +1,184 @@
---
slug: the-road-to-wails-v3
title: The Road to Wails v3
authors:
- leaanthony
tags:
- wails
- v3
---
```mdx-code-block
<div class="text--center">
<img
src={require("@site/static/img/blog/multiwindow.webp").default}
width="90%"
/>
</div>
<br />
```
# Introduction
Wails is a project that simplifies the ability to write cross-platform desktop applications using Go. It uses native webview components for the frontend (not embedded browsers), bringing the power of the world's most popular UI system to Go, whilst remaining lightweight.
Version 2 was released on the 22nd of September 2022 and brought with it a lot of enhancements including:
- Live development, leveraging the popular Vite project
- Rich functionality for managing windows and creating menus
- Microsoft's WebView2 component
- Generation of Typescript models that mirror your Go structs
- Creating of NSIS Installer
- Obfuscated builds
Right now, Wails v2 provides powerful tooling for creating rich, cross-platform desktop applications.
This blog post aims to look at where the project is at right now and what we can improve on moving forward.
# Where are we now?
It's been incredible to see the popularity of Wails rising since the v2 release. I'm constantly amazed by the creativity of the community and the wonderful things that are being built with it. With more popularity, comes more eyes on the project. And with that, more feature requests and bug reports.
Over time, I've been able to identify some of the most pressing issues facing the project. I've also been able to identify some of the things that are holding the project back.
## Current issues
I've identified the following areas that I feel are holding the project back:
- The API
- Bindings generation
- The Build System
### The API
The API to build a Wails application currently consists of 2 parts:
- The Application API
- The Runtime API
The Application API famously has only 1 function: `Run()` which takes a heap of options which govern how the application will work. Whilst this is very simple to use, it is also very limiting. It is a "declarative" approach which hides a lot of the underlying complexity. For instance, there is no handle to the main window, so you can't interact with it directly. For that, you need to use the Runtime API. This is a problem when you start to want to do more complex things like create multiple windows.
The Runtime API provides a lot of utility functions for the developer. This includes:
- Window management
- Dialogs
- Menus
- Events
- Logs
There are a number of things I am not happy with the Runtime API. The first is that it requires a "context" to be passed around. This is both frustrating and confusing for new developers who pass in a context and then get a runtime error.
The biggest issue with the Runtime API is that it was designed for applications that only use a single window. Over time, the demand for multiple windows has grown and the API is not well suited to this.
### Thoughts on the v3 API
Wouldn't it be great if we could do something like this?
```go
func main() {
app := wails.NewApplication(options.App{})
myWindow := app.NewWindow(options.Window{})
myWindow.SetTitle("My Window")
myWindow.On(events.Window.Close, func() {
app.Quit()
})
app.Run()
}
```
This programmatic approach is far more intuitive and allows the developer to interact with the application elements directly. All current runtime methods for windows would simply be methods on the window object. For the other runtime methods, we could move them to the application object like so:
```go
app := wails.NewApplication(options.App{})
app.NewInfoDialog(options.InfoDialog{})
app.Log.Info("Hello World")
```
This is a much more powerful API which will allow for more complex applications to be built. It also allows for the creation of multiple windows, [the most up-voted feature on GitHub](https://github.com/wailsapp/wails/issues/1480):
```go
func main() {
app := wails.NewApplication(options.App{})
myWindow := app.NewWindow(options.Window{})
myWindow.SetTitle("My Window")
myWindow.On(events.Window.Close, func() {
app.Quit()
})
myWindow2 := app.NewWindow(options.Window{})
myWindow2.SetTitle("My Window 2")
myWindow2.On(events.Window.Close, func() {
app.Quit()
})
app.Run()
}
```
### Bindings generation
One of the key features of Wails is generating bindings for your Go methods so they may be called from Javascript. The current method for doing this is a bit of a hack. It involves building the application with a special flag and then running the resultant binary which uses reflection to determine what has been bound. This leads to a bit of a chicken and egg situation: You can't build the application without the bindings and you can't generate the bindings without building the application. There are many ways around this but the best one would be not to use this approach at all.
There was a number of attempts at writing a static analyser for Wails projects but they didn't get very far. In more recent times, it has become slightly easier to do this with more material available on the subject.
Compared to reflection, the AST approach is much faster however it is significantly more complicated. To start with, we may need to impose certain constraints on how to specify bindings in the code. The goal is to support the most common use cases and then expand it later on.
### The Build System
Like the declarative approach to the API, the build system was created to hide the complexities of building a desktop application. When you run `wails build`, it does a lot of things behind the scenes:
- Builds the backend binary for bindings and generates the bindings
- Installs the frontend dependencies
- Builds the frontend assets
- Determines if the application icon is present and if so, embeds it
- Builds the final binary
- If the build is for `darwin/universal` it builds 2 binaries, one for `darwin/amd64` and one for `darwin/arm64` and then creates a fat binary using `lipo`
- If compression is required, it compresses the binary with UPX
- Determines if this binary is to be packaged and if so:
- Ensures the icon and application manifest are compiled into the binary (Windows)
- Builds out the application bundle, generates the icon bundle and copies it, the binary and Info.plist to the application bundle (Mac)
- If an NSIS installer is required, it builds it
This entire process, whilst very powerful, is also very opaque. It is very difficult to customise it and it is very difficult to debug.
To address this in v3, I would like to move to a build system that exists outside of Wails. After using [Task](https://taskfile.dev/) for a while, I am a big fan of it. It is a great tool for configuring build systems and should be reasonably familiar to anyone who has used Makefiles.
The build system would be configured using a `Taskfile.yml` file which would be generated by default with any of the supported templates. This would have all of the steps required to do all the current tasks, such as building or packaging the application, allowing for easy customisation.
There will be no external requirement for this tooling as it would form part of the Wails CLI. This means that you can still use `wails build` and it will do all the things it does today. However, if you want to customise the build process, you can do so by editing the `Taskfile.yml` file. It also means you can easily understand the build steps and use your own build system if you wish.
The missing piece in the build puzzle is the atomic operations in the build process, such as icon generation, compression and packaging. To require a bunch of external tooling would not be a great experience for the developer. To address this, the Wails CLI will provide all these capabilities as part of the CLI. This means that the builds still work as expected, with no extra external tooling, however you can replace any step of the build with any tool you like.
This will be a much more transparent build system which will allow for easier customisation and address a lot of the issues that have been raised around it.
## The Payoff
These positive changes will be a huge benefit to the project:
- The new API will be much more intuitive and will allow for more complex applications to be built.
- Using static analysis for bindings generation will be much faster and reduce a lot of the complexity around the current process.
- Using an established, external build system will make the build process completely transparent, allowing for powerful customisation.
Benefits to the project maintainers are:
- The new API will be much easier to maintain and adapt to new features and platforms.
- The new build system will be much easier to maintain and extend. I hope this will lead to a new ecosystem of community driven build pipelines.
- Better separation of concerns within the project. This will make it easier to add new features and platforms.
## The Plan
A lot of the experimentation for this has already been done and it's looking good. There is no current timeline for this work but I'm hoping by the end of Q1 2023, there will be an alpha release for Mac to allow the community to test, experiment with and provide feedback.
## Summary
- The v2 API is declarative, hides a lot from the developer and not suitable for features such as multiple windows. A new API will be created which will be simpler, intuitive and more powerful.
- The build system is opaque and difficult to customise so we will move to an external build system which will open it all up.
- The bindings generation is slow and complex so we will move to static analysis which will remove a lot of the complexity the current method has.
There has been a lot of work put into the guts of v2 and it's solid. It's now time to address the layer on top of it and make it a much better experience for the developer.
I hope you are as excited about this as I am. I'm looking forward to hearing your thoughts and feedback.
Regards,
&dash; Lea
PS: If you or your company find Wails useful, please consider [sponsoring the project](https://github.com/sponsors/leaanthony). Thanks!
PPS: Yes, that's a genuine screenshot of a multi-window application built with Wails. It's not a mockup. It's real. It's awesome. It's coming soon.

10
website/i18n/de/docusaurus-plugin-content-blog/authors.yml Normal file
View file

@ -0,0 +1,10 @@
leaanthony:
name: Lea Anthony
title: Maintainer of Wails
url: https://github.com/leaanthony
image_url: https://github.com/leaanthony.png
misitebao:
name: Misite Bao
title: Architect
url: https://github.com/misitebao
image_url: https://github.com/misitebao.png

14
website/i18n/de/docusaurus-plugin-content-blog/options.json Normal file
View file

@ -0,0 +1,14 @@
{
"title": {
"message": "Blog",
"description": "The title for the blog used in SEO"
},
"description": {
"message": "Blog",
"description": "The description for the blog used in SEO"
},
"sidebar.title": {
"message": "Recent posts",
"description": "The label for the left sidebar"
}
}

38
website/i18n/de/docusaurus-plugin-content-docs/current.json Normal file
View file

@ -0,0 +1,38 @@
{
"version.label": {
"message": "Next Version 🚧",
"description": "The label for version current"
},
"sidebar.docs.category.Getting Started": {
"message": "Getting Started",
"description": "The label for category Getting Started in sidebar docs"
},
"sidebar.docs.category.Reference": {
"message": "Reference",
"description": "The label for category Reference in sidebar docs"
},
"sidebar.docs.category.Runtime": {
"message": "Runtime",
"description": "The label for category Runtime in sidebar docs"
},
"sidebar.docs.category.Community": {
"message": "Community",
"description": "The label for category Community in sidebar docs"
},
"sidebar.docs.category.Showcase": {
"message": "Showcase",
"description": "The label for category Showcase in sidebar docs"
},
"sidebar.docs.category.Guides": {
"message": "Guides",
"description": "The label for category Guides in sidebar docs"
},
"sidebar.docs.category.Tutorials": {
"message": "Tutorials",
"description": "The label for category Tutorials in sidebar docs"
},
"sidebar.docs.link.Contributing": {
"message": "Contributing",
"description": "The label for link Contributing in sidebar docs, linking to /community-guide#ways-of-contributing"
}
}

26
website/i18n/de/docusaurus-plugin-content-docs/current/community/links.mdx Normal file
View file

@ -0,0 +1,26 @@
---
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
- [Wails Discord Server](https://discord.gg/JDdSxwjhGf)
- [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
## Other Tutorials and Articles
- [Building of Bulletin Board](https://blog.customct.com/building-bulletin-board)

10
website/i18n/de/docusaurus-plugin-content-docs/current/community/showcase/bulletinboard.mdx Normal file
View file

@ -0,0 +1,10 @@
# BulletinBoard
```mdx-code-block
<p style={{ "text-align": "center" }}>
<img src={require("@site/static/img/showcase/bboard.webp").default} />
<br />
</p>
```
The [BulletinBoard](https://github.com/raguay/BulletinBoard) application is a versital message board for static messages or dialogs to get information from the user for a script. It has a TUI for creating new dialogs that can latter be used to get information from the user. It's design is to stay running on your system and show the information as needed and then hide away. I have a process for watching a file on my system and sending the contents to BulletinBoard when changed. It works great with my workflows. There is also an [Alfred workflow](https://github.com/raguay/MyAlfred/blob/master/Alfred%205/EmailIt.alfredworkflow) for sending information to the program. The workflow is also for working with [EmailIt](https://github.com/raguay/EmailIt).

39
website/i18n/de/docusaurus-plugin-content-docs/current/community/showcase/cfntracker.mdx Normal file
View file

@ -0,0 +1,39 @@
# CFN Tracker
```mdx-code-block
<p style={{ "text-align": "center" }}>
<img src={require("@site/static/img/showcase/cfntracker.webp").default} />
<br />
</p>
```
[CFN Tracker](https://github.com/williamsjokvist/cfn-tracker) - Track any Street
Fighter 6 or V CFN profile's live matches. Check
[the website](https://cfn.williamsjokvist.se/) to get started.
## Features
- Real-time match tracking
- Storing match logs and statistics
- Support for displaying live stats to OBS via Browser Source
- Support for both SF6 and SFV
- Ability for users to create their own OBS Browser themes with CSS
### Major tech used alongside Wails
- [Task](https://github.com/go-task/task) - wrapping the Wails CLI to make
common commands easy to use
- [React](https://github.com/facebook/react) - chosen for its rich ecosystem
(radix, framer-motion)
- [Bun](https://github.com/oven-sh/bun) - used for its fast dependency
resolution and build-time
- [Rod](https://github.com/go-rod/rod) - headless browser automation for
authentication and polling changes
- [SQLite](https://github.com/mattn/go-sqlite3) - used for storing matches,
sessions and profiles
- [Server-sent events](https://developer.mozilla.org/en-US/docs/Web/API/Server-sent_events) -
a http stream to send tracking updates to OBS browser sources
- [i18next](https://github.com/i18next/) - with backend connector to serve
localization objects from the Go layer
- [xstate](https://github.com/statelyai/xstate) - state machines for auth
process and tracking

10
website/i18n/de/docusaurus-plugin-content-docs/current/community/showcase/emailit.mdx Normal file
View file

@ -0,0 +1,10 @@
# EmailIt
```mdx-code-block
<p style={{ "text-align": "center" }}>
<img src={require("@site/static/img/showcase/emailit.webp").default} />
<br />
</p>
```
[EmailIt](https://github.com/raguay/EmailIt/) is a Wails 2 program that is a markdown based email sender only with nine notepads, scripts to manipulate the text, and templates. It also has a scripts terminal to run scripts in EmailIt on files in your system. The scripts and templates can be used from the commandline itself or with the Alfred, Keyboard Maestro, Dropzone, or PopClip extensions. It also supports scripts and themes downloaded form GitHub. Documentation is not complete, but the programs works. It’s built using Wails2 and Svelte, and the download is a universal macOS application.

12
website/i18n/de/docusaurus-plugin-content-docs/current/community/showcase/encrypteasy.mdx Normal file
View file

@ -0,0 +1,12 @@
# EncryptEasy
```mdx-code-block
<p style={{ "text-align": "center" }}>
<img src={require("@site/static/img/showcase/encrypteasy.webp").default} />
<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.

13
website/i18n/de/docusaurus-plugin-content-docs/current/community/showcase/espstudio.mdx Normal file
View file

@ -0,0 +1,13 @@
# ESP Studio
```mdx-code-block
<p style={{ "text-align": "center" }}>
<img
src={require("@site/static/img/showcase/esp-studio.png").default}
/>
<br />
</p>
```
[ESP Studio](https://github.com/torabian/esp-studio) - Cross platform, Desktop, Cloud, and Embedded software
for controlling ESP/Arduino devices, and building complex IOT workflows and control systems

16
website/i18n/de/docusaurus-plugin-content-docs/current/community/showcase/filehound.mdx Normal file
View file

@ -0,0 +1,16 @@
# FileHound Export Utility
```mdx-code-block
<p style={{ "text-align": "center" }}>
<img src={require("@site/static/img/showcase/filehound.webp").default} />
<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

10
website/i18n/de/docusaurus-plugin-content-docs/current/community/showcase/grpcmd-gui.mdx Normal file
View file

@ -0,0 +1,10 @@
# grpcmd-gui
```mdx-code-block
<p style={{ "text-align": "center" }}>
<img src={require("@site/static/img/showcase/grpcmd-gui.webp").default} />
<br />
</p>
```
[grpcmd-gui](https://grpc.md/gui) is a modern cross-platform desktop app and API client for gRPC development and testing.

10
website/i18n/de/docusaurus-plugin-content-docs/current/community/showcase/hiposter.mdx Normal file
View file

@ -0,0 +1,10 @@
# hiposter
```mdx-code-block
<p style={{ "text-align": "center" }}>
<img src={require("@site/static/img/showcase/hiposter.webp").default} />
<br />
</p>
```
[hiposter](https://github.com/obity/hiposter) is a simple and efficient http API testing client tool. Based on Wails, Go and sveltejs.

23
website/i18n/de/docusaurus-plugin-content-docs/current/community/showcase/kafka-king.mdx Normal file
View file

@ -0,0 +1,23 @@
# Kafka-King
```mdx-code-block
<p style={{ "text-align": "center" }}>
<img src={require("@site/static/img/showcase/kafka-King-img_3.webp").default} />
<br />
</p>
```
[Kafka-King](https://github.com/Bronya0/Kafka-King) is a kafka GUI client that supports various systems and is compact and easy to use.
This is made of Wails+vue3
# Kafka-King function list
- [x] View the cluster node list, support dynamic configuration of broker and topic configuration items
- [x] Supports consumer clients, consumes the specified topic, size, and timeout according to the specified group, and displays the message information in various dimensions in a table
- [x] Supports PLAIN, SSL, SASL, kerberos, sasl_plaintext, etc. etc.
- [x] Create topics (support batches), delete topics, specify replicas, partitions
- [x] Support statistics of the total number of messages, total number of submissions, and backlog for each topic based on consumer groups
- [x] Support viewing topics Detailed information (offset) of the partition, and support adding additional partitions
- [x] Support simulated producers, batch sending messages, specify headers, partitions
- [x] Health check
- [x] Support viewing consumer groups , Consumer- ……

10
website/i18n/de/docusaurus-plugin-content-docs/current/community/showcase/mchat.mdx Normal file
View file

@ -0,0 +1,10 @@
# Mchat
```mdx-code-block
<p style={{ "text-align": "center" }}>
<img src={require("@site/static/img/showcase/mchat.gif").default} />
<br />
</p>
```
[Official page](https://marcio199226.github.io/mchat-site/public/) Fully anonymous end2end encrypted chat.

14
website/i18n/de/docusaurus-plugin-content-docs/current/community/showcase/minecraftupdater.mdx Normal file
View file

@ -0,0 +1,14 @@
# Minecraft Updater
```mdx-code-block
<p style={{ "text-align": "center" }}>
<img
src={
require("@site/static/img/showcase/minecraft-mod-updater.webp").default
}
/>
<br />
</p>
```
[Minecraft Updater](https://github.com/Gurkengewuerz/MinecraftModUpdater) is a utility tool to update and synchronize Minecraft mods for your userbase. It’s built using Wails2 and React with [antd](https://ant.design/) as frontend framework.

10
website/i18n/de/docusaurus-plugin-content-docs/current/community/showcase/minesweeper-xp.mdx Normal file
View file

@ -0,0 +1,10 @@
# Minesweeper XP
```mdx-code-block
<p style={{ "text-align": "center" }}>
<img src={require("@site/static/img/showcase/minesweeper-xp.webp").default} />
<br />
</p>
```
[Minesweeper-XP](https://git.new/Minesweeper-XP) allows you to experience the classic Minesweeper XP (+ 98 and 3.1) on macOS, Windows, and Linux!

14
website/i18n/de/docusaurus-plugin-content-docs/current/community/showcase/modalfilemanager.mdx Normal file
View file

@ -0,0 +1,14 @@
# Modal File Manager
```mdx-code-block
<p style={{ "text-align": "center" }}>
<img
src={require("@site/static/img/showcase/modalfilemanager.webp").default}
/>
<br />
</p>
```
[Modal File Manager](https://github.com/raguay/ModalFileManager) is a dual pane file manager using web technologies. My original design was based on NW.js and can be found [here](https://github.com/raguay/ModalFileManager-NWjs). This version uses the same Svelte based frontend code (but it has be greatly modified since the departure from NW.js), but the backend is a [Wails 2](https://wails.io/) implementation. By using this implementation, I no longer use command line `rm`, `cp`, etc. commands, but a git install has to be on the system to download themes and extensions. It is fully coded using Go and runs much faster than the previous versions.
This file manager is designed around the same principle as Vim: a state controlled keyboard actions. The number of states isn't fixed, but very programmable. Therefore, an infinite number of keyboard configurations can be created and used. This is the main difference from other file managers. There are themes and extensions available to download from GitHub.

10
website/i18n/de/docusaurus-plugin-content-docs/current/community/showcase/mollywallet.mdx Normal file
View file

@ -0,0 +1,10 @@
# Molley Wallet
```mdx-code-block
<p style={{ "text-align": "center" }}>
<img src={require("@site/static/img/showcase/mollywallet.webp").default} />
<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.

14
website/i18n/de/docusaurus-plugin-content-docs/current/community/showcase/october.mdx Normal file
View file

@ -0,0 +1,14 @@
# October
```mdx-code-block
<p style={{ "text-align": "center" }}>
<img src={require("@site/static/img/showcase/october.webp").default} />
<br />
</p>
```
[October](https://october.utf9k.net) is a small Wails application that makes it really easy to extract highlights from [Kobo eReaders](https://en.wikipedia.org/wiki/Kobo_eReader) and then forward them to [Readwise](https://readwise.io).
It has a relatively small scope with all platform versions weighing in under 10MB, and that's without enabling [UPX compression](https://upx.github.io/)!
In contrast, the author's previous attempts with Electron quickly bloated to several hundred megabytes.

10
website/i18n/de/docusaurus-plugin-content-docs/current/community/showcase/optimus.mdx Normal file
View file

@ -0,0 +1,10 @@
# Optimus
```mdx-code-block
<p style={{ "text-align": "center" }}>
<img src={require("@site/static/img/showcase/optimus.webp").default} />
<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.

10
website/i18n/de/docusaurus-plugin-content-docs/current/community/showcase/portfall.mdx Normal file
View file

@ -0,0 +1,10 @@
# Portfall
```mdx-code-block
<p style={{ "text-align": "center" }}>
<img src={require("@site/static/img/showcase/portfall.webp").default} />
<br />
</p>
```
[Portfall](https://github.com/rekon-oss/portfall) - A desktop k8s port-forwarding portal for easy access to all your cluster UIs

10
website/i18n/de/docusaurus-plugin-content-docs/current/community/showcase/resizem.mdx Normal file
View file

@ -0,0 +1,10 @@
# Resizem
```mdx-code-block
<p style={{ "text-align": "center" }}>
<img src={require("@site/static/img/showcase/resizem.webp").default} />
<br />
</p>
```
[Resizem](https://github.com/barats/resizem) - is an app designed for bulk image process. It is particularly useful for users who need to resize, convert, and manage large numbers of image files at once.

12
website/i18n/de/docusaurus-plugin-content-docs/current/community/showcase/restic-browser.mdx Normal file
View file

@ -0,0 +1,12 @@
# Restic Browser
```mdx-code-block
<p style={{ "text-align": "center" }}>
<img
src={require("@site/static/img/showcase/restic-browser-2.png").default}
/>
<br />
</p>
```
[Restic-Browser](https://github.com/emuell/restic-browser) - A simple, cross-platform [restic](https://github.com/restic/restic) backup GUI for browsing and restoring restic repositories.

21
website/i18n/de/docusaurus-plugin-content-docs/current/community/showcase/riftshare.mdx Normal file
View file

@ -0,0 +1,21 @@
# RiftShare
```mdx-code-block
<p style={{ "text-align": "center" }}>
<img src={require("@site/static/img/showcase/riftshare-main.webp").default} />
<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!

10
website/i18n/de/docusaurus-plugin-content-docs/current/community/showcase/scriptbar.mdx Normal file
View file

@ -0,0 +1,10 @@
# ScriptBar
```mdx-code-block
<p style={{ "text-align": "center" }}>
<img src={require("@site/static/img/showcase/scriptbar.webp").default} />
<br />
</p>
```
[ScriptBar](https://GitHub.com/raguay/ScriptBarApp) is a program to show the output of scripts or [Node-Red](https://nodered.org) server. It runs scripts defined in EmailIt program and shows the output. Scripts from xBar or TextBar can be used, but currently on the TextBar scripts work well. It also displays the output of scripts on your system. ScriptBar doesn't put them in the menubar, but has them all in a convient window for easy viewing. You can have multiple tabs to have many different things show. You can also keep the links to your most visited web sites.

27
website/i18n/de/docusaurus-plugin-content-docs/current/community/showcase/snippetexpander.mdx Normal file
View file

@ -0,0 +1,27 @@
# Snippet Expander
```mdx-code-block
<p style={{ "text-align": "center" }}>
<img src={require("@site/static/img/showcase/snippetexpandergui-select-snippet.png").default} />
<br />
Screenshot of Snippet Expander's Select Snippet window
</p>
<p style={{ "text-align": "center" }}>
<img src={require("@site/static/img/showcase/snippetexpandergui-add-snippet.png").default} />
<br />
Screenshot of Snippet Expander's Add Snippet screen
</p>
<p style={{ "text-align": "center" }}>
<img src={require("@site/static/img/showcase/snippetexpandergui-search-and-paste.png").default} />
<br />
Screenshot of Snippet Expander's Search & Paste window
</p>
```
[Snippet Expander](https://snippetexpander.org) is "Your little expandable text snippets helper", for Linux.
Snippet Expander comprises of a GUI application built with Wails for managing snippets and settings, with a Search & Paste window mode for quickly selecting and pasting a snippet.
The Wails based GUI, go-lang CLI and vala-lang auto expander daemon all communicate with a go-lang daemon via D-Bus. The daemon does the majority of the work, managing the database of snippets and common settings, and providing services for expanding and pasting snippets etc.
Check out the [source code](https://git.sr.ht/~ianmjones/snippetexpander/tree/trunk/item/cmd/snippetexpandergui/app.go#L38) to see how the Wails app sends messages from the UI to the backend that are then sent to the daemon, and subscribes to a D-Bus event to monitor changes to snippets via another instance of the app or CLI and show them instantly in the UI via a Wails event.

10
website/i18n/de/docusaurus-plugin-content-docs/current/community/showcase/surge.mdx Normal file
View file

@ -0,0 +1,10 @@
# Surge
```mdx-code-block
<p style={{ "text-align": "center" }}>
<img src={require("@site/static/img/showcase/surge.png").default} />
<br />
</p>
```
[Surge](https://getsurge.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.

11
website/i18n/de/docusaurus-plugin-content-docs/current/community/showcase/tinyrdm.mdx Normal file
View file

@ -0,0 +1,11 @@
# Tiny RDM
```mdx-code-block
<p style={{ "text-align": "center" }}>
<img src={require("@site/static/img/showcase/tiny-rdm1.webp").default} />
<img src={require("@site/static/img/showcase/tiny-rdm2.webp").default} />
<br />
</p>
```
The [Tiny RDM](https://redis.tinycraft.cc/) application is an open-source, modern lightweight Redis GUI. It has a beautful UI, intuitive Redis database management, and compatible with Windows, Mac, and Linux. It provides visual key-value data operations, supports various data decoding and viewing options, built-in console for executing commands, slow log queries and more.

10
website/i18n/de/docusaurus-plugin-content-docs/current/community/showcase/wailsterm.mdx Normal file
View file

@ -0,0 +1,10 @@
# WailsTerm
```mdx-code-block
<p style={{ "text-align": "center" }}>
<img src={require("@site/static/img/showcase/wailsterm.webp").default} />
<br />
</p>
```
[WailsTerm](https://github.com/rlshukhov/wailsterm) is a simple translucent terminal app powered by Wails and Xterm.js.

10
website/i18n/de/docusaurus-plugin-content-docs/current/community/showcase/wally.mdx Normal file
View file

@ -0,0 +1,10 @@
# Wally
```mdx-code-block
<p style={{ "text-align": "center" }}>
<img src={require("@site/static/img/showcase/wally.webp").default} />
<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.

19
website/i18n/de/docusaurus-plugin-content-docs/current/community/showcase/warmine.mdx Normal file
View file

@ -0,0 +1,19 @@
# Minecraft launcher for WarMine
```mdx-code-block
<p style={{ "text-align": "center" }}>
<img
src={require("@site/static/img/showcase/warmine1.png").default}
/>
<img
src={require("@site/static/img/showcase/warmine2.png").default}
/>
<br />
</p>
```
[Minecraft launcher for WarMine](https://warmine.ru/) is a Wails application, that allows you to easily join modded game servers and manage your game accounts.
The Launcher downloads the game files, checks their integrity and launches the game with a wide range of customization options for the launch arguments from the backend.
Frontend is written in Svelte, whole launcher fits in 9MB and supports Windows 7-11.

10
website/i18n/de/docusaurus-plugin-content-docs/current/community/showcase/wombat.mdx Normal file
View file

@ -0,0 +1,10 @@
# Wombat
```mdx-code-block
<p style={{ "text-align": "center" }}>
<img src={require("@site/static/img/showcase/wombat.webp").default} />
<br />
</p>
```
[Wombat](https://github.com/rogchap/wombat) is a cross platform gRPC client.

10
website/i18n/de/docusaurus-plugin-content-docs/current/community/showcase/ytd.mdx Normal file
View file

@ -0,0 +1,10 @@
# Ytd
```mdx-code-block
<p style={{ "text-align": "center" }}>
<img src={require("@site/static/img/showcase/ytd.webp").default} />
<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.

76
website/i18n/de/docusaurus-plugin-content-docs/current/community/templates.mdx Normal file
View file

@ -0,0 +1,76 @@
---
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](../guides/templates.mdx) 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) - Wails template based on Vue ecology (Integrated TypeScript, Dark theme, Internationalization, Single page routing, TailwindCSS)
- [wails-template-quasar-js](https://github.com/sgosiaco/wails-template-quasar-js) - A template using JavaScript + Quasar V2 (Vue 3, Vite, Sass, Pinia, ESLint, Prettier)
- [wails-template-quasar-ts](https://github.com/sgosiaco/wails-template-quasar-ts) - A template using TypeScript + Quasar V2 (Vue 3, Vite, Sass, Pinia, ESLint, Prettier, Composition API with &lt;script setup&gt;)
- [wails-template-naive](https://github.com/tk103331/wails-template-naive) - Wails template based on Naive UI (A Vue 3 Component Library)
- [wails-template-tdesign-js](https://github.com/tongque0/wails-template-tdesign-js) - Wails template based on TDesign UI (a Vue 3 UI library by Tencent), using Vite, Pinia, Vue Router, ESLint, and Prettier.
## Angular
- [wails-template-angular](https://github.com/mateothegreat/wails-template-angular) - Angular 15+ action packed & ready to roll to production.
- [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
- [wails-template-nextjs](https://github.com/LGiki/wails-template-nextjs) - A template using Next.js and TypeScript
- [wails-template-nextjs-app-router](https://github.com/thisisvk-in/wails-template-nextjs-app-router) - A template using Next.js and TypeScript with App router
- [wails-vite-react-ts-tailwind-template](https://github.com/hotafrika/wails-vite-react-ts-tailwind-template) - A template for React + TypeScript + Vite + TailwindCSS
- [wails-vite-react-ts-tailwind-shadcnui-template](https://github.com/Mahcks/wails-vite-react-tailwind-shadcnui-ts) - A template with Vite, React, TypeScript, TailwindCSS, and shadcn/ui
- [wails-nextjs-tailwind-template](https://github.com/kairo913/wails-nextjs-tailwind-template) - A template using Next.js and Typescript with TailwindCSS
## 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-ts-tailwind-template](https://github.com/xvertile/wails-vite-svelte-tailwind-template) - A template using Wails, Svelte, Vite, TypeScript, and TailwindCSS v3
- [wails-vite-svelte-tailwind-template](https://github.com/BillBuilt/wails-vite-svelte-tailwind-template) - A template using Svelte and Vite with TailwindCSS v3
- [wails-svelte-tailwind-vite-template](https://github.com/PylotLight/wails-vite-svelte-tailwind-template/tree/master) - An updated template using Svelte v4.2.0 and Vite with TailwindCSS v3.3.3
- [wails-sveltekit-template](https://github.com/h8gi/wails-sveltekit-template) - A template using SvelteKit
## Solid
- [wails-template-vite-solid-ts](https://github.com/xijaja/wails-template-solid-ts) - A template using Solid + Ts + Vite
- [wails-template-vite-solid-js](https://github.com/xijaja/wails-template-solid-js) - A template using Solid + Js + Vite
## Elm
- [wails-elm-template](https://github.com/benjamin-thomas/wails-elm-template) - Develop your GUI app with functional programming and a **snappy** hot-reload setup :tada: :rocket:
- [wails-template-elm-tailwind](https://github.com/rnice01/wails-template-elm-tailwind) - Combine the powers :muscle: of Elm + Tailwind CSS + Wails! Hot reloading supported.
## HTMX
- [wails-htmx-templ-chi-tailwind](https://github.com/PylotLight/wails-hmtx-templ-template) - Use a unique combination of pure htmx for interactivity plus templ for creating components and forms
## Pure JavaScript (Vanilla)
- [wails-pure-js-template](https://github.com/KiddoV/wails-pure-js-template) - A template with nothing but just basic JavaScript, HTML, and CSS
## Lit (web components)
- [wails-lit-shoelace-esbuild-template](https://github.com/Braincompiler/wails-lit-shoelace-esbuild-template) - Wails template providing frontend with lit, Shoelace component library + pre-configured prettier and typescript.

26
website/i18n/de/docusaurus-plugin-content-docs/current/gettingstarted/building.mdx Normal file
View file

@ -0,0 +1,26 @@
---
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.
:::info Linux
If you are using a Linux distribution that does not have webkit2gtk-4.0 (such as Ubuntu 24.04), you will need to add `-tags webkit2_41`.
:::
If you run the binary, you should see the default application:
```mdx-code-block
<div class="text--center">
<img
src={require("@site/static/img/defaultproject.webp").default}
width="50%"
class="screenshot"
/>
</div>
<br />
```
For more details on compilation options, please refer to the [CLI Reference](../reference/cli.mdx#build).

16
website/i18n/de/docusaurus-plugin-content-docs/current/gettingstarted/development.mdx Normal file
View file

@ -0,0 +1,16 @@
---
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
- Bind your Go code to the frontend so it can be called from JavaScript
- Using the power of [Vite](https://vitejs.dev/), will 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](../reference/cli.mdx#dev).
Coming soon: Tutorial

128
website/i18n/de/docusaurus-plugin-content-docs/current/gettingstarted/firstproject.mdx Normal file
View file

@ -0,0 +1,128 @@
---
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.
Pick your favourite framework:
```mdx-code-block
import Tabs from "@theme/Tabs";
import TabItem from "@theme/TabItem";
<Tabs
defaultValue="Svelte"
values={[
{label: "Svelte", value: "Svelte"},
{label: "React", value: "React"},
{label: "Vue", value: "Vue"},
{label: "Preact", value: "Preact"},
{label: "Lit", value: "Lit"},
{label: "Vanilla", value: "Vanilla"},
]}
>
<TabItem value="Svelte">
Generate a <a href={"https://svelte.dev/"}>Svelte</a> project using JavaScript with:<br/><br/>
wails init -n myproject -t svelte
If you would rather use TypeScript:<br/>
wails init -n myproject -t svelte-ts
</TabItem>
<TabItem value="React">
Generate a <a href={"https://reactjs.org/"}>React</a> project using JavaScript with:<br/><br/>
wails init -n myproject -t react
If you would rather use TypeScript:<br/>
wails init -n myproject -t react-ts
</TabItem>
<TabItem value="Vue">
Generate a <a href={"https://vuejs.org/"}>Vue</a> project using JavaScript with:<br/><br/>
wails init -n myproject -t vue
If you would rather use TypeScript:<br/>
wails init -n myproject -t vue-ts
</TabItem>
<TabItem value="Preact">
Generate a <a href={"https://preactjs.com/"}>Preact</a> project using JavaScript with:<br/><br/>
wails init -n myproject -t preact
If you would rather use TypeScript:<br/>
wails init -n myproject -t preact-ts
</TabItem>
<TabItem value="Lit">
Generate a <a href={"https://lit.dev/"}>Lit</a> project using JavaScript with:<br/><br/>
wails init -n myproject -t lit
If you would rather use TypeScript:<br/>
wails init -n myproject -t lit-ts
</TabItem>
<TabItem value="Vanilla">
Generate a Vanilla project using JavaScript with:<br/><br/>
wails init -n myproject -t vanilla
If you would rather use TypeScript:<br/>
wails init -n myproject -t vanilla-ts
</TabItem>
</Tabs>
```
<hr />
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](../reference/cli.mdx#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.

92
website/i18n/de/docusaurus-plugin-content-docs/current/gettingstarted/installation.mdx Normal file
View file

@ -0,0 +1,92 @@
---
sidebar_position: 1
---
# Installation
## Supported Platforms
- Windows 10/11 AMD64/ARM64
- MacOS 10.15+ AMD64 for development, MacOS 10.13+ for release
- MacOS 11.0+ ARM64
- Linux AMD64/ARM64
## Dependencies
Wails has a number of common dependencies that are required before installation:
- Go 1.21+ (macOS 15+ requires Go 1.23.3+)
- NPM (Node 15+)
### Go
Download Go from the [Go Downloads Page](https://go.dev/dl/).
Ensure that you follow the official [Go installation instructions](https://go.dev/doc/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:
```mdx-code-block
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 <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.
</TabItem>
<TabItem value={"Linux"}>
Linux requires 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.
<br/><strong>Note:</strong><br/>
If you are using latest Linux version (example: Ubuntu 24.04) and it is not supporting <code>libwebkit2gtk-4.0-dev</code>, then you might encounter an issue in <code>wails doctor</code>: <code>libwebkit</code> not found. To resolve this issue you can install <code>libwebkit2gtk-4.1-dev</code> and during your build use the tag <code>-tags webkit2_41</code>.
</TabItem>
</Tabs>
```
## Optional Dependencies
- [UPX](https://upx.github.io/) for compressing your applications.
- [NSIS](https://wails.io/docs/guides/windows-installer/) for generating Windows installers.
## Installing Wails
Run `go install github.com/wailsapp/wails/v2/cmd/wails@latest` to install the Wails CLI.
Note: If you get an error similar to this:
```shell
....\Go\pkg\mod\github.com\wailsapp\wails\v2@v2.1.0\pkg\templates\templates.go:28:12: pattern all:ides/*: no matching files found
```
please check you have Go 1.18+ installed:
```shell
go version
```
## 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.
## The `wails` command appears to be missing?
If your system is reporting that the `wails` command is missing, make sure you have followed the Go installation guide correctly. Normally, it means that the `go/bin` directory in your User's home directory is not in the `PATH` environment variable. You will also normally need to close and reopen any open command prompts so that changes to the environment made by the installer are reflected at the command prompt.

14
website/i18n/de/docusaurus-plugin-content-docs/current/guides/angular.mdx Normal file
View file

@ -0,0 +1,14 @@
# Angular
Whilst Wails does not have an Angular template, it is possible to use Angular with Wails.
## Dev Mode
To get dev mode working with Angular, you need to add the following to your `wails.json`:
```json
"frontend:build": "npx ng build",
"frontend:install": "npm install",
"frontend:dev:watcher": "npx ng serve",
"frontend:dev:serverUrl": "http://localhost:4200",
```

273
website/i18n/de/docusaurus-plugin-content-docs/current/guides/application-development.mdx Normal file
View file

@ -0,0 +1,273 @@
# 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](../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 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](../howdoesitwork.mdx#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.Sprintf("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).
### Dealing with context when binding multiple structs
If you want to bind methods for multiple structs but want each struct to keep a reference to the context so that you can use the runtime functions, a good pattern is to pass the context from the `OnStartup` method to your struct instances :
```go
func main() {
app := NewApp()
otherStruct := NewOtherStruct()
err := wails.Run(&options.App{
Title: "My App",
Width: 800,
Height: 600,
OnStartup: func(ctx context.Context){
app.SetContext(ctx)
otherStruct.SetContext(ctx)
},
OnShutdown: app.shutdown,
Bind: []interface{}{
app,
otherStruct
},
})
if err != nil {
log.Fatal(err)
}
}
```
Also you might want to use Enums in your structs and have models for them on frontend. In that case you should create array that will contain all possible enum values, instrument enum type and bind it to the app:
```go {16-18} title="app.go"
type Weekday string
const (
Sunday Weekday = "Sunday"
Monday Weekday = "Monday"
Tuesday Weekday = "Tuesday"
Wednesday Weekday = "Wednesday"
Thursday Weekday = "Thursday"
Friday Weekday = "Friday"
Saturday Weekday = "Saturday"
)
var AllWeekdays = []struct {
Value Weekday
TSName string
}{
{Sunday, "SUNDAY"},
{Monday, "MONDAY"},
{Tuesday, "TUESDAY"},
{Wednesday, "WEDNESDAY"},
{Thursday, "THURSDAY"},
{Friday, "FRIDAY"},
{Saturday, "SATURDAY"},
}
```
In the main application configuration, the `EnumBind` key is where we can tell Wails what we want to bind enums as well:
```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,
},
EnumBind: []interface{}{
AllWeekdays,
},
})
if err != nil {
log.Fatal(err)
}
}
```
This will add missing enums to your `model.ts` file.
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](../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.
```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`.
### AssetsHandler
A Wails v2 app can optionally define a `http.Handler` in the `options.App`, which allows hooking into the AssetServer to create files on the fly or process POST/PUT requests. GET requests are always first handled by the `assets` FS. If the FS doesn't find the requested file the request will be forwarded to the `http.Handler` for serving. Any requests other than GET will be directly processed by the `AssetsHandler` if specified. It's also possible to only use the `AssetsHandler` by specifying `nil` as the `Assets` option.
## 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/).
### Create React App
The process for a Create-React-App project is slightly more complicated. In order to support live frontend reloading the following configuration needs to be added to your `wails.json`:
```json
"frontend:dev:watcher": "yarn start",
"frontend:dev:serverUrl": "http://localhost:3000",
```
The `frontend:dev:watcher` command will start the Create-React-App development server (hosted on port `3000` typically). The `frontend:dev:serverUrl` command then instructs Wails to serve assets from the development server when loading the frontend rather than from the build folder. In addition to the above, the `index.html` needs to be updated with the following:
```html
<head>
<meta name="wails-options" content="noautoinject" />
<script src="/wails/ipc.js"></script>
<script src="/wails/runtime.js"></script>
</head>
```
This is required as the watcher command that rebuilds the frontend prevents Wails from injecting the required scripts. This circumvents that issue by ensuring the scripts are always injected. With this configuration, `wails dev` can be run which will appropriately build the frontend and backend with hot-reloading enabled. Additionally, when accessing the application from a browser the React developer tools can now be used on a non-minified version of the application for straightforward debugging. Finally, for faster builds, `wails dev -s` can be run to skip the default building of the frontend by Wails as this is an unnecessary step.
## 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.

66
website/i18n/de/docusaurus-plugin-content-docs/current/guides/crossplatform-build.mdx Normal file
View file

@ -0,0 +1,66 @@
# Crossplatform build with Github Actions
To build a Wails project for all the available platforms, you need to create an application build for each operating system. One effective method to achieve this is by utilizing GitHub Actions.
An action that facilitates building a Wails app is available at:
https://github.com/dAppServer/wails-build-action
In case the existing action doesn't fulfill your requirements, you can select only the necessary steps from the source:
https://github.com/dAppServer/wails-build-action/blob/main/action.yml
Below is a comprehensive example that demonstrates building an app upon the creation of a new Git tag and subsequently uploading it to the Actions artifacts:
```yaml
name: Wails build
on:
push:
tags:
# Match any new tag
- '*'
env:
# Necessary for most environments as build failure can occur due to OOM issues
NODE_OPTIONS: "--max-old-space-size=4096"
jobs:
build:
strategy:
# Failure in one platform build won't impact the others
fail-fast: false
matrix:
build:
- name: 'App'
platform: 'linux/amd64'
os: 'ubuntu-latest'
- name: 'App'
platform: 'windows/amd64'
os: 'windows-latest'
- name: 'App'
platform: 'darwin/universal'
os: 'macos-latest'
runs-on: ${{ matrix.build.os }}
steps:
- name: Checkout
uses: actions/checkout@v2
with:
submodules: recursive
- name: Build wails
uses: dAppServer/wails-build-action@v2.2
id: build
with:
build-name: ${{ matrix.build.name }}
build-platform: ${{ matrix.build.platform }}
package: false
go-version: '1.20'
```
This example offers opportunities for various enhancements, including:
- Caching dependencies
- Code signing
- Uploading to platforms like S3, Supabase, etc.
- Injecting secrets as environment variables
- Utilizing environment variables as build variables (such as version variable extracted from the current Git tag)

204
website/i18n/de/docusaurus-plugin-content-docs/current/guides/custom-protocol-schemes.mdx Normal file
View file

@ -0,0 +1,204 @@
# Custom Protocol Scheme association
Custom Protocols feature allows you to associate specific custom protocol with your app so that when users open links with this protocol,
your app is launched to handle them. This can be particularly useful to connect your desktop app with your web app.
In this guide, we'll walk through the steps to implement custom protocols in Wails app.
## Set Up Custom Protocol Schemes Association:
To set up custom protocol, you need to modify your application's wails.json file.
In "info" section add a "protocols" section specifying the protocols your app should be associated with.
For example:
```json
{
"info": {
"protocols": [
{
"scheme": "myapp",
"description": "My App Protocol",
"role": "Editor"
}
]
}
}
```
| Property | Description |
| :---------- | :------------------------------------------------------------------------------------ |
| scheme | Custom Protocol scheme. e.g. myapp |
| description | Windows-only. The description. |
| role | macOS-only. The app’s role with respect to the type. Corresponds to CFBundleTypeRole. |
## Platform Specifics:
### macOS
When you open custom protocol with your app, the system will launch your app and call the `OnUrlOpen` function in your Wails app. Example:
```go title="main.go"
func main() {
// Create application with options
err := wails.Run(&options.App{
Title: "wails-open-file",
Width: 1024,
Height: 768,
AssetServer: &assetserver.Options{
Assets: assets,
},
BackgroundColour: &options.RGBA{R: 27, G: 38, B: 54, A: 1},
Mac: &mac.Options{
OnUrlOpen: func(url string) { println(url) },
},
Bind: []interface{}{
app,
},
})
if err != nil {
println("Error:", err.Error())
}
}
```
### Windows
On Windows Custom Protocol Schemes is supported only with NSIS installer. During installation, the installer will create a
registry entry for your schemes. When you open url with your app, new instance of app is launched and url is passed
as argument to your app. To handle this you should parse command line arguments in your app. Example:
```go title="main.go"
func main() {
argsWithoutProg := os.Args[1:]
if len(argsWithoutProg) != 0 {
println("launchArgs", argsWithoutProg)
}
}
```
You also can enable single instance lock for your app. In this case, when you open url with your app, new instance of app is not launched
and arguments are passed to already running instance. Check single instance lock guide for details. Example:
```go title="main.go"
func main() {
// Create application with options
err := wails.Run(&options.App{
Title: "wails-open-file",
Width: 1024,
Height: 768,
AssetServer: &assetserver.Options{
Assets: assets,
},
BackgroundColour: &options.RGBA{R: 27, G: 38, B: 54, A: 1},
SingleInstanceLock: &options.SingleInstanceLock{
UniqueId: "e3984e08-28dc-4e3d-b70a-45e961589cdc",
OnSecondInstanceLaunch: app.onSecondInstanceLaunch,
},
Bind: []interface{}{
app,
},
})
}
```
### Linux
Currently, Wails doesn't support bundling for Linux. So, you need to create file associations manually.
For example if you distribute your app as a .deb package, you can create file associations by adding required files in you bundle.
You can use [nfpm](https://nfpm.goreleaser.com/) to create .deb package for your app.
1. Create a .desktop file for your app and specify file associations there (note that `%u` is important in Exec). Example:
```ini
[Desktop Entry]
Categories=Office
Exec=/usr/bin/wails-open-file %u
Icon=wails-open-file.png
Name=wails-open-file
Terminal=false
Type=Application
MimeType=x-scheme-handler/myapp;
```
2. Prepare postInstall/postRemove scripts for your package. Example:
```sh
# reload desktop database to load app in list of available
update-desktop-database /usr/share/applications
```
3. Configure nfpm to use your scripts and files. Example:
```yaml
name: "wails-open-file"
arch: "arm64"
platform: "linux"
version: "1.0.0"
section: "default"
priority: "extra"
maintainer: "FooBarCorp <FooBarCorp@gmail.com>"
description: "Sample Package"
vendor: "FooBarCorp"
homepage: "http://example.com"
license: "MIT"
contents:
- src: ../bin/wails-open-file
dst: /usr/bin/wails-open-file
- src: ./main.desktop
dst: /usr/share/applications/wails-open-file.desktop
- src: ../appicon.svg
dst: /usr/share/icons/hicolor/scalable/apps/wails-open-file.svg
# copy icons to Yaru theme as well. For some reason Ubuntu didn't pick up fileicons from hicolor theme
- src: ../appicon.svg
dst: /usr/share/icons/Yaru/scalable/apps/wails-open-file.svg
scripts:
postinstall: ./postInstall.sh
postremove: ./postRemove.sh
```
6. Build your .deb package using nfpm:
```sh
nfpm pkg --packager deb --target .
```
7. Now when your package is installed, your app will be associated with custom protocol scheme. When you open url with your app,
new instance of app is launched and file path is passed as argument to your app.
To handle this you should parse command line arguments in your app. Example:
```go title="main.go"
func main() {
argsWithoutProg := os.Args[1:]
if len(argsWithoutProg) != 0 {
println("launchArgs", argsWithoutProg)
}
}
```
You also can enable single instance lock for your app. In this case, when you open url with your app, new instance of app is not launched
and arguments are passed to already running instance. Check single instance lock guide for details. Example:
```go title="main.go"
func main() {
// Create application with options
err := wails.Run(&options.App{
Title: "wails-open-file",
Width: 1024,
Height: 768,
AssetServer: &assetserver.Options{
Assets: assets,
},
BackgroundColour: &options.RGBA{R: 27, G: 38, B: 54, A: 1},
SingleInstanceLock: &options.SingleInstanceLock{
UniqueId: "e3984e08-28dc-4e3d-b70a-45e961589cdc",
OnSecondInstanceLaunch: app.onSecondInstanceLaunch,
},
Bind: []interface{}{
app,
},
})
}
```

142
website/i18n/de/docusaurus-plugin-content-docs/current/guides/dynamic-assets.mdx Normal file
View file

@ -0,0 +1,142 @@
# Dynamic Assets
:::info
This does not work with vite v5.0.0+ and wails v2 due to changes in vite. Changes are planned in v3 to support similar functionality under vite v5.0.0+. If you need this feature, stay with vite v4.0.0+. See [issue 3240](https://github.com/wailsapp/wails/issues/3240) for details
:::
If you want to load or generate assets for your frontend dynamically, you can achieve that using the [AssetsHandler](../reference/options#assetshandler) option. The AssetsHandler is a generic `http.Handler` which will be called for any non GET request on the assets server and for GET requests which can not be served from the bundled assets because the file is not found.
By installing a custom AssetsHandler, you can serve your own assets using a custom asset server.
## Example
In our example project, we will create a simple assets handler which will load files off disk:
```go title=main.go {17-36,49}
package main
import (
"embed"
"fmt"
"github.com/wailsapp/wails/v2"
"github.com/wailsapp/wails/v2/pkg/options"
"github.com/wailsapp/wails/v2/pkg/options/assetserver"
"net/http"
"os"
"strings"
)
//go:embed all:frontend/dist
var assets embed.FS
type FileLoader struct {
http.Handler
}
func NewFileLoader() *FileLoader {
return &FileLoader{}
}
func (h *FileLoader) ServeHTTP(res http.ResponseWriter, req *http.Request) {
var err error
requestedFilename := strings.TrimPrefix(req.URL.Path, "/")
println("Requesting file:", requestedFilename)
fileData, err := os.ReadFile(requestedFilename)
if err != nil {
res.WriteHeader(http.StatusBadRequest)
res.Write([]byte(fmt.Sprintf("Could not load file %s", requestedFilename)))
}
res.Write(fileData)
}
func main() {
// Create an instance of the app structure
app := NewApp()
// Create application with options
err := wails.Run(&options.App{
Title: "helloworld",
Width: 1024,
Height: 768,
AssetServer: &assetserver.Options{
Assets: assets,
Handler: NewFileLoader(),
},
BackgroundColour: &options.RGBA{R: 27, G: 38, B: 54, A: 255},
OnStartup: app.startup,
Bind: []interface{}{
app,
},
})
if err != nil {
println("Error:", err)
}
}
```
When we run the application in dev mode using `wails dev`, we will see the following output:
```
DEB | [ExternalAssetHandler] Loading 'http://localhost:3001/favicon.ico'
DEB | [ExternalAssetHandler] Loading 'http://localhost:3001/favicon.ico' failed, using AssetHandler
Requesting file: favicon.ico
```
As you can see, the assets handler is called when the default assets server is unable to serve the `favicon.ico` file.
If you right click the main application and select "inspect" to bring up the devtools, you can test this feature out by typing the following into the console:
```
let response = await fetch('does-not-exist.txt');
```
This will generate an error in the devtools. We can see that the error is what we expect, returned by our custom assets handler:
```mdx-code-block
<p className="text--center">
<img
src={require("@site/static/img/assetshandler-does-not-exist.webp").default}
/>
</p>
```
However, if we request `go.mod`, we will see the following output:
```mdx-code-block
<p className="text--center">
<img src={require("@site/static/img/assetshandler-go-mod.webp").default} />
</p>
```
This technique can be used to load images directly into the page. If we updated our default vanilla template and replaced the logo image:
```html
<img id="logo" class="logo" />
```
with:
```html
<img src="build/appicon.png" style="width: 300px" />
```
Then we would see the following:
```mdx-code-block
<p className="text--center">
<img
src={require("@site/static/img/assetshandler-image.webp").default}
style={{ width: "75%" }}
/>
</p>
```
:::warning
Exposing your filesystem in this way is a security risk. It is recommended that you properly manage access to your filesystem.
:::

244
website/i18n/de/docusaurus-plugin-content-docs/current/guides/file-association.mdx Normal file
View file

@ -0,0 +1,244 @@
# File Association
File association feature allows you to associate specific file types with your app so that when users open those files,
your app is launched to handle them. This can be particularly useful for text editors, image viewers, or any application
that works with specific file formats. In this guide, we'll walk through the steps to implement file association in Wails app.
## Set Up File Association:
To set up file association, you need to modify your application's wails.json file.
In "info" section add a "fileAssociations" section specifying the file types your app should be associated with.
For example:
```json
{
"info": {
"fileAssociations": [
{
"ext": "wails",
"name": "Wails",
"description": "Wails Application File",
"iconName": "wailsFileIcon",
"role": "Editor"
},
{
"ext": "jpg",
"name": "JPEG",
"description": "Image File",
"iconName": "jpegFileIcon",
"role": "Editor"
}
]
}
}
```
| Property | Description |
| :---------- | :------------------------------------------------------------------------------------------------------------------------------------------------- |
| ext | The extension (minus the leading period). e.g. png |
| name | The name. e.g. PNG File |
| iconName | The icon name without extension. Icons should be located in build folder. Proper icons will be generated from .png file for both macOS and Windows |
| description | Windows-only. The description. It is displayed on the `Type` column on Windows Explorer. |
| role | macOS-only. The app’s role with respect to the type. Corresponds to CFBundleTypeRole. |
## Platform Specifics:
### macOS
When you open file (or files) with your app, the system will launch your app and call the `OnFileOpen` function in your Wails app. Example:
```go title="main.go"
func main() {
// Create application with options
err := wails.Run(&options.App{
Title: "wails-open-file",
Width: 1024,
Height: 768,
AssetServer: &assetserver.Options{
Assets: assets,
},
BackgroundColour: &options.RGBA{R: 27, G: 38, B: 54, A: 1},
Mac: &mac.Options{
OnFileOpen: func(filePaths []string) { println(filestring) },
},
Bind: []interface{}{
app,
},
})
if err != nil {
println("Error:", err.Error())
}
}
```
### Windows
On Windows file association is supported only with NSIS installer. During installation, the installer will create a
registry entry for your file associations. When you open file with your app, new instance of app is launched and file path is passed
as argument to your app. To handle this you should parse command line arguments in your app. Example:
```go title="main.go"
func main() {
argsWithoutProg := os.Args[1:]
if len(argsWithoutProg) != 0 {
println("launchArgs", argsWithoutProg)
}
}
```
You also can enable single instance lock for your app. In this case, when you open file with your app, new instance of app is not launched
and arguments are passed to already running instance. Check single instance lock guide for details. Example:
```go title="main.go"
func main() {
// Create application with options
err := wails.Run(&options.App{
Title: "wails-open-file",
Width: 1024,
Height: 768,
AssetServer: &assetserver.Options{
Assets: assets,
},
BackgroundColour: &options.RGBA{R: 27, G: 38, B: 54, A: 1},
SingleInstanceLock: &options.SingleInstanceLock{
UniqueId: "e3984e08-28dc-4e3d-b70a-45e961589cdc",
OnSecondInstanceLaunch: app.onSecondInstanceLaunch,
},
Bind: []interface{}{
app,
},
})
}
```
### Linux
Currently, Wails doesn't support bundling for Linux. So, you need to create file associations manually.
For example if you distribute your app as a .deb package, you can create file associations by adding required files in you bundle.
You can use [nfpm](https://nfpm.goreleaser.com/) to create .deb package for your app.
1. Create a .desktop file for your app and specify file associations there. Example:
```ini
[Desktop Entry]
Categories=Office
Exec=/usr/bin/wails-open-file %u
Icon=wails-open-file.png
Name=wails-open-file
Terminal=false
Type=Application
MimeType=application/x-wails;application/x-test
```
2. Create mime types file. Example:
```xml
<?xml version="1.0" encoding="UTF-8"?>
<mime-info xmlns="http://www.freedesktop.org/standards/shared-mime-info">
<mime-type type="application/x-wails">
<comment>Wails Application File</comment>
<glob pattern="*.wails"/>
</mime-type>
</mime-info>
```
3. Create icons for your file types. SVG icons are recommended.
4. Prepare postInstall/postRemove scripts for your package. Example:
```sh
# reload mime types to register file associations
update-mime-database /usr/share/mime
# reload desktop database to load app in list of available
update-desktop-database /usr/share/applications
# update icons
update-icon-caches /usr/share/icons/*
```
5. Configure nfpm to use your scripts and files. Example:
```yaml
name: "wails-open-file"
arch: "arm64"
platform: "linux"
version: "1.0.0"
section: "default"
priority: "extra"
maintainer: "FooBarCorp <FooBarCorp@gmail.com>"
description: "Sample Package"
vendor: "FooBarCorp"
homepage: "http://example.com"
license: "MIT"
contents:
- src: ../bin/wails-open-file
dst: /usr/bin/wails-open-file
- src: ./main.desktop
dst: /usr/share/applications/wails-open-file.desktop
- src: ./application-wails-mime.xml
dst: /usr/share/mime/packages/application-x-wails.xml
- src: ./application-test-mime.xml
dst: /usr/share/mime/packages/application-x-test.xml
- src: ../appicon.svg
dst: /usr/share/icons/hicolor/scalable/apps/wails-open-file.svg
- src: ../wailsFileIcon.svg
dst: /usr/share/icons/hicolor/scalable/mimetypes/application-x-wails.svg
- src: ../testFileIcon.svg
dst: /usr/share/icons/hicolor/scalable/mimetypes/application-x-test.svg
# copy icons to Yaru theme as well. For some reason Ubuntu didn't pick up fileicons from hicolor theme
- src: ../appicon.svg
dst: /usr/share/icons/Yaru/scalable/apps/wails-open-file.svg
- src: ../wailsFileIcon.svg
dst: /usr/share/icons/Yaru/scalable/mimetypes/application-x-wails.svg
- src: ../testFileIcon.svg
dst: /usr/share/icons/Yaru/scalable/mimetypes/application-x-test.svg
scripts:
postinstall: ./postInstall.sh
postremove: ./postRemove.sh
```
6. Build your .deb package using nfpm:
```sh
nfpm pkg --packager deb --target .
```
7. Now when your package is installed, your app will be associated with specified file types. When you open file with your app,
new instance of app is launched and file path is passed as argument to your app.
To handle this you should parse command line arguments in your app. Example:
```go title="main.go"
func main() {
argsWithoutProg := os.Args[1:]
if len(argsWithoutProg) != 0 {
println("launchArgs", argsWithoutProg)
}
}
```
You also can enable single instance lock for your app. In this case, when you open file with your app, new instance of app is not launched
and arguments are passed to already running instance. Check single instance lock guide for details. Example:
```go title="main.go"
func main() {
// Create application with options
err := wails.Run(&options.App{
Title: "wails-open-file",
Width: 1024,
Height: 768,
AssetServer: &assetserver.Options{
Assets: assets,
},
BackgroundColour: &options.RGBA{R: 27, G: 38, B: 54, A: 1},
SingleInstanceLock: &options.SingleInstanceLock{
UniqueId: "e3984e08-28dc-4e3d-b70a-45e961589cdc",
OnSecondInstanceLaunch: app.onSecondInstanceLaunch,
},
Bind: []interface{}{
app,
},
})
}
```

87
website/i18n/de/docusaurus-plugin-content-docs/current/guides/frameless.mdx Normal file
View file

@ -0,0 +1,87 @@
# Frameless Applications
Wails supports application that have no frames. 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 CSS style `--wails-draggable:drag` will act as a "drag handle". This property applies to all child elements. If you need to indicate that a nested element should not drag, then use the attribute '--wails-draggable:no-drag' on that element.
```html
<html>
<head>
<link rel="stylesheet" href="/main.css" />
</head>
<body style="--wails-draggable:drag">
<div id="logo"></div>
<div id="input" style="--wails-draggable:no-drag">
<input id="name" type="text" />
<button onclick="greet()">Greet</button>
</div>
<div id="result"></div>
<script src="/main.js"></script>
</body>
</html>
```
For some projects, using a CSS variable may not be possible due to dynamic styling. In this case, you can use the `CSSDragProperty` and `CSSDragValue` application options to define a property and value that will be used to indicate draggable regions:
```go title=main.go
package main
import (
"embed"
"github.com/wailsapp/wails/v2"
"github.com/wailsapp/wails/v2/pkg/options"
"github.com/wailsapp/wails/v2/pkg/options/assetserver"
)
//go:embed all:frontend/dist
var assets embed.FS
func main() {
// Create an instance of the app structure
app := NewApp()
// Create application with options
err := wails.Run(&options.App{
Title: "alwaysontop",
Width: 1024,
Height: 768,
AssetServer: &assetserver.Options{
Assets: assets,
},
Frameless: true,
CSSDragProperty: "widows",
CSSDragValue: "1",
Bind: []interface{}{
app,
},
})
if err != nil {
println("Error:", err)
}
}
```
```html title=index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta content="width=device-width, initial-scale=1.0" name="viewport" />
<title>alwaysontop</title>
</head>
<body style="widows: 1">
<div id="app"></div>
<script src="./src/main.js" type="module"></script>
</body>
</html>
```
:::info Fullscreen
If you allow your application to go fullscreen, this drag functionality will be disabled.
:::

72
website/i18n/de/docusaurus-plugin-content-docs/current/guides/frontend.mdx Normal file
View file

@ -0,0 +1,72 @@
# Frontend
## Script Injection
When Wails serves your `index.html`, by default, it will inject 2 script entries into the `<body>` tag to load `/wails/ipc.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 separated.
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>
```

127
website/i18n/de/docusaurus-plugin-content-docs/current/guides/ides.mdx Normal file
View file

@ -0,0 +1,127 @@
# 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/) and [Goland](https://www.jetbrains.com/go/).
## Visual Studio Code
```mdx-code-block
<p className="text--center">
<img
src={require("@site/static/img/vscode.webp").default}
style={{ width: "75%" }}
/>
</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.
:::

103
website/i18n/de/docusaurus-plugin-content-docs/current/guides/linux-distro-support.mdx Normal file
View file

@ -0,0 +1,103 @@
# Linux Distro Support
## Overview
Wails offers Linux support but providing installation instructions for all available distributions is an impossible task. Instead, Wails tries to determine if the packages you need to develop applications are available via your system's package manager. Currently, we support the following package managers:
- apt
- dnf
- emerge
- eopkg
- nixpkgs
- pacman
- zypper
## Adding package names
There may be circumstances where your distro uses one of the supported package managers but the package name is different. For example, you may use an Ubuntu derivative, but the package name for gtk may be different. Wails attempts to find the correct package by iterating through a list of package names. The list of packages are stored in the packagemanager specific file in the `v2/internal/system/packagemanager` directory. In our example, this would be `v2/internal/system/packagemanager/apt.go`.
In this file, the list of packages are defined by the `Packages()` method:
```go
func (a *Apt) Packages() packagemap {
return packagemap{
"libgtk-3": []*Package{
{Name: "libgtk-3-dev", SystemPackage: true, Library: true},
},
"libwebkit": []*Package{
{Name: "libwebkit2gtk-4.0-dev", SystemPackage: true, Library: true},
},
"gcc": []*Package{
{Name: "build-essential", SystemPackage: true},
},
"pkg-config": []*Package{
{Name: "pkg-config", SystemPackage: true},
},
"npm": []*Package{
{Name: "npm", SystemPackage: true},
},
"docker": []*Package{
{Name: "docker.io", SystemPackage: true, Optional: true},
},
}
}
```
Let's assume that in our linux distro, `libgtk-3` is packaged under the name `lib-gtk3-dev`. We could add support for this by adding the following line:
```go {5}
func (a *Apt) Packages() packagemap {
return packagemap{
"libgtk-3": []*Package{
{Name: "libgtk-3-dev", SystemPackage: true, Library: true},
{Name: "lib-gtk3-dev", SystemPackage: true, Library: true},
},
"libwebkit": []*Package{
{Name: "libwebkit2gtk-4.0-dev", SystemPackage: true, Library: true},
},
"gcc": []*Package{
{Name: "build-essential", SystemPackage: true},
},
"pkg-config": []*Package{
{Name: "pkg-config", SystemPackage: true},
},
"npm": []*Package{
{Name: "npm", SystemPackage: true},
},
"docker": []*Package{
{Name: "docker.io", SystemPackage: true, Optional: true},
},
}
}
```
## Adding new package managers
To add a new package manager, perform the following steps:
- Create a new file in `v2/internal/system/packagemanager` called `<pm>.go`, where `<pm>` is the name of the package manager.
- Define a struct that conforms to the package manager interface defined in `pm.go`:
```go
type PackageManager interface {
Name() string
Packages() packagemap
PackageInstalled(*Package) (bool, error)
PackageAvailable(*Package) (bool, error)
InstallCommand(*Package) string
}
```
- `Name()` should return the name of the package manager
- `Packages()` should return a `packagemap`, that provides candidate filenames for dependencies
- `PackageInstalled()` should return `true` if the given package is installed
- `PackageAvailable()` should return `true` if the given package is not installed but available for installation
- `InstallCommand()` should return the exact command to install the given package name
Take a look at the other package managers code to get an idea how this works.
:::info Remember
If you add support for a new package manager, don't forget to also update this page!
:::

70
website/i18n/de/docusaurus-plugin-content-docs/current/guides/linux.mdx Normal file
View file

@ -0,0 +1,70 @@
# Linux
This page has miscellaneous guides related to developing Wails applications for Linux.
## Video tag doesn't fire "ended" event
When using a video tag, the "ended" event is not fired when the video is finished playing. This is a bug in WebkitGTK, however you can use the following workaround to fix it:
```js
videoTag.addEventListener("timeupdate", (event) => {
if (event.target.duration - event.target.currentTime < 0.2) {
let ended = new Event("ended");
event.target.dispatchEvent(ended);
}
});
```
Source: [Lyimmi](https://github.com/Lyimmi) on the [discussions board](https://github.com/wailsapp/wails/issues/1729#issuecomment-1212291275)
## GStreamer error when using Audio or Video elements
If you are seeing the following error when including `<Audio>` or `<Video>` elements on Linux, you may need to install `gst-plugins-good`.
```
GStreamer element autoaudiosink not found. Please install it
```
### Installing
Run the following distro relevant install command:
```mdx-code-block
import Tabs from "@theme/Tabs";
import TabItem from "@theme/TabItem";
<Tabs
defaultValue="Arch"
values={[
{ label: "Arch", value: "Arch" },
{ label: "Debian/Ubuntu", value: "Debian" },
{ label: "Fedora", value: "Fedora" },
]}
>
<TabItem value="Arch">
pacman -S gst-plugins-good
</TabItem>
<TabItem value="Debian">
apt-get install gstreamer1.0-plugins-good
</TabItem>
<TabItem value="Fedora">
dnf install gstreamer1-plugins-good
</TabItem>
</Tabs>
```
If the added package does not resolve the issue, additional GStreamer dependencies may be required. [See the GStreamer installation page for more details.](https://gstreamer.freedesktop.org/documentation/installing/on-linux.html)
### Additional Notes
- This issue is caused by [an upstream issue with WebkitGTK](https://bugs.webkit.org/show_bug.cgi?id=146351).
- [Arch based systems](https://wiki.archlinux.org/title/Arch-based_distributions) seem to have this issue more often than other distributions.
- This issue impacts [Tauri apps](https://tauri.app/).
Source: [developomp](https://github.com/developomp) on the [Tauri discussion board](https://github.com/tauri-apps/tauri/issues/4642#issuecomment-1643229562).

55
website/i18n/de/docusaurus-plugin-content-docs/current/guides/local-development.mdx Normal file
View file

@ -0,0 +1,55 @@
# Local Development
## 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.
### Updating your project
To update projects to use the latest version of the Wails library, 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 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`
- `cd wails`
- `git checkout -b branch-to-test --track origin/branch-to-test`
- `cd v2/cmd/wails`
- `go install`
Make sure you [update your project](#updating-your-project) as described above.
## Testing a PR
If you want to test a PR, follow the instructions above, but ensure you fetch the PR and switch the branch before installing. Please replace `[IDofThePR]` with the ID of the PR shown on github.com:
- `git clone https://github.com/wailsapp/wails`
- `cd wails`
- `git fetch -u origin pull/[IDofThePR]/head:test/pr-[IDofThePR]`
- `git checkout test/pr-[IDofThePR]`
- `git reset --hard HEAD`
- `cd v2/cmd/wails`
- `go install`
Make sure you [update your project](#updating-your-project) as described above.

97
website/i18n/de/docusaurus-plugin-content-docs/current/guides/mac-appstore.mdx Normal file
View file

@ -0,0 +1,97 @@
# Mac App Store Guide
This page gives a brief overview of how to submit your Wails App to the Mac App Store.
## Prerequisites
- You will need to have an Apple Developer account. Please find more information on the [Apple Developer Program](https://developer.apple.com/support/compare-memberships/) site
- You will need to have your Certificates, Identifiers, and App created on the developer portal. More on this below
- Xcode command line tools will need to be installed on your local machine
#### Create Certificates and Identifiers
1. Go to your [Apple Developer Account](https://developer.apple.com/account/)
2. Under `Certificates, Identifiers & Profiles`, click `Identifiers` and Register a New App ID. Use the format (com.example.app)
3. Under the same page click `Certificates` and generate new Certificates for Mac App Store Distribution. Download them and import the certificates into Keychain on your local machine.
#### Create App Submission
1. Go to the [App Store Connect Site](https://appstoreconnect.apple.com/apps)
2. Register a new application and link the bundle ID that you created in the previous step
3. Populate your app with the correct screen shots, descriptions, etc. as required by Apple
4. Create a new version of your app
#### Create Provisioning Profile
1. Go to the [Apple Developer Profiles](https://developer.apple.com/account/resources/profiles/list) page
2. Add a new provisioning profile for Mac App Store Distribution
3. Set the Profile Type as Mac and select the App ID for the application created above
4. Select the Mac App Distribution certificate
5. Name the Provisioning Profile embedded and download the created profile.
## Mac App Store Process
#### Enable Apple's App Sandbox
Apps submitted to the Mac App Store must run under Apple's [App Sandbox](https://developer.apple.com/app-sandboxing/). You must create an `entitlements.plist` file for this to work. The recommendation is to create this file under this path `{PROJECT_DIR}/build/darwin/entitlements.plist`.
**Example Entitlements File**
This is an example entitlements file from the [RiftShare](https://github.com/achhabra2/riftshare) app. For reference please put in the entitlements your app requires. Refer to [this site](https://developer.apple.com/documentation/bundleresources/entitlements) for more information. You will need to replace the Team ID and Application Name with the ones you registered above.
```xml title="entitlements.plist"
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
<plist version="1.0">
<dict>
<key>com.apple.security.app-sandbox</key>
<true/>
<key>com.apple.security.network.client</key>
<true/>
<key>com.apple.security.network.server</key>
<true/>
<key>com.apple.security.files.user-selected.read-write</key>
<true/>
<key>com.apple.security.files.downloads.read-write</key>
<true/>
<key>com.apple.application-identifier</key>
<string>TEAM_ID.APP_NAME</string>
<key>com.apple.developer.team-identifier</key>
<string>TEAM_ID</string>
</dict>
</plist>
```
**Add the Embedded Provisioning Profile** The Provisioning Profile created above needs to be added to the root of the application. It needs to be named embedded.provisionprofile.
#### Build and Sign the App Package
The following is an example script for building and signing your app for Mac App Store submission. It assumes you are running the script from your root project directory.
Note the certificates for signing the app and signing the installer are different. Please make sure both are imported into Keychain. Find the strings in Keychain and insert them below. Populate your certificate names, and app name below. Running the following script will generate a signed `app.pkg` file in the root directory of your app.
```bash title="macappstore-build.sh"
#!/bin/bash
APP_CERTIFICATE="3rd Party Mac Developer Application: YOUR NAME (CODE)"
PKG_CERTIFICATE="3rd Party Mac Developer Installer: YOUR NAME (CODE)"
APP_NAME="YourApp"
wails build -platform darwin/universal -clean
cp ./embedded.provisionprofile "./build/bin/$APP_NAME.app/Contents"
codesign --timestamp --options=runtime -s "$APP_CERTIFICATE" -v --entitlements ./build/darwin/entitlements.plist "./build/bin/$APP_NAME.app"
productbuild --sign "$PKG_CERTIFICATE" --component "./build/bin/$APP_NAME.app" /Applications "./$APP_NAME.pkg"
```
#### Upload App Bundle
You will need to upload the generated package file and associate it to your Application before you will be able to submit it for review.
1. Download the [Transporter App](https://apps.apple.com/us/app/transporter/id1450874784) from the Mac App Store
2. Open it and sign in with your Apple ID
3. Click the + sign and select the `APP_NAME.pkg` file that you generated in the previous step. Upload it
4. Go back to the [App Store Connect](https://appstoreconnect.apple.com/apps) site and navigate back into your app submission. Select the version that you are ready to make available on the App Store. Under `Build` select the package that you uploaded via Transporter.
That's it! You can now use the site to submit your App for review. After a few business days if all goes well you should see your App live on the Mac App Store.

95
website/i18n/de/docusaurus-plugin-content-docs/current/guides/manual-builds.mdx Normal file
View file

@ -0,0 +1,95 @@
# 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.

191
website/i18n/de/docusaurus-plugin-content-docs/current/guides/migrating.mdx Normal file
View file

@ -0,0 +1,191 @@
# 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](../reference/options.mdx#application-options).
```go title="v2"
err := wails.Run(&options.App{
Title: "MyApp",
Width: 800,
Height: 600,
AssetServer: &assetserver.Options{
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](../reference/options.mdx#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](../reference/options.mdx#application-options):
- [OnStartup](../reference/options.mdx#onstartup)
- [OnShutdown](../reference/options.mdx#onshutdown)
- [OnDomReady](../reference/options.mdx#ondomready)
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:
```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 to the [Runtime Reference](../reference/runtime/intro.mdx).
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](../reference/options.mdx#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 all:frontend/dist
var assets embed.FS
func main() {
err := wails.Run(&options.App{
/* Other Options */
AssetServer: &assetserver.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](../reference/options.mdx#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>

25
website/i18n/de/docusaurus-plugin-content-docs/current/guides/mouse-buttons.mdx Normal file
View file

@ -0,0 +1,25 @@
# Mouse Buttons
The Wails runtime intercepts mouse clicks to determine whether a frameless window needs resizing or a window needs to be moved. It has been asked how to detect when a mouse click has occurred, because `window.onclick` doesn't report the mouse buttons correctly. The following code shows how to detect mouse clicks:
```javascript
window.addEventListener("mousedown", handleMouseButtonDown);
function handleMouseButtonDown(event) {
if (event.button === 0) {
// left mouse button
} else if (event.button === 1) {
// middle mouse button
} else if (event.button === 2) {
// right mouse button
} else if (event.button === 3) {
// back mouse button
} else if (event.button === 4) {
// forward mouse button
} else {
// other mouse button
}
}
```
Reference: https://developer.mozilla.org/en-US/docs/Web/API/MouseEvent/button

10
website/i18n/de/docusaurus-plugin-content-docs/current/guides/nixos-font.mdx Normal file
View file

@ -0,0 +1,10 @@
# NixOS FontSize Bug
NixOS/Wayland can cause a bug where the `font-size` css property doesn't affect the rendered page. To fix this add the following to your devShell.
```shell
shellHook = with pkgs; ''
export XDG_DATA_DIRS=${gsettings-desktop-schemas}/share/gsettings-schemas/${gsettings-desktop-schemas.name}:${gtk3}/share/gsettings-schemas/${gtk3.name}:$XDG_DATA_DIRS;
export GIO_MODULE_DIR="${pkgs.glib-networking}/lib/gio/modules/";
'';
```

40
website/i18n/de/docusaurus-plugin-content-docs/current/guides/obfuscated.mdx Normal file
View file

@ -0,0 +1,40 @@
# Obfuscated Builds
Wails includes support for obfuscating your application using [garble](https://github.com/burrowers/garble).
To produce an obfuscated build, you can use the `-obfuscate` flag with the `wails build` command:
```bash
wails build -obfuscated
```
To customise the obfuscation settings, you can use the `-garbleargs` flag:
```bash
wails build -obfuscated -garbleargs "-literals -tiny -seed=myrandomseed"
```
These settings may be persisted in your [project config](../reference/project-config.mdx).
## How it works
In a standard build, all bound methods are available in the frontend under the `window.go` variable. When these methods are called, the corresponding backend method is called using the fully qualified function name. When using an obfuscated build, methods are bound using an ID instead of a name. The bindings generated in the `wailsjs` directory use these IDs to call the backend functions.
:::note
To ensure that your application will work in obfuscated mode, you must use the generated bindings under the `wailsjs` directory in your application.
:::
## Example
Importing the "Greet" method from the bindings like this:
```js
import { Greet } from "../../wailsjs/go/main/App";
// snip
Greet("World");
```
will ensure that the method will work correctly in obfuscated mode, as the bindings will be regenerated with IDs and the call mechanism updated.

10
website/i18n/de/docusaurus-plugin-content-docs/current/guides/overscroll.mdx Normal file
View file

@ -0,0 +1,10 @@
# 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
html {
height: 100%;
overflow: hidden;
}
```

68
website/i18n/de/docusaurus-plugin-content-docs/current/guides/routing.mdx Normal file
View file

@ -0,0 +1,68 @@
# 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 });
```
## React
The recommended approach for routing in React is [HashRouter](https://reactrouter.com/en/main/router-components/hash-router):
```jsx
import { HashRouter, Routes, Route } from "react-router-dom";
ReactDOM.render(
<HashRouter basename={"/"}>
{/* The rest of your app goes here */}
<Routes>
<Route path="/" element={<Page0 />} exact />
<Route path="/page1" element={<Page1 />} />
<Route path="/page2" element={<Page2 />} />
{/* more... */}
</Routes>
</HashRouter>,
root
);
```
## Svelte
The recommended approach for routing in Svelte is [svelte-spa-router](https://github.com/ItalyPaleAle/svelte-spa-router):
```svelte
<script>
import Router from "svelte-spa-router";
</script>
<Router
routes={{
"/": Home,
"/products": wrap({
asyncComponent: () => import("./routes/Products.svelte"),
}),
"/settings": Settings,
"*": NotFound,
}}
/>
```

401
website/i18n/de/docusaurus-plugin-content-docs/current/guides/signing.mdx Normal file
View file

@ -0,0 +1,401 @@
# Code Signing
This is a guide on how you can sign your binaries generated with Wails on MacOS and Windows. The guide will target CI environments, more specifically GitHub Actions.
## Windows
First off you need a code signing certificate. If you do not already have one, Microsoft's info page lists some providers [here](https://docs.microsoft.com/en-us/windows-hardware/drivers/dashboard/get-a-code-signing-certificate). Please note that an EV certificate is not required unless you need to write kernel-level software such as device drivers. For signing your Wails app, a standard code signing certificate will do just fine.
It may be a good idea to check with your certificate provider how to sign your binaries on your local machine before targeting automated build systems, just so you know if there are any special requirements. For instance, [here](https://www.ssl.com/how-to/using-your-code-signing-certificate/) is SSL.com's code signing guide for Windows. If you know how to sign locally, it will be easier to troubleshoot any potential issues in a CI environment. For instance, SSL.com code signing certificates require the `/tr` flag for [SignTool.exe](https://docs.microsoft.com/en-us/windows/win32/seccrypto/signtool) while other providers may only need the `/t` flag for providing the timestamping server. Popular GitHub Actions for signing Windows binaries like [this one](https://github.com/Dana-Prajea/code-sign-action) does not support the `/tr` flag on SignTool.exe. Therefore this guide will focus on signing our app manually with PowerShell commands, but you can use actions like the [code-sign-action](https://github.com/Dana-Prajea/code-sign-action) Action if you prefer.
First off, let's make sure we are able to build our Wails app in our GitHub CI. Here is a small workflow template:
```yaml
name: "example"
on:
workflow_dispatch:
# This Action only starts when you go to Actions and manually run the workflow.
jobs:
package:
strategy:
matrix:
platform: [windows-latest, macos-latest]
go-version: [1.18]
runs-on: ${{ matrix.platform }}
steps:
- uses: actions/checkout@v3
- name: Install Go
uses: actions/setup-go@v2
with:
go-version: ${{ matrix.go-version }}
- name: setup node
uses: actions/setup-node@v2
with:
node-version: 14
# You may need to manually build you frontend manually here, unless you have configured frontend build and install commands in wails.json.
- name: Get Wails
run: go install github.com/wailsapp/wails/v2/cmd/wails@latest
- name: Build Wails app
run: |
wails build
- name: upload artifacts macOS
if: matrix.platform == 'macos-latest'
uses: actions/upload-artifact@v2
with:
name: wails-binaries-macos
path: build/bin/*
- name: upload artifacts windows
if: matrix.platform == 'windows-latest'
uses: actions/upload-artifact@v2
with:
name: wails-binaries-windows
path: build/bin/*
```
Next we need to give the GitHub workflow access to our signing certificate. This is done by encoding your .pfx or .p12 certificate into a base64 string. To do this in PowerShell, you can use the following command assuming your certificate is called 'my-cert.p12':
```PowerShell
certutil -encode .\my-cert.p12 my-cert-base64.txt
```
You should now have your .txt file with the base64 encoded certificate. It should start with _-----BEGIN CERTIFICATE-----_ and end with _-----END CERTIFICATE-----_. Now you need to make two action secrets on GitHub. Navigate to _Settings -> Secrets -> Actions_ and create the two following secrets:
- **WIN_SIGNING_CERT** with the contents of your base64 encoded certificate text.
- **WIN_SIGNING_CERT_PASSWORD** with the contents of your certificate password.
Now we're ready to implement the signing in our workflow using one of the two methods:
### Method 1: signing with commands
This method uses PowerShell commands to sign our app, and leaves you control over the entire signing process.
After the `"Build Wails app"` step, we can add the following step to our workflow:
```yaml
- name: Sign Windows binaries
if: matrix.platform == 'windows-latest'
run: |
echo "Creating certificate file"
New-Item -ItemType directory -Path certificate
Set-Content -Path certificate\certificate.txt -Value '${{ secrets.WIN_SIGNING_CERT }}'
certutil -decode certificate\certificate.txt certificate\certificate.pfx
echo "Signing our binaries"
& 'C:/Program Files (x86)/Windows Kits/10/bin/10.0.17763.0/x86/signtool.exe' sign /fd <signing algorithm> /t <timestamping server> /f certificate\certificate.pfx /p '${{ secrets.WIN_SIGNING_CERT_PASSWORD }}' <path to binary>
```
This script creates a new directory for your certificate file, creates the certificate file from our base64 secret, converts it to a .pfx file, and finally signs the binary. The following variables needs to be replaced in the last line:
- **signing algorithm**: usually sha256.
- **timestamping server**: URL to the timestamping server to use with your certificate.
- **path to binary**: path to the binary you want to sign.
Given that our Wails config has `outputfilename` set to "app.exe" and that we have a certificate from SSL.com, this would be our workflow:
```yaml
name: "example"
on:
workflow_dispatch:
# This Action only starts when you go to Actions and manually run the workflow.
jobs:
package:
strategy:
matrix:
platform: [windows-latest, macos-latest]
go-version: [1.18]
runs-on: ${{ matrix.platform }}
steps:
- uses: actions/checkout@v3
- name: Install Go
uses: actions/setup-go@v2
with:
go-version: ${{ matrix.go-version }}
- name: setup node
uses: actions/setup-node@v2
with:
node-version: 14
# You may need to manually build you frontend here, unless you have configured frontend build and install commands in wails.json.
- name: Get Wails
run: go install github.com/wailsapp/wails/v2/cmd/wails@latest
- name: Build Wails app
run: |
wails build
- name: Sign Windows binaries
if: matrix.platform == 'windows-latest'
run: |
echo "Creating certificate file"
New-Item -ItemType directory -Path certificate
Set-Content -Path certificate\certificate.txt -Value '${{ secrets.WIN_SIGNING_CERT }}'
certutil -decode certificate\certificate.txt certificate\certificate.pfx
echo "Signing our binaries"
& 'C:/Program Files (x86)/Windows Kits/10/bin/10.0.17763.0/x86/signtool.exe' sign /fd sha256 /tr http://ts.ssl.com /f certificate\certificate.pfx /p '${{ secrets.WIN_SIGNING_CERT_PASSWORD }}' .\build\bin\app.exe
- name: upload artifacts macOS
if: matrix.platform == 'macos-latest'
uses: actions/upload-artifact@v2
with:
name: wails-binaries-macos
path: build/bin/*
- name: upload artifacts windows
if: matrix.platform == 'windows-latest'
uses: actions/upload-artifact@v2
with:
name: wails-binaries-windows
path: build/bin/*
```
### Method 2: automatically signing with Action
It is possible to use a Windows code signing Action like [this](https://github.com/marketplace/actions/code-sign-a-file-with-pfx-certificate) one, but note it requires a SHA1 hash for the certificate and a certificate name. View an example of how to configure it on the Action's [marketplace](https://github.com/marketplace/actions/code-sign-a-file-with-pfx-certificate).
---
## MacOS
First off you need your code signing certificate from Apple. If you do not have one, a simple Google search will help you acquire one. Once you have your certificate, you need to export it and encode it to base64. [This tutorial](https://localazy.com/blog/how-to-automatically-sign-macos-apps-using-github-actions) shows you how to do that in an easy manner. Once you have exported your .p12 certificate file, you can encode it to base64 as seen in the tutorial with the following command:
```bash
base64 Certificates.p12 | pbcopy
```
Now you're ready to create some GitHub project secrets, just as with Windows:
- **APPLE_DEVELOPER_CERTIFICATE_P12_BASE64** with the contents of your newly copied base64 certificate.
- **APPLE_DEVELOPER_CERTIFICATE_PASSWORD** with the contents of your certificate password.
- **APPLE_PASSWORD** with the contents of an App-Specific password to your Apple-ID account which you can generate [here](https://appleid.apple.com/account/manage).
Let's make sure we are able to build our Wails app in our GitHub Action workflow. Here is a small template:
```yaml
name: "example"
on:
workflow_dispatch:
# This Action only starts when you go to Actions and manually run the workflow.
jobs:
package:
strategy:
matrix:
platform: [windows-latest, macos-latest]
go-version: [1.18]
runs-on: ${{ matrix.platform }}
steps:
- uses: actions/checkout@v3
- name: Install Go
uses: actions/setup-go@v2
with:
go-version: ${{ matrix.go-version }}
- name: setup node
uses: actions/setup-node@v2
with:
node-version: 14
# You may need to manually build you frontend here, unless you have configured frontend build and install commands in wails.json.
- name: Get Wails
run: go install github.com/wailsapp/wails/v2/cmd/wails@latest
- name: Build Wails app
run: |
wails build
- name: upload artifacts macOS
if: matrix.platform == 'macos-latest'
uses: actions/upload-artifact@v2
with:
name: wails-binaries-macos
path: build/bin/*
- name: upload artifacts windows
if: matrix.platform == 'windows-latest'
uses: actions/upload-artifact@v2
with:
name: wails-binaries-windows
path: build/bin/*
```
For code signing on macOS, [gon](https://github.com/Bearer/gon) is a very handy tool for code signing and communicating with Apple servers, also written in Go, and will be used in this guide.
After the `Build Wails app` step, add the following to the workflow:
```yaml
- name: MacOS download gon for code signing and app notarization
if: matrix.platform == 'macos-latest'
run: |
brew install Bearer/tap/gon
```
Now we need to configure some gon config files in our `build/darwin` directory:
1. gon-sign.json:
```json
{
"source": ["./build/bin/app.app"],
"bundle_id": "app.myapp",
"apple_id": {
"username": "my-appleid@email.com",
"password": "your-app-specific-password",
"provider": "ABCDE12345"
},
"sign": {
"application_identity": "Developer ID Application: Human User"
}
}
```
Here is a brief break down of the above fields:
- `source`: The location of your wails binary to be signed
- `apple_id`:
- `username`: Your Apple ID email address
- `password`: Your app-specific password
- `provider`: Your team ID for your App Store Connect account
- `sign`:
- `application_identity`: Your Apple developer identity
The (https://developer.apple.com/documentation/technotes/tn3147-migrating-to-the-latest-notarization-tool)[deprecated Apple's altool]'s syntax supporting `@env:` is no longer available since Apple has migrated to the new notarytool.
Your developer identity and team ID can both by found on macOS by running the following command:
```bash
$ security find-identity -v -p codesigning
1) 00000000000000000000000000000000000000000 "Developer ID Application: Human User (ABCDE12345)"
```
2. entitlements.plist:
```plist
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
<plist version="1.0">
<dict>
<key>com.apple.security.app-sandbox</key>
<true/>
<key>com.apple.security.network.client</key>
<true/>
<key>com.apple.security.network.server</key>
<true/>
<key>com.apple.security.files.user-selected.read-write</key>
<true/>
<key>com.apple.security.files.downloads.read-write</key>
<true/>
</dict>
</plist>
```
In this file you configure the entitlements you need for you app, e.g. camera permissions if your app uses the camera. Read more about entitlements [here](https://developer.apple.com/documentation/bundleresources/entitlements).
Make sure you have updated your `Info.plist` file with the same bundle ID as you entered in `gon-sign.json`. Here's an example `Info.plist` file:
```plist
<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
<plist version="1.0"><dict>
<key>CFBundlePackageType</key><string>APPL</string>
<key>CFBundleName</key><string>MyApp</string>
<key>CFBundleExecutable</key><string>app</string>
<key>CFBundleIdentifier</key><string>app.myapp</string>
<key>CFBundleVersion</key><string>0.1.0</string>
<key>CFBundleGetInfoString</key><string>My app is cool and nice and chill and</string>
<key>CFBundleShortVersionString</key><string>0.1.0</string>
<key>CFBundleIconFile</key><string>iconfile</string>
<key>LSMinimumSystemVersion</key><string>10.13.0</string>
<key>NSHighResolutionCapable</key><string>true</string>
<key>LSApplicationCategoryType</key><string>public.app-category.utilities</string>
<key>NSHumanReadableCopyright</key><string>© Me</string>
</dict></plist>
```
Now we're ready to add the signing step in our workflow after building the Wails app:
```yaml
- name: Import Code-Signing Certificates for macOS
if: matrix.platform == 'macos-latest'
uses: Apple-Actions/import-codesign-certs@v1
with:
# The certificates in a PKCS12 file encoded as a base64 string
p12-file-base64: ${{ secrets.APPLE_DEVELOPER_CERTIFICATE_P12_BASE64 }}
# The password used to import the PKCS12 file.
p12-password: ${{ secrets.APPLE_DEVELOPER_CERTIFICATE_PASSWORD }}
- name: Sign our macOS binary
if: matrix.platform == 'macos-latest'
run: |
echo "Signing Package"
gon -log-level=info ./build/darwin/gon-sign.json
```
Please note that signing binaries with Apple could take anywhere from minutes to hours.
## Combined workflow file:
Here is our GitHub workflow file with Windows + macOS combined:
```yaml
name: "example combined"
on:
workflow_dispatch:
# This Action only starts when you go to Actions and manually run the workflow.
jobs:
package:
strategy:
matrix:
platform: [windows-latest, macos-latest]
go-version: [1.18]
runs-on: ${{ matrix.platform }}
steps:
- uses: actions/checkout@v3
- name: Install Go
uses: actions/setup-go@v2
with:
go-version: ${{ matrix.go-version }}
- name: setup node
uses: actions/setup-node@v2
with:
node-version: 14
# You may need to manually build you frontend here, unless you have configured frontend build and install commands in wails.json.
- name: Get Wails
run: go install github.com/wailsapp/wails/v2/cmd/wails@latest
- name: Build Wails app
run: |
wails build
- name: MacOS download gon for code signing and app notarization
if: matrix.platform == 'macos-latest'
run: |
brew install Bearer/tap/gon
- name: Import Code-Signing Certificates for macOS
if: matrix.platform == 'macos-latest'
uses: Apple-Actions/import-codesign-certs@v1
with:
# The certificates in a PKCS12 file encoded as a base64 string
p12-file-base64: ${{ secrets.APPLE_DEVELOPER_CERTIFICATE_P12_BASE64 }}
# The password used to import the PKCS12 file.
p12-password: ${{ secrets.APPLE_DEVELOPER_CERTIFICATE_PASSWORD }}
- name: Sign our macOS binary
if: matrix.platform == 'macos-latest'
run: |
echo "Signing Package"
gon -log-level=info ./build/darwin/gon-sign.json
- name: Sign Windows binaries
if: matrix.platform == 'windows-latest'
run: |
echo "Creating certificate file"
New-Item -ItemType directory -Path certificate
Set-Content -Path certificate\certificate.txt -Value '${{ secrets.WIN_SIGNING_CERT }}'
certutil -decode certificate\certificate.txt certificate\certificate.pfx
echo "Signing our binaries"
& 'C:/Program Files (x86)/Windows Kits/10/bin/10.0.17763.0/x86/signtool.exe' sign /fd sha256 /tr http://ts.ssl.com /f certificate\certificate.pfx /p '${{ secrets.WIN_SIGNING_CERT_PASSWORD }}' .\build\bin\Monitor.exe
- name: upload artifacts macOS
if: matrix.platform == 'macos-latest'
uses: actions/upload-artifact@v2
with:
name: wails-binaries-macos
path: build/bin/*
- name: upload artifacts windows
if: matrix.platform == 'windows-latest'
uses: actions/upload-artifact@v2
with:
name: wails-binaries-windows
path: build/bin/*
```
# End notes
This guide inspired by the RiftShare project and its workflow, which is highly recommended to check out [here](https://github.com/achhabra2/riftshare/blob/main/.github/workflows/build.yaml).

81
website/i18n/de/docusaurus-plugin-content-docs/current/guides/single-instance-lock.mdx Normal file
View file

@ -0,0 +1,81 @@
# Single Instance Lock
Single instance lock is a mechanism that allows you to prevent multiple instances of your app from running at the same time.
It is useful for apps that are designed to open files from the command line or from the OS file explorer.
## Important
Single Instance Lock does not implement a secure communications protocol between instances. When using single instance lock,
your app should treat any data passed to it from second instance callback as untrusted.
You should verify that args that you receive are valid and don't contain any malicious data.
## How it works
Windows: Single instance lock is implemented using a named mutex. The mutex name is generated from the unique id that you provide. Data is passed to the first instance via a shared window using [SendMessage](https://learn.microsoft.com/en-us/windows/win32/api/winuser/nf-winuser-sendmessage)
macOS: Single instance lock is implemented using a named mutex. The mutex name is generated from the unique id that you provide. Data is passed to the first instance via [NSDistributedNotificationCenter](https://developer.apple.com/documentation/foundation/nsdistributednotificationcenter)
Linux: Single instance lock is implemented using [dbus](https://www.freedesktop.org/wiki/Software/dbus/). The dbus name is generated from the unique id that you provide. Data is passed to the first instance via [dbus](https://www.freedesktop.org/wiki/Software/dbus/)
## Usage
When creating your app, you can enable single instance lock by passing a `SingleInstanceLock` struct to the `App` struct.
Use the `UniqueId` field to specify a unique id for your app.
This id is used to generate the mutex name on Windows and macOS and the dbus name on Linux. Use a UUID to ensure that the id is unique.
The `OnSecondInstanceLaunch` field is used to specify a callback that is called when a second instance of your app is launched.
The callback receives a `SecondInstanceData` struct that contains the command line arguments passed to the second instance and the working directory of the second instance.
Note that OnSecondInstanceLaunch don't trigger windows focus.
You need to call `runtime.WindowUnminimise` and `runtime.Show` to bring your app to the front.
Note that on linux systems window managers may prevent your app from being brought to the front to avoid stealing focus.
```go title="main.go"
var wailsContext *context.Context
// NewApp creates a new App application struct
func NewApp() *App {
return &App{}
}
// startup is called when the app starts. The context is saved
// so we can call the runtime methods
func (a *App) startup(ctx context.Context) {
wailsContext = &ctx
}
func (a *App) onSecondInstanceLaunch(secondInstanceData options.SecondInstanceData) {
secondInstanceArgs = secondInstanceData.Args
println("user opened second instance", strings.Join(secondInstanceData.Args, ","))
println("user opened second from", secondInstanceData.WorkingDirectory)
runtime.WindowUnminimise(*wailsContext)
runtime.Show(*wailsContext)
go runtime.EventsEmit(*wailsContext, "launchArgs", secondInstanceArgs)
}
func main() {
// Create an instance of the app structure
app := NewApp()
// Create application with options
err := wails.Run(&options.App{
Title: "wails-open-file",
Width: 1024,
Height: 768,
AssetServer: &assetserver.Options{
Assets: assets,
},
BackgroundColour: &options.RGBA{R: 27, G: 38, B: 54, A: 1},
OnStartup: app.startup,
SingleInstanceLock: &options.SingleInstanceLock{
UniqueId: "e3984e08-28dc-4e3d-b70a-45e961589cdc",
OnSecondInstanceLaunch: app.onSecondInstanceLaunch,
},
Bind: []interface{}{
app,
},
})
if err != nil {
println("Error:", err.Error())
}
}
```

157
website/i18n/de/docusaurus-plugin-content-docs/current/guides/sveltekit.mdx Normal file
View file

@ -0,0 +1,157 @@
# SvelteKit
This guide will go into:
1. Minimal Installation Steps - The steps needed to get a minimum Wails setup working for SvelteKit.
2. Install Script - Bash script for accomplishing the Minimal Installation Steps with optional Wails branding.
3. Important Notes - Issues that can be encountered when using SvelteKit + Wails and fixes.
## 1. Minimal Installation Steps
##### Install Wails for Svelte.
- `wails init -n myapp -t svelte`
##### Delete the svelte frontend.
- Navigate into your newly created myapp folder.
- Delete the folder named "frontend"
##### While in the Wails project root. Use the Svelte CLI to create a SvelteKit project as the new frontend. Follow the prompts, nothing Wails specific is needed here.
- `npx sv create frontend`
##### Modify wails.json.
- Add `"wailsjsdir": "./frontend/src/lib",` Do note that this is where your Go and runtime functions will appear.
- Change your package manager frontend here if not using npm.
##### Modify main.go.
- The first comment `//go:embed all:frontend/dist` needs to be changed to `//go:embed all:frontend/build`
##### Modify .gitignore
- The line `frontend/dist` needs to be replaced with `frontend/build`
##### Install/remove dependencies using your favorite package manager.
- Navigate into your "frontend" folder.
- `npm i`
- `npm uninstall @sveltejs/adapter-auto`
- `npm i -D @sveltejs/adapter-static`
##### Change adapter in svelte.config.js
- First line of file change `import adapter from '@sveltejs/adapter-auto';` to `import adapter from '@sveltejs/adapter-static';`
##### Put SvelteKit into SPA mode with prerendering.
- Create a file under myapp/frontend/src/routes/ named +layout.ts/+layout.js.
- Add two lines into the newly created file `export const prerender = true` and `export const ssr = false`
##### Test installation.
- Navigate back into the Wails project root (one directory up).
- run `wails dev`
- If the application doesn't run please check through the previous steps.
## 2. Install Script
##### This Bash Script does the steps listed above. Make sure to read over the script and understand what the script is doing on your computer.
- Create a file sveltekit-wails.sh
- Copy the below code into the new file then save it.
- Make it executable with `chmod +x sveltekit-wails.sh`
- Brand is an optional param below that adds back in the wails branding. Leave third param blank to not insert the Wails branding.
- Example usage: `./sveltekit-wails.sh pnpm newapp brand`
##### sveltekit-wails.sh:
```
manager=$1
project=$2
brand=$3
wails init -n $project -t svelte
cd $project
sed -i "s|npm|$manager|g" wails.json
sed -i 's|"auto",|"auto",\n "wailsjsdir": "./frontend/src/lib",|' wails.json
sed -i "s|all:frontend/dist|all:frontend/build|" main.go
if [[ -n $brand ]]; then
mv frontend/src/App.svelte +page.svelte
sed -i "s|'./assets|'\$lib/assets|" +page.svelte
sed -i "s|'../wails|'\$lib/wails|" +page.svelte
mv frontend/src/assets .
fi
rm -r frontend
$manager create svelte@latest frontend
if [[ -n $brand ]]; then
mv +page.svelte frontend/src/routes/+page.svelte
mkdir frontend/src/lib
mv assets frontend/src/lib/
fi
cd frontend
$manager i
$manager uninstall @sveltejs/adapter-auto
$manager i -D @sveltejs/adapter-static
echo -e "export const prerender = true\nexport const ssr = false" > src/routes/+layout.ts
sed -i "s|-auto';|-static';|" svelte.config.js
cd ..
wails dev
```
## 3. Important Notes
##### Server files will cause build failures.
- \+layout.server.ts, +page.server.ts, +server.ts or any file with "server" in the name will fail to build as all routes are prerendered.
##### The Wails runtime unloads with full page navigations!
- Anything that causes full page navigations: `window.location.href = '/<some>/<page>'` or Context menu reload when using wails dev. What this means is that you can end up losing the ability to call any runtime breaking the app. There are two ways to work around this.
- Use `import { goto } from '$app/navigation'` then call `goto('/<some>/<page>')` in your +page.svelte. This will prevent a full page navigation.
- If full page navigation can't be prevented the Wails runtime can be added to all pages by adding the below into the `<head>` of myapp/frontend/src/app.html
```
<head>
...
<meta name="wails-options" content="noautoinject" />
<script src="/wails/ipc.js"></script>
<script src="/wails/runtime.js"></script>
...
</head>
```
See https://wails.io/docs/guides/frontend for more information.
##### Initial data can be loaded and refreshed from +page.ts/+page.js to +page.svelte.
- \+page.ts/+page.js works well with load() https://kit.svelte.dev/docs/load#page-data
- invalidateAll() in +page.svelte will call load() from +page.ts/+page.js https://kit.svelte.dev/docs/load#rerunning-load-functions-manual-invalidation.
##### Error Handling
- Expected errors using Throw error works in +page.ts/+page.js with a +error.svelte page. https://kit.svelte.dev/docs/errors#expected-errors
- Unexpected errors will cause the application to become unusable. Only recovery option (known so far) from unexpected errors is to reload the app. To do this create a file myapp/frontend/src/hooks.client.ts then add the below code to the file.
```
import { WindowReloadApp } from '$lib/wailsjs/runtime/runtime'
export async function handleError() {
WindowReloadApp()
}
```
##### Using Forms and handling functions
- The simplest way is to call a function from the form is the standard, bind:value your variables and prevent submission `<form method="POST" on:submit|preventDefault={handle}>`
- The more advanced way is to use:enhance (progressive enhancement) which will allow for convenient access to formData, formElement, submitter. The important note is to always cancel() the form which prevents server side behavior. https://kit.svelte.dev/docs/form-actions#progressive-enhancement Example:
```
<form method="POST" use:enhance={({cancel, formData, formElement, submitter}) => {
cancel()
console.log(Object.fromEntries(formData))
console.log(formElement)
console.log(submitter)
handle()
}}>
```

97
website/i18n/de/docusaurus-plugin-content-docs/current/guides/templates.mdx Normal file
View file

@ -0,0 +1,97 @@
# 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](../reference/cli.mdx#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:
```mdx-code-block
<div className="text--center">
<img
src={require("@site/static/img/vue3-template.png").default}
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](../community/templates.mdx) page
- Announce the template on the [Template Announcement](https://github.com/wailsapp/wails/discussions/825) discussion board

368
website/i18n/de/docusaurus-plugin-content-docs/current/guides/troubleshooting.mdx Normal file
View file

@ -0,0 +1,368 @@
# Troubleshooting
An assortment of troubleshooting tips.
## The `wails` command appears to be missing?
If your system is reporting that the `wails` command is missing, make sure you have followed the Go installation guide correctly. Normally, it means that the `go/bin` directory in your User's home directory is not in the `PATH` environment variable. You will also normally need to close and reopen any open command prompts so that changes to the environment made by the installer are reflected at the command prompt.
## 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 all:frontend/dist
var assets embed.FS
```
Check that `frontend/dist` contains your application assets.
### Mac
If this happens on Mac, try adding the following to your `Info.plist`:
```xml
<key>NSAppTransportSecurity</key>
<dict>
<key>NSAllowsLocalNetworking</key>
<true/>
</dict>
```
Reference: https://github.com/wailsapp/wails/issues/1504#issuecomment-1174317433
## Mac application not valid
If your built application looks like this in finder:
```mdx-code-block
<p className="text--center">
<img
src={
require("@site/static/img/troubleshooting/invalid_mac_app.png").default
}
/>
</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.
## My application is not displaying the correct icon in Windows Explorer
If your application is not displaying the correct icon, try deleting the hidden `IconCache.db` file located in the `C:\Users\&#060;your username&#062;\AppData\Local` directory. This will force Windows to rebuild the icon cache.
Source: https://github.com/wailsapp/wails/issues/2360#issuecomment-1556070036
## 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
## The generated TypeScript doesn't have the correct types
Sometimes the generated TypeScript doesn't have the correct types. To mitigate this, it is possible to specify what types should be generated using the `ts_type` struct tag. For more details, please read [this](https://github.com/tkrajina/typescriptify-golang-structs#custom-types).
## When I navigate away from `index.html`, I am unable to call methods on the frontend
If you navigate away from `index.html` to a new html file, the context will be lost. This can be fixed by adding the following imports to the `<head>` section of any new page you navigate to:
```html
<head>
<script src="/wails/ipc.js"></script>
<script src="/wails/runtime.js"></script>
</head>
```
Source: https://github.com/wailsapp/wails/discussions/1512
## I get `too many open files` errors on my Mac when I run `wails dev`
By default, macOS will only allow you to open a maximum of 256 files. This can affect the `wails dev` command. This limit can be increased by running: `ulimit -n 1024` in the terminal.
FSNotify is [looking to move to Apple's fsevents](https://github.com/fsnotify/fsnotify/issues/11) for Mac. If this isn't completed soon, we will create our own implementation, tracked [here](https://github.com/wailsapp/wails/issues/1733).
## My Mac app gives me weird compilation errors
A few users have reported seeing compilation errors such as the following:
```shell
# github.com/wailsapp/wails/v2/internal/frontend/desktop/darwin
In file included from ../../pkg/mod/github.com/wailsapp/wails/v2@v2.0.0-beta.44.2/internal/frontend/desktop/darwin/callbacks.go:9:
In file included from /Library/Developer/CommandLineTools/SDKs/MacOSX12.1.sdk/System/Library/Frameworks/Foundation.framework/Headers/Foundation.h:12:
/Library/Developer/CommandLineTools/SDKs/MacOSX12.1.sdk/System/Library/Frameworks/Foundation.framework/Headers/NSBundle.h:91:143: error: function does not return NSString
- (NSAttributedString *)localizedAttributedStringForKey:(NSString *)key value:(nullable NSString *)value table:(nullable NSString *)tableName NS_FORMAT_ARGUMENT(1) NS_REFINED_FOR_SWIFT API_AVAILABLE(macos(12.0), ios(15.0), watchos(8.0), tvos(15.0));
~~~~~~~~~~~~~~ ^ ~
/Library/Developer/CommandLineTools/SDKs/MacOSX12.1.sdk/System/Library/Frameworks/Foundation.framework/Headers/NSObjCRuntime.h:103:48: note: expanded from macro 'NS_FORMAT_ARGUMENT'
#define NS_FORMAT_ARGUMENT(A) __attribute__ ((format_arg(A)))
```
This is _normally_ due to a mismatch with the OS version you are running and the version of the XCode Command Line Tools installed. If you see an error like this, try upgrading your XCode Command Line Tools to the latest version.
If reinstalling Xcode Command Tools still fails, you can check the path where the toolkit is located using:
`xcode-select -p`
If `/Applications/Xcode.app/Contents/Developer` is displayed, run `sudo xcode-select --switch /Library/Developer/CommandLineTools`
Sources: https://github.com/wailsapp/wails/issues/1806 and https://github.com/wailsapp/wails/issues/1140#issuecomment-1290446496
## My application won't compile on Mac
If you are getting errors like this:
```shell
l1@m2 GoEasyDesigner % go build -tags dev -gcflags "all=-N -l"
/Users/l1/sdk/go1.20.5/pkg/tool/darwin_arm64/link: running clang failed: exit status 1
Undefined symbols for architecture arm64:
"_OBJC_CLASS_$_UTType", referenced from:
objc-class-ref in 000016.o
ld: symbol(s) not found for architecture arm64
clang: error: linker command failed with exit code 1 (use -v to see invocation)
```
Ensure you have the latest SDK installed. If so and you're still experiencing this issue, try the following:
```shell
export CGO_LDFLAGS="-framework UniformTypeIdentifiers" && go build -tags dev -gcflags "all=-N -l"
```
Sources: https://github.com/wailsapp/wails/pull/2925#issuecomment-1726828562
--
## Cannot start service: Host version "x.x.x does not match binary version "x.x.x"
It's preferable to add `frontend/node_modules` and `frontend/package-lock.json` to your `.gitignore`. Otherwise when opening your repository on another machine that may have different versions of Node installed, you may not be able to run your application.
If this does happen, simply delete `frontend/node_modules` and `frontend/package-lock.json` and run your `wails build` or `wails dev` command again.
## Build process stuck on "Generating bindings"
Bindings generation process runs your application in a special mode. If application, intentionally or unintentionally, contains an endless loop (i.e. not exiting after `wails.Run()` finished), this can lead to build process stuck on the stage of bindings generation. Please make sure your code exits properly.
## Mac application flashes white at startup
This is due to the default background of the webview being white. If you want to use the window background colour instead, you can make the webview background transparent using the following config:
```go
err := wails.Run(&options.App{
Title: "macflash",
Width: 1024,
Height: 768,
// Other settings
Mac: &mac.Options{
WebviewIsTransparent: true,
},
})
```
## I get a "Microsoft Edge can't read or write to its data directory" error when running my program as admin on Windows
You set your program to require admin permissions and it worked great! Unfortunately, some users are seeing a "Microsoft Edge can't read or write to its data directory" error when running it.
When a Windows machine has two local accounts:
- Alice, an admin
- Bob, a regular user
Bob sees a UAC prompt when running your program. Bob enters Alice's admin credentials into this prompt. The app launches with admin permissions under Alice's account.
Wails instructs WebView2 to store user data at the specified `WebviewUserDataPath`. It defaults to `%APPDATA%\[BinaryName.exe]`.
Because the application is running under Alice's account, `%APPDATA%\[BinaryName.exe]` resolves to `C:\Users\Alice\AppData\Roaming\[BinaryName.exe]`.
WebView2 [creates some child processes under Bob's logged-in account instead of Alice's admin account](https://github.com/MicrosoftEdge/WebView2Feedback/issues/932#issue-807464179). Since Bob cannot access `C:\Users\Alice\AppData\Roaming\[BinaryName.exe]`, the "Microsoft Edge can't read or write to its data directory" error is shown.
Possible solution #1:
Refactor your application to work without constant admin permissions. If you just need to perform a small set of admin tasks (such as running an updater), you can run your application with the minimum permissions and then use the `runas` command to run these tasks with admin permissions as needed:
```go
//go:build windows
package sample
import (
"golang.org/x/sys/windows"
"syscall"
)
// Calling RunAs("C:\path\to\my\updater.exe") shows Bob a UAC prompt. Bob enters Alice's admin credentials. The updater launches with admin permissions under Alice's account.
func RunAs(path string) error {
verbPtr, _ := syscall.UTF16PtrFromString("runas")
exePtr, _ := syscall.UTF16PtrFromString(path)
cwdPtr, _ := syscall.UTF16PtrFromString("")
argPtr, _ := syscall.UTF16PtrFromString("")
var showCmd int32 = 1 //SW_NORMAL
err := windows.ShellExecute(0, verbPtr, exePtr, argPtr, cwdPtr, showCmd)
if err != nil {
return err
}
return nil
}
```
Possible solution #2:
Run your application with extended permissions. If you absolutely must run with constant admin permissions, WebView2 will function correctly if you use a data directory accessible by both users and you also launch your app with the `SeBackupPrivilege`, `SeDebugPrivilege`, and `SeRestorePrivilege` permissions. Here's an example:
```go
package main
import (
"embed"
"os"
"runtime"
"github.com/fourcorelabs/wintoken"
"github.com/hectane/go-acl"
"github.com/wailsapp/wails/v2"
"github.com/wailsapp/wails/v2/pkg/options"
"github.com/wailsapp/wails/v2/pkg/options/assetserver"
"github.com/wailsapp/wails/v2/pkg/options/windows"
)
//go:embed all:frontend/dist
var assets embed.FS
const (
fixedTokenKey = "SAMPLE_RANDOM_KEY"
fixedTokenVal = "with-fixed-token"
webviewDir = "C:\\ProgramData\\Sample"
)
func runWithFixedToken() {
println("Re-launching self")
token, err := wintoken.OpenProcessToken(0, wintoken.TokenPrimary) //pass 0 for own process
if err != nil {
panic(err)
}
defer token.Close()
token.EnableTokenPrivileges([]string{
"SeBackupPrivilege",
"SeDebugPrivilege",
"SeRestorePrivilege",
})
cmd := exec.Command(os.Args[0])
cmd.Args = os.Args
cmd.Env = os.Environ()
cmd.Env = append(cmd.Env, fmt.Sprintf("%v=%v", fixedTokenKey, fixedTokenVal))
cmd.Stdin = os.Stdin
cmd.Stdout = os.Stdout
cmd.Stderr = os.Stderr
cmd.SysProcAttr = &syscall.SysProcAttr{Token: syscall.Token(token.Token())}
if err := cmd.Run(); err != nil {
println("Error after launching self:", err)
os.Exit(1)
}
println("Clean self launch :)")
os.Exit(0)
}
func main() {
if runtime.GOOS == "windows" && os.Getenv(fixedTokenKey) != fixedTokenVal {
runWithFixedToken()
}
println("Setting data dir to", webviewDir)
if err := os.MkdirAll(webviewDir, os.ModePerm); err != nil {
println("Failed creating dir:", err)
}
if err := acl.Chmod(webviewDir, 0777); err != nil {
println("Failed setting ACL on dir:", err)
}
app := NewApp()
err := wails.Run(&options.App{
Title: "sample-data-dir",
Width: 1024,
Height: 768,
AssetServer: &assetserver.Options{
Assets: assets,
},
Bind: []interface{}{
app,
},
Windows: &windows.Options{
WebviewUserDataPath: webviewDir,
},
})
if err != nil {
println("Error:", err.Error())
}
}
```
If you use a data directory accessible by both users but not the extended privileges, you will receive a WebView2 `80010108 The object invoked has disconnected from its clients` error.
Possible future solution #3: [run WebView2 using an in-memory mode if implemented](https://github.com/MicrosoftEdge/WebView2Feedback/issues/3637#issuecomment-1728300982).
## WebView2 installation succeeded, but the wails doctor command shows that it is not installed
If you have installed WebView2, but the `wails doctor` command shows that it is not installed, it is likely that the WebView2 runtime installed was for a different architecture. You can download the correct runtime from [here](https://developer.microsoft.com/en-us/microsoft-edge/webview2/).
Source: https://github.com/wailsapp/wails/issues/2917
## WebVie2wProcess failed with kind
If your Windows app generates this kind of error, you can check out what the error means [here](https://docs.microsoft.com/en-us/microsoft-edge/webview2/reference/winrt/microsoft_web_webview2_core/corewebview2processfailedkind?view=webview2-winrt-1.0.2045.28).

82
website/i18n/de/docusaurus-plugin-content-docs/current/guides/vscode.mdx Normal file
View file

@ -0,0 +1,82 @@
# Visual Studio Code
This page is for miscellaneous tips and tricks when using Visual Studio Code with Wails.
## Vetur Configuration
Many thanks to [@Lyimmi](https://github.com/Lyimmi) for this tip. Originally posted [here](https://github.com/wailsapp/wails/issues/1791#issuecomment-1228158349).
Vetur is a popular plugin for Visual Studio Code that provides syntax highlighting and code completion for Vue projects. When loading a Wails project in VSCode, Vetur will throw an error as it is expecting to find the frontend project in the root directory. To fix this, you can do the following:
Create a file named `vetur.config.js` in the project's root.
```javascript
// vetur.config.js
/** @type {import('vls').VeturConfig} */
module.exports = {
// **optional** default: `{}`
// override vscode settings
// Notice: It only affects the settings used by Vetur.
settings: {
"vetur.useWorkspaceDependencies": true,
"vetur.experimental.templateInterpolationService": true
},
// **optional** default: `[{ root: './' }]`
// support monorepos
projects: [
{
// **required**
// Where is your project?
// It is relative to `vetur.config.js`.
// root: './packages/repo1',
root: './frontend',
// **optional** default: `'package.json'`
// Where is `package.json` in the project?
// We use it to determine the version of vue.
// It is relative to root property.
package: './package.json',
// **optional**
// Where is TypeScript config file in the project?
// It is relative to root property.
tsconfig: './tsconfig.json',
// **optional** default: `'./.vscode/vetur/snippets'`
// Where is vetur custom snippets folders?
snippetFolder: './.vscode/vetur/snippets',
// **optional** default: `[]`
// Register globally Vue component glob.
// If you set it, you can get completion by that components.
// It is relative to root property.
// Notice: It won't actually do it. You need to use `require.context` or `Vue.component`
globalComponents: [
'./src/components/**/*.vue'
]
}
]
}
```
Next, configure `frontend/tsconfig.json`:
```javascript
{
"compilerOptions": {
"module": "system",
"noImplicitAny": true,
"removeComments": true,
"preserveConstEnums": true,
"sourceMap": true,
"outFile": "../../built/local/tsc.js",
"allowJs": true
},
"exclude": [
"node_modules",
"**/*.spec.ts"
],
"include": [
"src/**/*",
"wailsjs/**/*.ts"
]
}
```
This should enable you to now use Vetur as expected.

71
website/i18n/de/docusaurus-plugin-content-docs/current/guides/windows-installer.mdx Normal file
View file

@ -0,0 +1,71 @@
# NSIS installer
```mdx-code-block
<p style={{ "text-align": "center" }}>
<img
src={require("@site/static/img/nsis.webp").default}
style={{ "max-width": "50%" }}
/>
<br />
</p>
```
Wails supports generating Windows installers using the [NSIS installer](https://nsis.sourceforge.io/).
## Installing NSIS
### Windows
The installer is available on the [NSIS Download](https://nsis.sourceforge.io/Download) page.
You can install with [Scoop](https://scoop.sh/) (which will automatically add it to your PATH):
```
scoop bucket add extras
scoop install nsis
```
Or, you can use Winget (on Windows 10+):
```
winget install NSIS.NSIS --silent
```
If you use the chocolatey package manager, run the following script:
```
choco install nsis
```
**NOTE:** If you install NSIS manually, you need to add the _Bin_ folder, which contains `makensis.exe`, in your NSIS installation to your path. [Here](https://www.architectryan.com/2018/03/17/add-to-the-path-on-windows-10/) is a good tutorial on how to add to path on Windows.
### Linux
The `nsis` package should be available through your distribution's package manager.
### MacOS
NSIS is available to install through homebrew: `brew install nsis`.
## Generating the installer
When a new project is created, Wails generates the NSIS configuration files in `build/windows/installer`. The config data is read from `installer/info.json` and that is configured to use the project's `wails.json` Info section:
```json
// ...
"Info": {
"companyName": "My Company Name",
"productName": "Wails Vite",
"productVersion": "1.0.0",
"copyright": "Copyright.........",
"comments": "Built using Wails (https://wails.io)"
},
```
To generate an installer for your application, use the `-nsis` flag with `wails build`:
```
wails build -nsis
```
The installer will now be available in the `build/bin` directory.

67
website/i18n/de/docusaurus-plugin-content-docs/current/guides/windows.mdx Normal file
View file

@ -0,0 +1,67 @@
# 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.
## Fixed version runtime
Another way of dealing with webview2 dependency is shipping it yourself. You can download [fixed version runtime](https://developer.microsoft.com/microsoft-edge/webview2/#download-section) and bundle or download it with your application.
Also, you should specify path to fixed version of webview2 runtime in the `windows.Options` structure when launching wails.
```go
wails.Run(&options.App{
Windows: &windows.Options{
WebviewBrowserPath: "",
},
})
```
Note: When `WebviewBrowserPath` is specified, `error` strategy will be forced in case of minimal required version mismatch or invalid path to a runtime.
The downloaded file will be compressed (extension `.cab`), so you must extract it before using it, according to the instructions on the [official site](https://learn.microsoft.com/en-us/microsoft-edge/webview2/concepts/distribution#details-about-the-fixed-version-runtime-distribution-mode) should run in a terminal the following command to extract the file:
```
expand {path to the package} -F:* {path to the destination folder}
```
## Spawning other programs
When spawning other programs, such as scripts, you will see the window appear on the screen. To hide the window, you can use the following code:
```go
cmd := exec.Command("your_script.exe")
cmd.SysProcAttr = &syscall.SysProcAttr{
HideWindow: true,
CreationFlags: 0x08000000,
}
cmd.Start()
```
Solution provided by [sithembiso](https://github.com/sithembiso) on the [discussions board](https://github.com/wailsapp/wails/discussions/1734#discussioncomment-3386172).

419
website/i18n/de/docusaurus-plugin-content-docs/current/howdoesitwork.mdx Normal file
View file

@ -0,0 +1,419 @@
---
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.
```mdx-code-block
<div className="text--center">
<img src={require("@site/static/img/architecture.webp").default} style={{"width":"75%", "max-width":"800px"}} />
</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"
"github.com/wailsapp/wails/v2/pkg/options/assetserver"
)
//go:embed all:frontend/dist
var assets embed.FS
func main() {
app := &App{}
err := wails.Run(&options.App{
Title: "Basic Demo",
Width: 1024,
Height: 768,
AssetServer: &assetserver.Options{
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](reference/options.mdx).
#### 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 all: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](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](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](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](reference/options.mdx#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. Think of structs like "controllers" in a traditional web application. 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 {17,27} title="main.go"
package main
import (
"embed"
"log"
"github.com/wailsapp/wails/v2"
"github.com/wailsapp/wails/v2/pkg/options"
"github.com/wailsapp/wails/v2/pkg/options/assetserver"
)
//go:embed all:frontend/dist
var assets embed.FS
func main() {
app := &App{}
err := wails.Run(&options.App{
Title: "Basic Demo",
Width: 1024,
Height: 768,
AssetServer: &assetserver.Options{
Assets: assets,
},
Bind: []interface{}{
app,
},
})
if err != nil {
log.Fatal(err)
}
}
type App struct {
ctx context.Context
}
func (a *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,
AssetServer: &assetserver.Options{
Assets: assets,
},
Bind: []interface{}{
app,
&mystruct1{},
&mystruct2{},
},
})
```
You may bind enums types as well. In that case you should create array that will contain all possible enum values, instrument enum type and bind it to the app via `EnumBind`:
```go {16-18} title="app.go"
type Weekday string
const (
Sunday Weekday = "Sunday"
Monday Weekday = "Monday"
Tuesday Weekday = "Tuesday"
Wednesday Weekday = "Wednesday"
Thursday Weekday = "Thursday"
Friday Weekday = "Friday"
Saturday Weekday = "Saturday"
)
var AllWeekdays = []struct {
Value Weekday
TSName string
}{
{Sunday, "SUNDAY"},
{Monday, "MONDAY"},
{Tuesday, "TUESDAY"},
{Wednesday, "WEDNESDAY"},
{Thursday, "THURSDAY"},
{Friday, "FRIDAY"},
{Saturday, "SATURDAY"},
}
```
```go {10-12}
//...
err := wails.Run(&options.App{
Title: "Basic Demo",
Width: 1024,
Height: 768,
AssetServer: &assetserver.Options{
Assets: assets,
},
Bind: []interface{}{
app,
&mystruct1{},
&mystruct2{},
},
EnumBind: []interface{}{
AllWeekdays,
},
})
```
When you run `wails dev` (or `wails generate module`), a frontend module will be generated containing the following:
- JavaScript bindings for all bound methods
- TypeScript declarations for all bound methods
- TypeScript definitions for all Go structs used as inputs or outputs by the bound methods
This makes it incredibly simple to call Go code from the frontend, using the same strongly typed datastructures.
## 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
### Calling bound Go methods
When you run your application with `wails dev`, it will automatically generate JavaScript bindings for your structs in a directory called `wailsjs/go` (You can also do this by running `wails generate module`). The generated files mirror the package names in your application. In the example above, we bind `app`, which has one public method `Greet`. This will lead to the generation of the following files:
```bash
wailsjs
└─go
└─main
├─App.d.ts
└─App.js
```
Here we can see that there is a `main` package that contains the JavaScript bindings for the bound `App` struct, as well as the TypeScript declaration file for those methods. To call `Greet` from our frontend, we simply import the method and call it like a regular JavaScript function:
```javascript
// ...
import { Greet } from "../wailsjs/go/main/App";
function doGreeting(name) {
Greet(name).then((result) => {
// Do something with result
});
}
```
The TypeScript declaration file gives you the correct types for the bound methods:
```ts
export function Greet(arg1: string): Promise<string>;
```
The generated 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 class.
:::info Note
Struct fields _must_ have a valid `json` tag to be included in the generated TypeScript.
Anonymous nested structs are not supported at this time.
:::
It is possible to send structs back to Go. Any JavaScript map/class 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.
There is also support for Go methods that use structs in their signature. All Go structs specified by a 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.
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)
}
```
The `wailsjs/go/main/App.js` file will still have the following code:
```js title="App.js"
export function Greet(arg1) {
return window["go"]["main"]["App"]["Greet"](arg1);
}
```
But the `wailsjs/go/main/App.d.ts` file will be updated with the following code:
```ts title="App.d.ts"
import { main } from "../models";
export function Greet(arg1: main.Person): Promise<string>;
```
As we can see, the "main" namespace is imported from a new "models.ts" file. This file contains all the struct definitions used by our bound methods. In this example, this is a `Person` struct. If we look at `models.ts`, we can see how the models are defined:
```ts title="models.ts"
export namespace main {
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 && a.map) {
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 { Greet } from "../wailsjs/go/main/App";
import { main } from "../wailsjs/go/models";
function generate() {
let person = new main.Person();
person.name = "Peter";
person.age = 27;
Greet(person).then((result) => {
console.log(result);
});
}
```
The combination of generated bindings and TypeScript models makes for a powerful development environment.
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).
### 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](reference/runtime/intro.mdx).
[^1]: There is a very small subset of libraries that use features unsupported in WebViews. There are often alternatives and workarounds for such cases.

73
website/i18n/de/docusaurus-plugin-content-docs/current/introduction.mdx Normal file
View file

@ -0,0 +1,73 @@
---
sidebar_position: 1
---
# Introduction
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.
### Features
- Native Menus, Dialogs, Theming and Translucency
- Windows, macOS and linux support
- Built in templates for Svelte, React, Preact, Vue, Lit and Vanilla JS
- Easily call Go methods from JavaScript
- Automatic Go struct to TypeScript model generation
- No CGO or external DLLs required on Windows
- Live development mode using the power of [Vite](https://vitejs.dev/)
- Powerful CLI to easily Create, Build and Package applications
- A rich [runtime library](/docs/reference/runtime/intro)
- Applications built with Wails are Apple & Microsoft Store compliant
This is varly - a desktop application for MacOS & Windows written using Wails. Not only does it look great, it uses native menus and translucency - everything you'd expect from a modern native app.
```mdx-code-block
<p class="text--center">
<img
src={require("@site/static/img/showcase/varly2.webp").default}
style={{ width: "75%", "max-width": "800px" }}
/>
</p>
```
### Quick Start Templates
Wails comes with a number of pre-configured templates that allow you to get your application up and running quickly. There are templates for the following frameworks: Svelte, React, Vue, Preact, Lit and Vanilla. There are both JavaScript and TypeScript versions for each template.
### 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 delivers a small runtime. Instead, it reuses 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 models for 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!

251
website/i18n/de/docusaurus-plugin-content-docs/current/reference/cli.mdx Normal file
View file

@ -0,0 +1,251 @@
---
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 `vscode` or `goland` | |
| -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](../guides/ides.mdx).
### 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](../community/templates.mdx)
:::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 |
|:-------------------- |:------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ |:--------------------------------------------------------------------------------------------------------------------------------------------------- |
| -clean | Cleans the `build/bin` directory | |
| -compiler "compiler" | Use a different go compiler to build, eg go1.15beta1 | go |
| -debug | Retains debug information in the application and shows the debug console. Allows the use of the devtools in the application window | |
| -devtools | Allows the use of the devtools in the application window in production (when -debug is not used). Ctrl/Cmd+Shift+F12 may be used to open the devtools window. *NOTE*: This option will make your application FAIL Mac appstore guidelines. Use for debugging only. | |
| -dryrun | Prints the build command without executing it | |
| -f | Force build application | |
| -garbleargs | Arguments to pass to garble | `-literals -tiny -seed=random` |
| -ldflags "flags" | Additional ldflags to pass to the compiler | |
| -m | Skip mod tidy before compile | |
| -nopackage | Do not package application | |
| -nocolour | Disable colour in output | |
| -nosyncgomod | Do not sync go.mod with the Wails version | |
| -nsis | Generate NSIS installer for Windows | |
| -o filename | Output filename | |
| -obfuscated | Obfuscate the application using [garble](https://github.com/burrowers/garble) | |
| -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. | platform = `GOOS` environment variable if given else `runtime.GOOS`.<br/>arch = `GOARCH` environment variable if given else `runtime.GOARCH`. |
| -race | Build with Go's race detector | |
| -s | Skip building the frontend | |
| -skipbindings | Skip bindings generation | |
| -tags "extra tags" | Build tags to pass to Go compiler. Must be quoted. Space or comma (but not both) separated | |
| -trimpath | Remove all file system paths from the resulting executable. | |
| -u | Updates your project's `go.mod` to use the same version of Wails as the CLI | |
| -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 |
| -windowsconsole | Keep the console window for Windows builds | |
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](../guides/manual-builds.mdx) guide.
Example:
`wails build -clean -o myproject.exe`
:::info
On Mac, the application will be bundled with `Info.plist`, not `Info.dev.plist`.
:::
:::info UPX on Apple Silicon
There are [issues](https://github.com/upx/upx/issues/446) with using UPX with Apple Silicon.
:::
:::info Set minimal version for MacOS
You can override default [minimal version](../gettingstarted/installation#supported-platforms) of macOS for your app by providing version via `CGO_CFLAGS` and `CGO_LDFLAGS` environment variables. e.g. `CGO_CFLAGS=-mmacosx-version-min=10.15.0 CGO_LDFLAGS=-mmacosx-version-min=10.15.0 wails build`
:::
:::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.18
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
- On macOS, it will bundle the application into a `.app` file and run it. It will use a `build/darwin/Info.dev.plist` for development.
| Flag | Description | Default |
|:---------------------------- |:----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |:--------------------- |
| -appargs "args" | Arguments passed to the application in shell style | |
| -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 |
| -debounce | The time to wait for reload after an asset change is detected | 100 (milliseconds) |
| -devserver "host:port" | The address to bind the wails dev server to | "localhost:34115" |
| -extensions | Extensions to trigger rebuilds (comma separated) | go |
| -forcebuild | Force build of application | |
| -frontenddevserverurl "url" | Use 3rd party dev server url to serve assets, EG Vite | "" |
| -ldflags "flags" | Additional ldflags to pass to the compiler | |
| -loglevel "loglevel" | Loglevel to use - Trace, Debug, Info, Warning, Error | Debug |
| -nocolour | Turn off colour cli output | false |
| -noreload | Disable automatic reload when assets change | |
| -nosyncgomod | Do not sync go.mod with the Wails version | false |
| -race | Build with Go's race detector | false |
| -reloaddirs | Additional directories to trigger reloads (comma separated) | Value in `wails.json` |
| -s | Skip building the frontend | false |
| -save | Saves the given `assetdir`, `reloaddirs`, `wailsjsdir`, `debounce`, `devserver` and `frontenddevserverurl` flags in `wails.json` to become the defaults for subsequent invocations. | |
| -skipbindings | Skip bindings generation | |
| -tags "extra tags" | Build tags to pass to compiler (quoted and space separated) | |
| -v | Verbosity level (0 - silent, 1 - standard, 2 - verbose) | 1 |
| -wailsjsdir | The directory to generate the generated Wails JS modules | Value in `wails.json` |
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](../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](../guides/application-development.mdx#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](../guides/templates.mdx).
### module
The `wails generate module` command allows you to manually generate the `wailsjs` directory for your application.
| Flag | Description | Default |
|:-------------------- |:----------------------------------------------------------- |:------- |
| -compiler "compiler" | Use a different go compiler to build, eg go1.15beta1 | go |
| -tags "extra tags" | Build tags to pass to compiler (quoted and space separated) | |
## 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.

236
website/i18n/de/docusaurus-plugin-content-docs/current/reference/menus.mdx Normal file
View file

@ -0,0 +1,236 @@
---
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 it in the [`Menu`](../reference/options.mdx#menu) application config, or by calling the runtime method [MenuSetApplicationMenu](../reference/runtime/menu.mdx#menusetapplicationmenu).
An example of how to create a menu:
```go
app := NewApp()
AppMenu := menu.NewMenu()
if runtime.GOOS == "darwin" {
AppMenu.Append(menu.AppMenu()) // On macOS platform, this must be done right after `NewMenu()`
}
FileMenu := AppMenu.AddSubmenu("File")
FileMenu.AddText("&Open", keys.CmdOrCtrl("o"), func(_ *menu.CallbackData) {
// do something
})
FileMenu.AddSeparator()
FileMenu.AddText("Quit", keys.CmdOrCtrl("q"), func(_ *menu.CallbackData) {
// `rt` is an alias of "github.com/wailsapp/wails/v2/pkg/runtime" to prevent collision with standard package
rt.Quit(app.ctx)
})
if runtime.GOOS == "darwin" {
AppMenu.Append(menu.EditMenu()) // On macOS platform, EditMenu should be appended to enable Cmd+C, Cmd+V, Cmd+Z... shortcuts
}
err := wails.Run(&options.App{
Title: "Menus Demo",
Width: 800,
Height: 600,
Menu: AppMenu, // reference the menu above
Bind: []interface{}{
app,
},
)
// ...
```
It is also possible to dynamically update the menu, by updating the menu struct and calling [MenuUpdateApplicationMenu](../reference/runtime/menu.mdx#menuupdateapplicationmenu).
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` | `f1` | `f16` | `f31` |
| `tab` | `f2` | `f17` | `f32` |
| `return` | `f3` | `f18` | `f33` |
| `enter` | `f4` | `f19` | `f34` |
| `escape` | `f5` | `f20` | `f35` |
| `left` | `f6` | `f21` | `numlock` |
| `right` | `f7` | `f22` | |
| `up` | `f8` | `f23` | |
| `down` | `f9` | `f24` | |
| `space` | `f10` | `f25` | |
| `delete` | `f11` | `f36` | |
| `home` | `f12` | `f37` | |
| `end` | `f13` | `f38` | |
| `page up` | `f14` | `f39` | |
| `page down` | `f15` | `f30` | |
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) *Menu
```
You can also create menu items directly on a menu by using the "Add" helpers:
```go title="Package: github.com/wailsapp/wails/v2/pkg/menu"
func (m *Menu) AddText(label string, accelerator *keys.Accelerator, click Callback) *MenuItem
func (m *Menu) AddSeparator() *MenuItem
func (m *Menu) AddRadio(label string, selected bool, accelerator *keys.Accelerator, click Callback) *MenuItem
func (m *Menu) AddCheckbox(label string, checked bool, accelerator *keys.Accelerator, click Callback) *MenuItem
func (m *Menu) AddSubMenu(label string, menu *Menu) *MenuI
```
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()` |

964
website/i18n/de/docusaurus-plugin-content-docs/current/reference/options.mdx Normal file
View file

@ -0,0 +1,964 @@
---
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"
"github.com/wailsapp/wails/v2/pkg/options/assetserver"
"github.com/wailsapp/wails/v2/pkg/options/linux"
"github.com/wailsapp/wails/v2/pkg/options/mac"
"github.com/wailsapp/wails/v2/pkg/options/windows"
)
func main() {
err := wails.Run(&options.App{
Title: "Menus Demo",
Width: 800,
Height: 600,
DisableResize: false,
Fullscreen: false,
WindowStartState: options.Maximised,
Frameless: true,
MinWidth: 400,
MinHeight: 400,
MaxWidth: 1280,
MaxHeight: 1024,
StartHidden: false,
HideWindowOnClose: false,
BackgroundColour: &options.RGBA{R: 0, G: 0, B: 0, A: 255},
AlwaysOnTop: false,
AssetServer: &assetserver.Options{
Assets: assets,
Handler: assetsHandler,
Middleware: assetsMidldeware,
},
Menu: app.applicationMenu(),
Logger: nil,
LogLevel: logger.DEBUG,
LogLevelProduction: logger.ERROR,
OnStartup: app.startup,
OnDomReady: app.domready,
OnShutdown: app.shutdown,
OnBeforeClose: app.beforeClose,
CSSDragProperty: "--wails-draggable",
CSSDragValue: "drag",
EnableDefaultContextMenu: false,
EnableFraudulentWebsiteDetection: false,
Bind: []interface{}{
app,
},
EnumBind: []interface{}{
AllWeekdays,
},
ErrorFormatter: func(err error) any { return err.Error() },
SingleInstanceLock: &options.SingleInstanceLock{
UniqueId: "c9c8fd93-6758-4144-87d1-34bdb0a8bd60",
OnSecondInstanceLaunch: app.onSecondInstanceLaunch,
},
DragAndDrop: &options.DragAndDrop{
EnableFileDrop: false,
DisableWebViewDrop: false,
CSSDropProperty: "--wails-drop-target",
CSSDropValue: "drop",
},
Windows: &windows.Options{
WebviewIsTransparent: false,
WindowIsTranslucent: false,
BackdropType: windows.Mica,
DisablePinchZoom: false,
DisableWindowIcon: false,
DisableFramelessWindowDecorations: false,
WebviewUserDataPath: "",
WebviewBrowserPath: "",
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),
},
// ZoomFactor is the zoom factor for the WebView2. This is the option matching the Edge user activated zoom in or out.
ZoomFactor: float64,
// IsZoomControlEnabled enables the zoom factor to be changed by the user.
IsZoomControlEnabled: bool,
// User messages that can be customised
Messages: *windows.Messages
// OnSuspend is called when Windows enters low power mode
OnSuspend: func()
// OnResume is called when Windows resumes from low power mode
OnResume: func(),
// Disable GPU hardware acceleration for the webview
WebviewGpuDisabled: false,
// Class name for the window. If empty, 'wailsWindow' will be used.
WindowClassName: "MyWindow",
},
Mac: &mac.Options{
TitleBar: &mac.TitleBar{
TitlebarAppearsTransparent: true,
HideTitle: false,
HideTitleBar: false,
FullSizeContent: false,
UseToolbar: false,
HideToolbarSeparator: true,
OnFileOpen: app.onFileOpen,
OnUrlOpen: app.onUrlOpen,
},
Appearance: mac.NSAppearanceNameDarkAqua,
WebviewIsTransparent: true,
WindowIsTranslucent: false,
About: &mac.AboutInfo{
Title: "My Application",
Message: "© 2021 Me",
Icon: icon,
},
},
Linux: &linux.Options{
Icon: icon,
WindowIsTranslucent: false,
WebviewGpuPolicy: linux.WebviewGpuPolicyAlways,
ProgramName: "wails"
},
Debug: options.Debug{
OpenInspectorOnStartup: false,
},
})
if err != nil {
log.Fatal(err)
}
}
```
### Title
The text shown in the window's title bar.
Name: Title<br/> Type: `string`
### Width
The initial width of the window.
Name: Width<br/> Type: `int`<br/> Default: 1024.
### Height
The initial height of the window.
Name: Height<br/> Type: `int`<br/> Default: 768
### DisableResize
By default, the main window is resizable. Setting this to `true` will keep it a fixed size.
Name: DisableResize<br/> Type: `bool`
### Fullscreen
Deprecated: Please use [WindowStartState](#windowstartstate).
### WindowStartState
Defines how the window should present itself at startup.
| Value | Win | Mac | Lin |
| ---------- | --- | --- | --- |
| Fullscreen | ✅ | ✅ | ✅ |
| Maximised | ✅ | ✅ | ✅ |
| Minimised | ✅ | ❌ | ✅ |
Name: WindowStartState<br/> Type: `options.WindowStartState`
### Frameless
When set to `true`, the window will have no borders or title bar. Also see [Frameless Windows](../guides/frameless.mdx).
Name: Frameless<br/> Type: `bool`
### MinWidth
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.
Name: MinWidth<br/> Type: `int`
### MinHeight
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.
Name: MinHeight<br/> Type: `int`
### MaxWidth
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.
Name: MaxWidth<br/> Type: `int`
### MaxHeight
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.
Name: MaxHeight<br/> Type: `int`
### StartHidden
When set to `true`, the application will be hidden until [WindowShow](../reference/runtime/window.mdx#windowshow) is called.
Name: StartHidden<br/> Type: `bool`
### HideWindowOnClose
By default, closing the window will close the application. Setting this to `true` means closing the window will
hide the window instead.
Name: HideWindowOnClose<br/> Type: `bool`
### BackgroundColour
This value is the default background colour of the window. Example: options.NewRGBA(255,0,0,128) - Red at 50% transparency
Name: BackgroundColour<br/> Type: `*options.RGBA`<br/> Default: white
### AlwaysOnTop
Indicates that the window should stay above other windows when losing focus.
Name: AlwaysOnTop<br/> Type: `bool`
### Assets
Deprecated: Please use Assets on [AssetServer specific options](#assetserver).
### AssetsHandler
Deprecated: Please use AssetsHandler on [AssetServer specific options](#assetserver).
### AssetServer
This defines AssetServer specific options. It allows to customize the AssetServer with static assets, serving assets dynamically with an `http.Handler` or hook into the request chain with an `assetserver.Middleware`.
Not all features of an `http.Request` are currently supported, please see the following feature matrix:
| Feature | Win | Mac | Lin |
| ----------------------- | --- | --- | ------ |
| GET | ✅ | ✅ | ✅ |
| POST | ✅ | ✅ | ✅ [^1] |
| PUT | ✅ | ✅ | ✅ [^1] |
| PATCH | ✅ | ✅ | ✅ [^1] |
| DELETE | ✅ | ✅ | ✅ [^1] |
| Request Headers | ✅ | ✅ | ✅ [^1] |
| Request Body | ✅ | ✅ | ✅ [^2] |
| Request Body Streaming | ✅ | ✅ | ✅ [^2] |
| Response StatusCodes | ✅ | ✅ | ✅ [^1] |
| Response Headers | ✅ | ✅ | ✅ [^1] |
| Response Body | ✅ | ✅ | ✅ |
| Response Body Streaming | ❌ | ✅ | ✅ |
| WebSockets | ❌ | ❌ | ❌ |
| HTTP Redirects 30x | ✅ | ❌ | ❌ |
Name: AssetServer<br/> Type: `*assetserver.Options`
#### Assets
The static frontend assets to be used by the application.
A GET request is first tried to be served from this `fs.FS`. If the `fs.FS` returns `os.ErrNotExist` for that file, the request handling will fallback to the [Handler](#handler) and tries to serve the GET request from it.
If set to nil, all GET requests will be forwarded to [Handler](#handler).
Name: Assets<br/> Type: `fs.FS`
#### Handler
The assets handler is a generic `http.Handler` for fallback handling of assets that can't be found.
The handler will be called for every GET request that can't be served from [Assets](#assets), due to `os.ErrNotExist`. Furthermore all non GET requests will always be served from this Handler. If not defined, the result is the following in cases where the Handler would have been called:
- GET request: `http.StatusNotFound`
- Other request: `http.StatusMethodNotAllowed`
:::info
This does not work with vite v5.0.0+ and wails v2 due to changes in vite. Changes are planned in v3 to support similar functionality under vite v5.0.0+. If you need this feature, stay with vite v4.0.0+. See [issue 3240](https://github.com/wailsapp/wails/issues/3240) for details
:::
NOTE: When used in combination with a Frontend DevServer there might be limitations, eg. Vite serves the index.html on every path, that does not contain a file extension.
Name: AssetsHandler<br/> Type: `http.Handler`
#### Middleware
Middleware is a HTTP Middleware which allows to hook into the AssetServer request chain. It allows to skip the default request handler dynamically, e.g. implement specialized Routing etc. The Middleware is called to build a new `http.Handler` used by the AssetSever and it also receives the default handler used by the AssetServer as an argument.
If not defined, the default AssetServer request chain is executed.
Name: Middleware<br/> Type: `assetserver.Middleware`
### 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.
:::
Name: Menu<br/> Type: `*menu.Menu`
### Logger
The logger to be used by the application. More details about logging in the [Log Reference](../reference/runtime/log.mdx).
Name: Logger<br/> Type: `logger.Logger`<br/> Default: Logs to Stdout
### LogLevel
The default log level. More details about logging in the [Log Reference](../reference/runtime/log.mdx).
Name: LogLevel<br/> Type: `logger.LogLevel`<br/> Default: `Info` in dev mode, `Error` in production mode
### LogLevelProduction
The default log level for production builds. More details about logging in the [Log Reference](../reference/runtime/log.mdx).
Name: LogLevelProduction<br/> Type: `logger.LogLevel`<br/> Default: `Error`
### OnStartup
This callback is called after the frontend has been created, but before `index.html` has been loaded. It is given the application context.
Name: OnStartup<br/> Type: `func(ctx context.Context)`
### OnDomReady
This callback is called after the frontend has loaded `index.html` and its resources. It is given the application context.
Name: OnDomReady<br/> Type: `func(ctx context.Context)`
### OnShutdown
This callback is called after the frontend has been destroyed, just before the application terminates. It is given the application context.
Name: OnShutdown<br/> Type: `func(ctx context.Context)`
### OnBeforeClose
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"
}
```
Name: OnBeforeClose<br/> Type: `func(ctx context.Context) bool`
### CSSDragProperty
Indicates the CSS property to use to identify which elements can be used to drag the window. Default: `--wails-draggable`.
Name: CSSDragProperty<br/> Type: `string`
### CSSDragValue
Indicates what value the `CSSDragProperty` style should have to drag the window. Default: `drag`.
Name: CSSDragValue<br/> Type: `string`
### EnableDefaultContextMenu
EnableDefaultContextMenu enables the browser's default context-menu in production.
By default, the browser's default context-menu is only available in development and in a `-debug` [build](../reference/cli.mdx#build) along with the devtools inspector, Using this option you can enable the default context-menu in `production` while the devtools inspector won't be available unless the `-devtools` build flag is used.
When this option is enabled, by default the context-menu will only be shown for text contexts (where Cut/Copy/Paste is needed), to override this behavior, you can use the CSS property `--default-contextmenu` on any HTML element (including the `body`) with the following values :
| CSS Style | Behavior |
| ------------------------------ | ------------------------------------------------------------------------------------------------------------------------------------------------------- |
| `--default-contextmenu: auto;` | (**default**) will show the default context menu only if :<br/> contentEditable is true OR text has been selected OR element is input or textarea |
| `--default-contextmenu: show;` | will always show the default context menu |
| `--default-contextmenu: hide;` | will always hide the default context menu |
This rule is inherited like any normal CSS rule, so nesting works as expected.
:::note
This filtering functionality is only enabled in production, so in development and in debug build, the full context-menu is always available everywhere.
:::
:::warning
This filtering functionality is NOT a security measure, the developer should expect that the full context-menu could be leaked anytime which could contain commands like (Download image, Reload, Save webpage), if this is a concern, the developer SHOULD NOT enable the default context-menu.
:::
Name: EnableDefaultContextMenu<br/> Type: `bool`
### EnableFraudulentWebsiteDetection
EnableFraudulentWebsiteDetection enables scan services for fraudulent content, such as malware or phishing attempts. These services might send information from your app like URLs navigated to and possibly other content to cloud services of Apple and Microsoft.
Name: EnableFraudulentWebsiteDetection<br/> Type: `bool`
### Bind
A slice of struct instances defining methods that need to be bound to the frontend.
Name: Bind<br/> Type: `[]interface{}`
### EnumBind
A slice of Enum arrays that need to be bound to the frontend.
Name: EnumBind<br/> Type: `[]interface{}`
### ErrorFormatter
A function that determines how errors are formatted when returned by a JS-to-Go method call. The returned value will be marshalled as JSON.
Name: ErrorFormatter<br/> Type: `func (error) any`
### SingleInstanceLock
Enables single instance locking. This means that only one instance of your application can be running at a time.
Name: SingleInstanceLock<br/> Type: `*options.SingleInstanceLock`
#### UniqueId
This id is used to generate the mutex name on Windows and macOS and the dbus name on Linux. Use a UUID to ensure that the id is unique.
Name: UniqueId<br/> Type: `string`
#### OnSecondInstanceLaunch
Callback that is called when a second instance of your app is launched.
Name: OnSecondInstanceLaunch<br/> Type: `func(secondInstanceData SecondInstanceData)`
### Drag and Drop
Defines the behavior of drag and drop events on the window.
Name: DragAndDrop<br/> Type: `options.DragAndDrop`
#### EnableFileDrop
EnableFileDrop enables wails' drag and drop functionality that returns the dropped in files' absolute paths.
When it is set to `true` the [runtime methods](../reference/runtime/draganddrop.mdx) can be used. <br/> Or you can listen for the `wails:file-drop` event with [runtime EventsOn method](../reference/runtime/events.mdx#eventson) both on the Javascript and GO side to implement any functionality you would like.
The event returns the coordinates of the drop and a file path slice.
Name: EnableFileDrop<br/> Type: `bool`<br/> Default: `false`
#### DisableWebViewDrop
Disables the webview's drag and drop functionality.
It can be used to prevent accidental opening of dragged in files in the webview, when there is no need for drag and drop.
Name: DisableWebViewDrop<br/> Type: `bool`<br/> Default: `false`
#### CSSDropProperty
CSS property to test for drag and drop target elements.
Name: CSSDropProperty<br/> Type: `string`<br/> Default: `--wails-drop-target`
#### CSSDropValue
The CSS Value that the CSSDropProperty must have to be a valid drop target. Default "drop"
Name: CSSDropValue<br/> Type: `string`<br/> Default: `drop`
### Windows
This defines [Windows specific options](#windows).
Name: Windows<br/> Type: `*windows.Options`
#### WebviewIsTransparent
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)` for `background-color` in your CSS, the host window will show through. Often combined with [WindowIsTranslucent](#WindowIsTranslucent) to make frosty-looking applications.
Name: WebviewIsTransparent<br/> Type: `bool`
#### WindowIsTranslucent
Setting this to `true` will make the window background translucent. Often combined with [WebviewIsTransparent](#WebviewIsTransparent).
For Windows 11 versions before build 22621, this will use the [BlurBehind](https://learn.microsoft.com/en-us/windows/win32/dwm/blur-ovw) method for translucency, which can be slow. For Windows 11 versions after build 22621, this will enable the newer translucency types that are much faster. By default, the type of translucency used will be determined by Windows. To configure this, use the [BackdropType](#BackdropType) option.
Name: WindowIsTranslucent<br/> Type: `bool`
#### BackdropType
:::note
Requires Windows 11 build 22621 or later.
:::
Sets the translucency type of the window. This is only applicable if [WindowIsTranslucent](#WindowIsTranslucent) is set to `true`.
Name: BackdropType<br/> Type `windows.BackdropType`
The value can be one of the following:
| Value | Description |
| ------- | ----------------------------------------------------------------------------------------- |
| Auto | Let Windows decide which backdrop to use |
| None | Do not use translucency |
| Acrylic | Use [Acrylic](https://learn.microsoft.com/en-us/windows/apps/design/style/acrylic) effect |
| Mica | Use [Mica](https://learn.microsoft.com/en-us/windows/apps/design/style/mica) effect |
| Tabbed | Use Tabbed. This is a backdrop that is similar to Mica. |
#### ZoomFactor
Name: ZoomFactor<br/> Type: `float64`
This defines the zoom factor for the WebView2. This is the option matching the Edge user activated zoom in or out.
#### IsZoomControlEnabled
Name: IsZoomControlEnabled<br/> Type: `bool`
This enables the zoom factor to be changed by the user. Please note that the zoom factor can be set in the options while disallowing the user to change it at runtime (f.e. for a kiosk application or similar).
#### DisablePinchZoom
Setting this to `true` will disable pinch zoom gestures.
Name: DisablePinchZoom<br/> Type: `bool`
#### DisableWindowIcon
Setting this to `true` will remove the icon in the top left corner of the title bar.
Name: DisableWindowIcon<br/> Type: `bool`
#### DisableFramelessWindowDecorations
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.
Name: DisableFramelessWindowDecorations<br/> Type: `bool`
#### WebviewUserDataPath
This defines the path where the WebView2 stores the user data. If empty `%APPDATA%\[BinaryName.exe]` will be used.
Name: WebviewUserDataPath<br/> Type: `string`
#### WebviewBrowserPath
This defines the path to a directory with WebView2 executable files and libraries. If empty, webview2 installed in the system will be used.
Important information about distribution of fixed version runtime:
- [How to get and extract runtime](https://docs.microsoft.com/en-us/microsoft-edge/webview2/concepts/distribution#details-about-the-fixed-version-runtime-distribution-mode)
- [Known issues for fixed version](https://docs.microsoft.com/en-us/microsoft-edge/webview2/concepts/distribution#known-issues-for-fixed-version)
- [The path of fixed version of the WebView2 Runtime should not contain \Edge\Application\.](https://docs.microsoft.com/en-us/microsoft-edge/webview2/reference/win32/webview2-idl?view=webview2-1.0.1245.22#createcorewebview2environmentwithoptions)
Name: WebviewBrowserPath<br/> Type: `string`
#### Theme
Minimum Windows Version: Windows 10 2004/20H1
This defines the theme that the application should use:
| Value | Description |
| ------------- | --------------------------------------------------------------------------------------------------------------------------------------------- |
| SystemDefault | _Default_. The theme will be based on the system default. If the user changes their theme, the application will update to use the new setting |
| Dark | The application will use a dark theme exclusively |
| Light | The application will use a light theme exclusively |
Name: Theme<br/> Type: `windows.Theme`
#### CustomTheme
:::note
Minimum Windows Version: Windows 10/11 2009/21H2 Build 22000
:::
Allows you to specify custom colours for TitleBar, TitleText and Border for both light and dark mode, as well as when the window is active or inactive.
Name: CustomTheme<br/> Type: `windows.CustomTheme`
##### CustomTheme type
The CustomTheme struct uses `int32` to specify the colour values. These are in the standard(!) Windows format of: `0x00BBGGAA`. A helper function is provided to do RGB conversions into this format: `windows.RGB(r,g,b uint8)`.
NOTE: Any value not provided will default to black.
```go
type ThemeSettings struct {
DarkModeTitleBar int32
DarkModeTitleBarInactive int32
DarkModeTitleText int32
DarkModeTitleTextInactive int32
DarkModeBorder int32
DarkModeBorderInactive int32
LightModeTitleBar int32
LightModeTitleBarInactive int32
LightModeTitleText int32
LightModeTitleTextInactive int32
LightModeBorder int32
LightModeBorderInactive int32
}
```
Example:
```go
CustomTheme: &windows.ThemeSettings{
// Theme to use when window is active
DarkModeTitleBar: windows.RGB(255, 0, 0), // Red
DarkModeTitleText: windows.RGB(0, 255, 0), // Green
DarkModeBorder: windows.RGB(0, 0, 255), // Blue
LightModeTitleBar: windows.RGB(200, 200, 200),
LightModeTitleText: windows.RGB(20, 20, 20),
LightModeBorder: windows.RGB(200, 200, 200),
// Theme to use when window is inactive
DarkModeTitleBarInactive: windows.RGB(128, 0, 0),
DarkModeTitleTextInactive: windows.RGB(0, 128, 0),
DarkModeBorderInactive: windows.RGB(0, 0, 128),
LightModeTitleBarInactive: windows.RGB(100, 100, 100),
LightModeTitleTextInactive: windows.RGB(10, 10, 10),
LightModeBorderInactive: windows.RGB(100, 100, 100),
},
```
#### Messages
A struct of strings used by the webview2 installer if a valid webview2 runtime is not found.
Name: Messages<br/> Type: `*windows.Messages`
Customise this for any language you choose to support.
#### ResizeDebounceMS
ResizeDebounceMS is the amount of time to debounce redraws of webview2 when resizing the window. The default value (0) will perform redraws as fast as it can.
Name: ResizeDebounceMS<br/> Type: `uint16`
#### OnSuspend
If set, this function will be called when Windows initiates a switch to low power mode (suspend/hibernate)
Name: OnSuspend<br/> Type: `func()`
#### OnResume
If set, this function will be called when Windows resumes from low power mode (suspend/hibernate)
Name: OnResume<br/> Type: `func()`
#### WebviewGpuIsDisabled
Setting this to `true` will disable GPU hardware acceleration for the webview.
Name: WebviewGpuIsDisabled<br/> Type: `bool`
#### EnableSwipeGestures
Setting this to `true` will enable swipe gestures for the webview.
Name: EnableSwipeGestures<br/> Type: `bool`
#### WindowClassName
Class name for the window. If empty, 'wailsWindow' will be used.
Name: WindowClassName<br/> Type: `string`
### Mac
This defines [Mac specific options](#mac).
Name: Mac<br/> Type: `*mac.Options`
#### TitleBar
The TitleBar struct provides the ability to configure the look and feel of the title bar.
Name: TitleBar<br/> Type: [`*mac.TitleBar`](#titlebar-struct)
##### 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. This has the effect of hiding the titlebar and the content fill the window. [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()` | ![](/img/reference/titlebar-default.webp) |
| `mac.TitleBarHidden()` | ![](/img/reference/titlebar-hidden.webp) |
| `mac.TitleBarHiddenInset()` | ![](/img/reference/titlebar-hidden-inset.webp) |
Example:
```go
Mac: &mac.Options{
TitleBar: mac.TitleBarHiddenInset(),
}
```
Click [here](https://github.com/lukakerr/NSWindowStyles) for some inspiration on customising the titlebar.
#### Appearance
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.
Name: Appearance<br/> Type: [`mac.AppearanceType`](#appearance-type)
##### 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,
}
```
#### WebviewIsTransparent
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)` for `background-color` in your CSS, the host window will show through. Often combined with [WindowIsTranslucent](#WindowIsTranslucent) to make frosty-looking applications.
Name: WebviewIsTransparent<br/> Type: `bool`
#### WindowIsTranslucent
Setting this to `true` will make the window background translucent. Often combined with [WebviewIsTransparent](#WebviewIsTransparent) to make frosty-looking applications.
Name: WindowIsTranslucent<br/> Type: `bool`
#### OnFileOpen
Callback that is called when a file is opened with the application.
Name: OnFileOpen<br/> Type: `func(filePath string)`
#### OnUrlOpen
Callback that is called when a URL is opened with the application.
Name: OnUrlOpen<br/> Type: `func(filePath string)`
#### Preferences
The Preferences struct provides the ability to configure the Webview preferences.
Name: Preferences<br/> Type: [`*mac.Preferences`](#preferences-struct)
##### Preferences struct
You can specify the webview preferences.
```go
type Preferences struct {
TabFocusesLinks u.Bool
TextInteractionEnabled u.Bool
FullscreenEnabled u.Bool
}
```
| Name | Description |
| ---------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| TabFocusesLinks | A Boolean value that indicates whether pressing the tab key changes the focus to links and form controls. [Apple Docs](https://developer.apple.com/documentation/webkit/wkpreferences/2818595-tabfocuseslinks?language=objc) |
| TextInteractionEnabled | A Boolean value that indicates whether to allow people to select or otherwise interact with text. [Apple Docs](https://developer.apple.com/documentation/webkit/wkpreferences/3727362-textinteractionenabled?language=objc) |
| FullscreenEnabled | A Boolean value that indicates whether a web view can display content full screen. [Apple Docs](https://developer.apple.com/documentation/webkit/wkpreferences/3917769-elementfullscreenenabled?language=objc) |
Example:
```go
Mac: &mac.Options{
Preferences: &mac.Preferences{
TabFocusesLinks: mac.Enabled,
TextInteractionEnabled: mac.Disabled,
FullscreenEnabled: mac.Enabled,
}
}
```
#### About
This configuration lets you set the title, message and icon for the "About" menu item in the app menu created by the "AppMenu" role.
Name: About<br/> Type: [`*mac.AboutInfo`](#about-struct)
##### 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:
```mdx-code-block
<div class="text--center">
<img
src={require("@site/static/img/reference/about-menu.webp").default}
class="screenshot"
/>
</div>
<br />
```
When clicked, that will open an about message box:
```mdx-code-block
<div class="text--center">
<img
src={require("@site/static/img/reference/about-dialog.webp").default}
width="40%"
class="screenshot"
/>
</div>
<br />
```
### Linux
This defines [Linux specific options](#linux).
Name: Linux<br/> Type: `*linux.Options`
#### Icon
Sets up the icon representing the window. This icon is used when the window is minimized (also known as iconified).
Name: Icon<br/> Type: `[]byte`
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.
#### WindowIsTranslucent
Setting this to `true` will make the window background translucent. Some window managers may ignore it, or result in a black window.
Name: WindowIsTranslucent<br/> Type: `bool`
#### WebviewGpuPolicy
This option is used for determining the webview's hardware acceleration policy.
Name: WebviewGpuPolicy<br/> Type: [`options.WebviewGpuPolicy`](#webviewgpupolicy-type)<br/> Default: `WebviewGpuPolicyAlways`
##### WebviewGpuPolicy type
| Value | Description |
| ------------------------ | -------------------------------------------------------------------- |
| WebviewGpuPolicyAlways | Hardware acceleration is always enabled |
| WebviewGpuPolicyOnDemand | Hardware acceleration is enabled/disabled as request by web contents |
| WebviewGpuPolicyNever | Hardware acceleration is always disabled |
#### ProgramName
This option is used to set the program's name for the window manager via GTK's g_set_prgname(). This name should not be localized, [see the docs](https://docs.gtk.org/glib/func.set_prgname.html).
When a .desktop file is created this value helps with window grouping and desktop icons when the .desktop file's `Name` property differs form the executable's filename.
Name: ProgramName<br/> Type: string<br/>
### Debug
This defines [Debug specific options](#Debug) that apply to debug builds.
Name: Debug<br/> Type: `options.Debug`
#### OpenInspectorOnStartup
Setting this to `true` will open the WebInspector on startup of the application.
Name: OpenInspectorOnStartup<br/> Type: `bool`
[^1]: This requires WebKit2GTK 2.36+ support and your app needs to be build with the build tag `webkit2_36` to activate support for this feature. This also bumps the minimum requirement of WebKit2GTK to 2.36 for your app.
[^2]: This requires WebKit2GTK 2.40+ support and your app needs to be build with the build tag `webkit2_40` to activate support for this feature. This also bumps the minimum requirement of WebKit2GTK to 2.40 for your app.

130
website/i18n/de/docusaurus-plugin-content-docs/current/reference/project-config.mdx Normal file
View file

@ -0,0 +1,130 @@
---
sidebar_position: 5
---
# Project Config
The project config resides in the `wails.json` file in the project directory. The structure of the config is:
```json5
{
// Project config version
"version": "",
// The project name
"name": "",
// Relative path to the directory containing the compiled assets, this is normally inferred and could be left empty
"assetdir": "",
// Additional directories to trigger reloads (comma separated), this is only used for some advanced asset configurations
"reloaddirs": "",
// The directory where the build files reside. Defaults to 'build'
"build:dir": "",
// Relative path to the frontend directory. Defaults to 'frontend'
"frontend:dir": "",
// The command to install node dependencies, run in the frontend directory - often `npm install`
"frontend:install": "",
// The command to build the assets, run in the frontend directory - often `npm run build`
"frontend:build": "",
// This command has been replaced by frontend:dev:build. If frontend:dev:build is not specified will falls back to this command. \nIf this command is also not specified will falls back to frontend:build
"frontend:dev": "",
// This command is the dev equivalent of frontend:build. If not specified falls back to frontend:dev
"frontend:dev:build": "",
// This command is the dev equivalent of frontend:install. If not specified falls back to frontend:install
"frontend:dev:install": "",
// This command is run in a separate process on `wails dev`. Useful for 3rd party watchers or starting 3d party dev servers
"frontend:dev:watcher": "",
// URL to a 3rd party dev server to be used to serve assets, EG Vite. \nIf this is set to 'auto' then the devServerUrl will be inferred from the Vite output
"frontend:dev:serverUrl": "",
// Relative path to the directory that the auto-generated JS modules will be created
"wailsjsdir": "",
// The name of the binary
"outputfilename": "",
// The default time the dev server waits to reload when it detects a change in assets
"debounceMS": 100,
// Address to bind the wails dev sever to. Default: localhost:34115
"devServer": "",
// Arguments passed to the application in shell style when in dev mode
"appargs": "",
// Defines if build hooks should be run though they are defined for an OS other than the host OS.
"runNonNativeBuildHooks": false,
"preBuildHooks": {
// The command that will be executed before a build of the specified GOOS/GOARCH: ${platform} is replaced with the "GOOS/GOARCH". The "GOOS/GOARCH" hook is executed before the "GOOS/*" and "*/*" hook.
"GOOS/GOARCH": "",
// The command that will be executed before a build of the specified GOOS: ${platform} is replaced with the "GOOS/GOARCH". The "GOOS/*" hook is executed before the "*/*" hook.
"GOOS/*": "",
// The command that will be executed before every build: ${platform} is replaced with the "GOOS/GOARCH".
"*/*": ""
},
"postBuildHooks": {
// 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/GOARCH": "",
// 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.
"GOOS/*": "",
// 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.
"*/*": ""
},
// Data used to populate manifests and version info.
"info": {
// The company name. Default: [The project name]
"companyName": "",
// The product name. Default: [The project name]
"productName": "",
// The version of the product. Default: '1.0.0'
"productVersion": "",
// The copyright of the product. Default: 'Copyright.........'
"copyright": "",
// A short comment of the app. Default: 'Built using Wails (https://wails.app)'
"comments": "",
// File associations for the app
"fileAssociations": [
{
// The extension (minus the leading period). e.g. png
"ext": "wails",
// The name. e.g. PNG File
"name": "Wails",
// Windows-only. The description. It is displayed on the `Type` column on Windows Explorer.
"description": "Wails file",
// The icon name without extension. Icons should be located in build folder. Proper icons will be generated from .png file for both macOS and Windows)
"iconName": "fileIcon",
// macOS-only. The app’s role with respect to the type. Corresponds to CFBundleTypeRole.
"role": "Editor"
},
],
// Custom URI protocols that should be opened by the application
"protocols": [
{
// protocol scheme. e.g. myapp
"scheme": "myapp",
// Windows-only. The description. It is displayed on the `Type` column on Windows Explorer.
"description": "Myapp protocol",
// macOS-only. The app’s role with respect to the type. Corresponds to CFBundleTypeRole.
"role": "Editor"
}
]
},
// 'multiple': One installer per architecture. 'single': Single universal installer for all architectures being built. Default: 'multiple'
"nsisType": "",
// Whether the app should be obfuscated. Default: false
"obfuscated": "",
// The arguments to pass to the garble command when using the obfuscated flag
"garbleargs": "",
// Bindings configurations
"bindings": {
// model.ts file generation config
"ts_generation": {
// All generated JavaScript entities will be prefixed with this value
"prefix": "",
// All generated JavaScript entities will be suffixed with this value
"suffix": "",
// Type of output to generate (classes|interfaces)
"outputType": "classes",
}
}
}
```
This file is read by the Wails CLI when running `wails build` or `wails dev`.
The `assetdir`, `reloaddirs`, `wailsjsdir`, `debounceMS`, `devserver` and `frontenddevserverurl` flags in `wails build/dev` will update the project config
and thus become defaults for subsequent runs.
The JSON Schema for this file is located [here](https://wails.io/schemas/config.v2.json).

Some files were not shown because too many files have changed in this diff Show more