mirror of
https://github.com/wailsapp/wails.git
synced 2025-05-02 15:11:53 +08:00
v2.0.0-beta.40
This commit is contained in:
Lea Anthony
parent
0f7bd65815
commit
a43c077423
@ -1 +1 @@
|
||||
v2.0.0-beta.39.2
|
||||
v2.0.0-beta.40
|
||||
@ -7,6 +7,35 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
|
||||
|
||||
## [Unreleased]
|
||||
|
||||
## [v2.0.0-beta.40] - 2022-07-24
|
||||
|
||||
## Added
|
||||
|
||||
* Add Show() and Hide() to runtime to show/hide application by @leaanthony
|
||||
in https://github.com/wailsapp/wails/pull/1599
|
||||
* Override target platform/arch using GOOS and GOARCH environment variables by @leaanthony
|
||||
in https://github.com/wailsapp/wails/pull/1618
|
||||
* Add option to skip frontend rebuild in dev mode by @leaanthony in https://github.com/wailsapp/wails/pull/1632
|
||||
|
||||
## Fixed
|
||||
|
||||
* Update svelte templates to use vite 3 by @leaanthony in https://github.com/wailsapp/wails/pull/1643
|
||||
* Fix plain template by @stffabi in https://github.com/wailsapp/wails/pull/1609
|
||||
* Fix Website layout by @leaanthony in https://github.com/wailsapp/wails/pull/1616
|
||||
* Fixed typo in documentation page docs/howdoesitwork by @MyNameIsAres in https://github.com/wailsapp/wails/pull/1636
|
||||
* Use scaling when setting min/max window by @leaanthony in https://github.com/wailsapp/wails/pull/1557
|
||||
|
||||
## Changed
|
||||
|
||||
* Install dev dependencies before starting dev mode by @leaanthony in https://github.com/wailsapp/wails/pull/1615
|
||||
* Translate and fix website text by @misitebao in https://github.com/wailsapp/wails/pull/1525
|
||||
* docs: add MyNameIsAres as a contributor for doc by @allcontributors in https://github.com/wailsapp/wails/pull/1638
|
||||
* Deprecate Fullscreen appoption by @acheong08 in https://github.com/wailsapp/wails/pull/1640
|
||||
|
||||
## New Contributors
|
||||
|
||||
* @MyNameIsAres made their first contribution in https://github.com/wailsapp/wails/pull/1636
|
||||
|
||||
## [v2.0.0-beta.39.2] - 2022-07-20
|
||||
|
||||
## Added
|
||||
|
||||
@ -1,38 +0,0 @@
|
||||
# Contributing
|
||||
|
||||
This page is a guide on how to contribute to the Wails project.
|
||||
|
||||
First, a word of warning: Wails v2 has been through a number of iterations and pivots. There is a lot of code that
|
||||
is either on hold or deprecated. Reading the whole project and trying to understand it may be confusing. This document
|
||||
aims to focus on what is current and how to understand that.
|
||||
|
||||
## Bugs
|
||||
|
||||
For raising bugs, please open a ticket on GitHub and give it the \[v2\] label. Include the output of `wails doctor`
|
||||
in the ticket to help us understand your environment.
|
||||
|
||||
For fixing bugs, please comment on a ticket that you'd like to take it on and we will put a label on the ticket.
|
||||
It is best to use Windows as it is done in pure Go, making debugging much easier.
|
||||
|
||||
## Features
|
||||
|
||||
To request a new feature, raise a ticket so that it may be discussed. The ticket should be given the
|
||||
"Feature Request" label. These will be discussed and if selected for development will be given the label
|
||||
"Ready for Development".
|
||||
|
||||
To implement a new feature, raise a ticket as above or select a ticket with the "Ready for Development" label.
|
||||
|
||||
When raising a PR, be mindful to state what platforms the PR has been tested on. Any new feature will not be accepted unless it works
|
||||
on all platforms (if it can).
|
||||
|
||||
:::warning What not to do
|
||||
|
||||
PRs for features with no tickets aren't helpful as there's no context to the PR and it will not be prioritised.
|
||||
|
||||
:::
|
||||
|
||||
## Documentation
|
||||
|
||||
Contributing to the documentation is easy by clicking on the "Edit this page" link on any of the pages. Documentation
|
||||
updates can be done ad-hoc, without a ticket.
|
||||
|
||||
@ -1,3 +1,4 @@
|
||||
|
||||
# EncryptEasy
|
||||
|
||||
<p style={{"text-align": "center"}}>
|
||||
@ -1,3 +1,4 @@
|
||||
|
||||
# FileHound Export Utility
|
||||
|
||||
<p style={{"text-align": "center"}}>
|
||||
@ -1,3 +1,4 @@
|
||||
|
||||
# Molley Wallet
|
||||
|
||||
<p style={{"text-align": "center"}}>
|
||||
@ -1,3 +1,4 @@
|
||||
|
||||
# Optimus
|
||||
|
||||
<p style={{"text-align": "center"}}>
|
||||
@ -1,3 +1,4 @@
|
||||
|
||||
# Portfall
|
||||
|
||||
<p style={{"text-align": "center"}}>
|
||||
@ -0,0 +1,11 @@
|
||||
|
||||
# Restic Browser
|
||||
|
||||
<p style={{"text-align": "center"}}>
|
||||
<img src="/img/showcase/restic-browser-2.png"></img><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.
|
||||
|
||||
|
||||
|
||||
@ -1,3 +1,4 @@
|
||||
|
||||
# RiftShare
|
||||
|
||||
<p style={{"text-align": "center"}}>
|
||||
@ -1,3 +1,4 @@
|
||||
|
||||
# Surge
|
||||
|
||||
<p style={{"text-align": "center"}}>
|
||||
@ -1,3 +1,4 @@
|
||||
|
||||
# Wally
|
||||
|
||||
<p style={{"text-align": "center"}}>
|
||||
@ -1,3 +1,4 @@
|
||||
|
||||
# Wombat
|
||||
|
||||
<p style={{"text-align": "center"}}>
|
||||
@ -1,3 +1,4 @@
|
||||
|
||||
# Ytd
|
||||
|
||||
<p>
|
||||
@ -0,0 +1,4 @@
|
||||
{
|
||||
"label": "Contributing",
|
||||
"position": 99
|
||||
}
|
||||
@ -0,0 +1,35 @@
|
||||
---
|
||||
sidebar_position: 20
|
||||
---
|
||||
|
||||
# Developing New Features
|
||||
|
||||
We are always keen to add features to Wails and expand on what the project can do.
|
||||
The process for adding new features are as follows:
|
||||
|
||||
- Pick an enhancement ticket with the "TODO" label. It's preferable to select one from the current
|
||||
[Backlog](https://github.com/orgs/wailsapp/projects/1/views/1) but the choice is yours.
|
||||
- Before developing, check that the ticket includes the following information:
|
||||
- The purpose of the enhancement
|
||||
- What is out of scope for the enhancement
|
||||
- What platforms the enhancement targets (most features should be cross-platform unless there's a very specific reason)
|
||||
- If the ticket does not include this information, feel free to request the information from the
|
||||
person who opened the ticket. Sometimes placeholder tickets are created and require more details
|
||||
- Comment on the ticket stating you wish to develop the feature
|
||||
- Clone the repository and create a branch with the format `feature/<ticket_number>_<ticket_title>`
|
||||
- New features often require documentation so please ensure you have also added or updated the documentation as part of
|
||||
the changes
|
||||
- Once the feature is ready for testing, create a draft PR. Please ensure the PR description has the test scenarios and
|
||||
test cases listed with checkmarks, so that others can know what still needs to be tested.
|
||||
- Once all the testing is completed, please update the status of the PR from draft and leave a message.
|
||||
|
||||
:::note
|
||||
There is nothing stopping you from opening a ticket and working on it yourself, but please be aware that all
|
||||
enhancement requests are reviewed for good fit. Not all ideas will be selected so it's best to have discussion
|
||||
on the ticket first.
|
||||
:::
|
||||
|
||||
:::warning
|
||||
Any PRs opened without a corresponding ticket may be rejected.
|
||||
:::
|
||||
|
||||
@ -0,0 +1,39 @@
|
||||
---
|
||||
sidebar_position: 40
|
||||
---
|
||||
|
||||
# Documenting
|
||||
|
||||
This website is also the main documentation site for the project. Sometimes this gets
|
||||
out of date and needs some slight adjustments. Some of the documentation isn't written
|
||||
to the best standards either. Developing documentation is hard and so any contribution
|
||||
to this is greatly appreciated. Features without documentation are unfinished so to the
|
||||
project, it's *as important* as the code.
|
||||
|
||||
We generally do not create tickets for updating documentation so if there is text you
|
||||
think should be updated or rephrased then feel free to submit a PR for that. This site
|
||||
is in the main repository under the `website` directory. We use [Docusaurus](https://docusaurus.io/) to create
|
||||
the site so there is plenty of existing documentation and tutorials around to get started.
|
||||
|
||||
To set up a local documentation development environment, do the following:
|
||||
|
||||
- [Install npm](https://docs.npmjs.com/cli/v8/configuring-npm/install)
|
||||
- `cd website`
|
||||
- `npm install`
|
||||
- `npm run start`
|
||||
|
||||
After it has all installed and is running, you should see the site at [`http://localhost:3000`](http://localhost:3000).
|
||||
Any changes made to the site text will be immediately reflected in the browser.
|
||||
|
||||
## Versioning
|
||||
|
||||
We employ a versioning system where we have the "latest" documentation AKA "Next Version" which
|
||||
has all the changes that have occurred since the last release. We also keep the last release
|
||||
documentation as well as the version before that.
|
||||
|
||||
There isn't usually a reason to update released documentation so we don't generally update
|
||||
the documents in the `versioned_docs` or `versioned_sidebars` directories.
|
||||
|
||||
The "next version" docs are mainly in `website/docs` with some "version independent" documents
|
||||
in `src/pages`. Any updates should be made in the `website/docs` directory.
|
||||
|
||||
@ -0,0 +1,30 @@
|
||||
---
|
||||
sidebar_position: 30
|
||||
---
|
||||
|
||||
# Fixing Bugs
|
||||
|
||||
The process for fixing bugs are as follows:
|
||||
|
||||
- Check the current [Backlog](https://github.com/orgs/wailsapp/projects/1/views/1) and select a bug to fix
|
||||
- Before developing, check that the ticket includes the following information:
|
||||
- The scope of the issue including platforms affected
|
||||
- The steps to reproduce. Sometimes bugs are opened that are not Wails issues and the onus is on the reporter to
|
||||
prove that it is a Wails issue with a minimal reproducible example
|
||||
- The output of `wails doctor`
|
||||
- If the ticket does not include this information, feel free to request the information from the
|
||||
person who opened the ticket.
|
||||
- Comment on the ticket stating you wish to develop a fix
|
||||
- Clone the repository and create a branch with the format `bugfix/<ticket_number>_<ticket_title>`
|
||||
- Once the fix is ready for testing, create a draft PR. Please ensure the PR description has the test scenarios and
|
||||
test cases listed with checkmarks, so that others can know what still needs to be tested.
|
||||
- Once all the testing is completed, please update the status of the PR from draft and leave a message.
|
||||
|
||||
:::note
|
||||
There is nothing stopping you from opening a ticket and working on it yourself, but please be aware that all
|
||||
bugfixes should be discussed as the approach may have unintended side effects.
|
||||
:::
|
||||
|
||||
:::warning
|
||||
Any PRs opened without a corresponding ticket may be rejected.
|
||||
:::
|
||||
@ -0,0 +1,17 @@
|
||||
---
|
||||
sidebar_position: 50
|
||||
---
|
||||
|
||||
# Helping Others
|
||||
|
||||
A great way to contribute to the project is to help others who are experiencing difficulty.
|
||||
This is normally reported as a ticket or a message on the Wails slack channel. Even just
|
||||
clarifying the issue can really help out. Sometimes, when an issue is discussed and gets
|
||||
resolved, we create a guide out of it to help others who face the same issues.
|
||||
|
||||
To join the Wails slack channel, accept the invite [here](https://gophers.slack.com/join/shared_invite/zt-197vymgt3-sJt4oyakb6nqlVKjXTyeVw#/shared-invite/email)
|
||||
and join us on the channel by following [this link](https://gophers.slack.com/?redir=%2Fmessages%2FCJ4P9F7MZ%2F).
|
||||
|
||||
:::note
|
||||
Work In Progress
|
||||
:::
|
||||
@ -0,0 +1,34 @@
|
||||
---
|
||||
sidebar_position: 10
|
||||
---
|
||||
|
||||
# Setting up a Development Environment
|
||||
|
||||
You can set up a development environment by doing the following:
|
||||
|
||||
- Install the latest versions of Go and Git
|
||||
- `git clone https://github.com/wailsapp/wails`
|
||||
- `cd wails/v2/cmd/wails`
|
||||
- `go install`
|
||||
|
||||
NOTE: The directory that you cloned the project into will now be called "clonedir".
|
||||
|
||||
The Wails CLI will now be at the very latest version.
|
||||
|
||||
To update projects to use the latest version, update the project's `go.mod` and
|
||||
ensure the following line is at the bottom of the file:
|
||||
|
||||
`replace github.com/wailsapp/wails/v2 => <clonedir>`
|
||||
|
||||
Example:
|
||||
|
||||
On Windows:
|
||||
`replace github.com/wailsapp/wails/v2 => C:\Users\leaan\Documents\wails-v2-beta\wails\v2`
|
||||
|
||||
On 'nix:
|
||||
`replace github.com/wailsapp/wails/v2 => /home/me/projects/wails/v2`
|
||||
|
||||
To revert back to a stable version, run:
|
||||
|
||||
`go install github.com/wailsapp/wails/v2/cmd/wails@latest`
|
||||
|
||||
@ -0,0 +1,21 @@
|
||||
---
|
||||
sidebar_position: 35
|
||||
---
|
||||
|
||||
# Testing
|
||||
|
||||
Testing is vitally important to ensure quality in the project. There are a couple of
|
||||
scenarios where testing can really help the project:
|
||||
|
||||
- Testing if a bug is reproducible on your local system
|
||||
- Testing PRs to ensure that they work correctly
|
||||
|
||||
If you chose to test if someone's bug report is reproducible on your local system, then
|
||||
feel free to add a comment on the ticket confirming this with the output of `wails doctor`.
|
||||
|
||||
To test PRs, choose a PR to test and check if the PR description has the testing scenarios
|
||||
listed. If not, please ask the person who opened the PR to provide that list. Once you have
|
||||
determined a valid test scenario, please report your findings on the PR.
|
||||
|
||||
If you ever need more clarity or help on testing, please ask a question in the [Contributing to Wails](https://github.com/wailsapp/wails/discussions/1520)
|
||||
discussion or on slack.
|
||||
@ -0,0 +1,22 @@
|
||||
---
|
||||
sidebar_position: 1
|
||||
---
|
||||
|
||||
# Ways of contributing
|
||||
|
||||
Wails is an open source, community driven project. We welcome anyone to join us in
|
||||
contributing to the project. This documentation is aimed at anyone wishing to get
|
||||
familiar with the project and the development processes.
|
||||
|
||||
There are many ways to contribute to the project:
|
||||
|
||||
- Developing new features
|
||||
- Fixing bugs
|
||||
- Testing
|
||||
- Documenting features
|
||||
- Writing tutorials / guides
|
||||
- Helping others on the issues + discussions boards
|
||||
|
||||
Guides for these have been created in their own sections. Before getting started,
|
||||
please introduce yourself in the [Contributing to Wails](https://github.com/wailsapp/wails/discussions/1520)
|
||||
discussion.
|
||||
@ -10,8 +10,7 @@ This will compile your project and save the production-ready binary in the `buil
|
||||
If you run the binary, you should see the default application:
|
||||
|
||||
<div class="text--center">
|
||||
<img src="/img/defaultproject.png" width="50%"
|
||||
style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px"}}/>
|
||||
<img src="/img/defaultproject.png" width="50%" style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px"}}/>
|
||||
</div>
|
||||
<br/>
|
||||
|
||||
@ -10,7 +10,6 @@ Now that the CLI is installed, you can generate a new project by using the `wail
|
||||
|
||||
Pick your favourite framework:
|
||||
|
||||
|
||||
import TabsFrameworks from "../../../src/components/frameworktabs";
|
||||
<TabsFrameworks/>
|
||||
|
||||
@ -20,9 +20,9 @@ Wails has a number of common dependencies that are required before installation:
|
||||
|
||||
### Go
|
||||
|
||||
Download Go from the [Go Downloads Page](https://golang.org/dl/).
|
||||
Download Go from the [Go Downloads Page](https://go.dev/doc/install).
|
||||
|
||||
Ensure that you follow the official [Go installation instructions](https://golang.org/doc/install.mdx#install). You will also need to ensure that your `PATH` environment variable also includes the path to your `~/go/bin` directory. Restart your terminal and do the following checks:
|
||||
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`
|
||||
@ -51,3 +51,10 @@ Run `go install github.com/wailsapp/wails/v2/cmd/wails@latest` to install the Wa
|
||||
## 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.
|
||||
@ -1,3 +1,4 @@
|
||||
|
||||
# Application Development
|
||||
|
||||
There are no hard and fast rules for developing applications with Wails, but there are some basic guidelines.
|
||||
@ -27,13 +28,13 @@ 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.
|
||||
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.
|
||||
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
|
||||
@ -112,6 +113,40 @@ func main() {
|
||||
|
||||
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)
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
|
||||
|
||||
More information on Binding can be found [here](../howdoesitwork.mdx#method-binding).
|
||||
|
||||
## Application Menu
|
||||
@ -1,3 +1,4 @@
|
||||
|
||||
# Bleeding Edge
|
||||
|
||||
## Overview
|
||||
@ -0,0 +1,123 @@
|
||||
# Dynamic Assets
|
||||
|
||||
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 {16-35,49}
|
||||
package main
|
||||
|
||||
import (
|
||||
"embed"
|
||||
"fmt"
|
||||
"github.com/wailsapp/wails/v2"
|
||||
"github.com/wailsapp/wails/v2/pkg/options"
|
||||
"net/http"
|
||||
"os"
|
||||
"strings"
|
||||
)
|
||||
|
||||
//go:embed 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,
|
||||
Assets: assets,
|
||||
BackgroundColour: &options.RGBA{R: 27, G: 38, B: 54, A: 1},
|
||||
OnStartup: app.startup,
|
||||
AssetsHandler: NewFileLoader(),
|
||||
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:
|
||||
|
||||
<p className="text--center">
|
||||
<img src="/img/assetshandler-does-not-exist.png"></img>
|
||||
</p>
|
||||
|
||||
However, if we request `go.mod`, we will see the following output:
|
||||
|
||||
<p className="text--center">
|
||||
<img src="/img/assetshandler-go-mod.png"></img>
|
||||
</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:
|
||||
|
||||
<p className="text--center">
|
||||
<img src="/img/assetshandler-image.png" style={{"width": "75%"}}></img>
|
||||
</p>
|
||||
|
||||
:::warning
|
||||
Exposing your filesystem in this way is a security risk. It is recommended that you properly manage access
|
||||
to your filesystem.
|
||||
:::
|
||||
|
||||
@ -1,3 +1,4 @@
|
||||
|
||||
# Frameless Applications
|
||||
|
||||
Wails supports applications with no frame. This can be achieved by using the [frameless](../reference/options.mdx#frameless)
|
||||
@ -30,5 +31,5 @@ The `<div id="input" data-wails-no-drag>` is tagged as being not draggable.
|
||||
```
|
||||
|
||||
:::info Fullscreen
|
||||
If you allow your application to go fullscreen, this drag functionality will be disabled.
|
||||
If you allow your application to go fullscreen, this drag functionality will be disabled.
|
||||
:::
|
||||
@ -1,3 +1,4 @@
|
||||
|
||||
# Frontend
|
||||
|
||||
## Script Injection
|
||||
@ -1,3 +1,4 @@
|
||||
|
||||
# IDEs
|
||||
|
||||
Wails aims to provide a great development experience. To that aim, we now support generating IDE specific configuration
|
||||
@ -1,3 +1,4 @@
|
||||
|
||||
# Linux Distro Support
|
||||
|
||||
## Overview
|
||||
@ -10,6 +11,7 @@ manager. Currently, we support the following package managers:
|
||||
- dnf
|
||||
- emerge
|
||||
- eopkg
|
||||
- nixpkgs
|
||||
- pacman
|
||||
- zypper
|
||||
|
||||
@ -1,3 +1,4 @@
|
||||
|
||||
# Manual Builds
|
||||
|
||||
The Wails CLI does a lot of heavy lifting for the project, but sometimes it's desirable to manually build your project.
|
||||
@ -23,10 +24,10 @@ When either `wails build` or `wails dev` are used, the Wails CLI performs a comm
|
||||
- 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
|
||||
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
|
||||
executed in the frontend directory
|
||||
|
||||
#### Manual Steps
|
||||
|
||||
@ -74,7 +75,7 @@ This step could be done from the command line or a script with `npm run build` o
|
||||
- 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"`
|
||||
- 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
|
||||
@ -1,3 +1,4 @@
|
||||
|
||||
# Migrating from v1
|
||||
|
||||
## Overview
|
||||
@ -183,25 +184,23 @@ 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. |
|
||||
| v1 | v2 | Notes |
|
||||
| ------------------ | ---------------- | --------------------------------------------------- |
|
||||
| name | name | |
|
||||
| description | | Removed |
|
||||
| author / name | author / name | |
|
||||
| author / email | author / email | |
|
||||
| version | version | |
|
||||
| binaryname | outputfilename | Changed |
|
||||
| frontend / dir | | Removed |
|
||||
| frontend / install | frontend:install | Changed |
|
||||
| frontend / build | frontend:build | Changed |
|
||||
| frontend / bridge | | Removed |
|
||||
| frontend / serve | | Removed |
|
||||
| tags | | Removed |
|
||||
| | wailsjsdir | The directory to generate wailsjs modules |
|
||||
| | assetdir | The directory of the compiled frontend assets for `dev` mode. This is normally inferred and could be left empty. |
|
||||
| | reloaddirs | Comma separated list of additional directories to watch for changes and to trigger reloads in `dev` mode. This is only needed for some more advanced asset configurations. |
|
||||
|
||||
</p>
|
||||
|
||||
@ -0,0 +1,28 @@
|
||||
# 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
|
||||
@ -1,3 +1,4 @@
|
||||
|
||||
# Overscroll
|
||||
|
||||
[Overscroll](https://developer.mozilla.org/en-US/docs/Web/CSS/overscroll-behavior) is the "bounce effect" you sometimes
|
||||
@ -1,3 +1,4 @@
|
||||
|
||||
# Routing
|
||||
|
||||
Routing is a popular way to switch views in an application. This page offers some guidance around how to do that.
|
||||
@ -247,8 +247,8 @@ Now we need to configure some gon config files in our `build/darwin` directory:
|
||||
}
|
||||
}
|
||||
```
|
||||
Where `source` is your Wails binary, `bundle_id` is your bundle ID, `apple_id` contains your Apple ID username and App-Specific password
|
||||
which you created earlier, and `sign.application_identity` is your identity which you can find by running the following command:
|
||||
Where `source` is your Wails binary, `bundle_id` is your bundle ID, `apple_id` contains your Apple ID username and App-Specific password
|
||||
which you created earlier, and `sign.application_identity` is your identity which you can find by running the following command:
|
||||
```bash
|
||||
security find-identity -v -p codesigning
|
||||
```
|
||||
@ -271,7 +271,7 @@ which you created earlier, and `sign.application_identity` is your identity whic
|
||||
</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).
|
||||
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:
|
||||
@ -1,3 +1,4 @@
|
||||
|
||||
# Templates
|
||||
|
||||
Wails generates projects from pre-created templates. In v1, this was a difficult to maintain set of projects that were
|
||||
@ -60,7 +61,7 @@ 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)`
|
||||
- Select `Default (Vue 3) ([Vue 3] babel, eslint)`
|
||||
- After the project has been generated, run:
|
||||
|
||||
```shell
|
||||
@ -80,7 +81,7 @@ Renaming package-lock.json -> package-lock.tmpl.json...
|
||||
- You should have a fully functioning Vue3 application:
|
||||
|
||||
<div className="text--center">
|
||||
<img src="/img/vue3-template.png" width="50%"/>
|
||||
<img src="/img/vue3-template.png" width="50%" />
|
||||
</div>
|
||||
|
||||
## Publishing Templates
|
||||
@ -2,6 +2,13 @@
|
||||
|
||||
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
|
||||
@ -13,6 +20,20 @@ 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:
|
||||
@ -75,28 +96,16 @@ Sometimes the generated Typescript doesn''t have the correct types. To mitigate
|
||||
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).
|
||||
|
||||
## Page Not found
|
||||
## When I navigate away from `index.html`, I am unable to call methods on the frontend
|
||||
|
||||
When creating multi-page applications (multiple `.html` files), they are not automatically added to `frontend/dist` by Vite, resulting in a `Not Found` error. This is an issue with Vite and not Wails. To manually include files, create a file at `myproject/frontend/vite.config.js` and define rollUp options. An example is provided below:
|
||||
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:
|
||||
|
||||
```
|
||||
// vite.config.js
|
||||
import { resolve } from 'path'
|
||||
import { defineConfig } from 'vite'
|
||||
|
||||
export default defineConfig({
|
||||
build: {
|
||||
rollupOptions: {
|
||||
input: {
|
||||
main: resolve(__dirname, 'index.html'),
|
||||
login: resolve(__dirname, 'src/login.html'),
|
||||
font: resolve(__dirname, 'src/assets/fonts/nunito-v16-latin-regular.woff2'),
|
||||
}
|
||||
}
|
||||
}
|
||||
})
|
||||
```html
|
||||
<head>
|
||||
<script src="/wails/ipc.js"></script>
|
||||
<script src="/wails/runtime.js"></script>
|
||||
</head>
|
||||
```
|
||||
|
||||
For more details read the Vite documentation here: https://vitejs.dev/guide/build.html#multi-page-app
|
||||
|
||||
Source: https://github.com/wailsapp/wails/issues/1582
|
||||
Source: https://github.com/wailsapp/wails/discussions/1512
|
||||
@ -1,7 +1,7 @@
|
||||
# NSIS installer
|
||||
|
||||
<p style={{"text-align": "center"}}>
|
||||
<img src="/img/nsis.png" style={{"max-width": "50%"}}></img><br/>
|
||||
<img src="/img/nsis.png" style={{"max-width":"50%"}}></img><br/>
|
||||
</p>
|
||||
|
||||
Wails supports generating Windows installers using the [NSIS installer](https://nsis.sourceforge.io/).
|
||||
@ -1,3 +1,4 @@
|
||||
|
||||
# Windows
|
||||
|
||||
This page has miscellaneous guides related to developing Wails applications for Windows.
|
||||
@ -11,7 +11,7 @@ version of the runtime library. Finally, it is possible to bind Go methods to th
|
||||
Javascript methods that can be called, just as if they were local Javascript methods.
|
||||
|
||||
<div className="text--center">
|
||||
<img src="/img/architecture.svg" width="75%"/>
|
||||
<img src="/img/architecture.svg" width="75%" />
|
||||
</div>
|
||||
|
||||
## The Main Application
|
||||
@ -130,7 +130,7 @@ by the frontend code.
|
||||
|
||||
:::info Note
|
||||
|
||||
Wails requires that you pass in an *instance* of the struct for it to bind it correctly
|
||||
Wails requires that you pass in an *instance* of the struct for it to bind it correctly
|
||||
|
||||
:::
|
||||
|
||||
@ -207,7 +207,7 @@ This makes it incredibly simple to call Go code from the frontend, using the sam
|
||||
|
||||
### Overview
|
||||
|
||||
The frontend is a collection of files rendered by webkit. It''s like a browser and webserver in one.
|
||||
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:
|
||||
|
||||
@ -215,8 +215,8 @@ the frontend and your Go code are:
|
||||
- Calling runtime methods
|
||||
|
||||
[^1]:
|
||||
There is a very small subset of libraries that use features unsupported in WebViews. There are often alternatives and
|
||||
workarounds for such cases.
|
||||
There is a very small subset of libraries that use features unsupported in WebViews. There are often alternatives and
|
||||
workarounds for such cases.
|
||||
|
||||
### Calling bound Go methods
|
||||
|
||||
@ -253,7 +253,7 @@ 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,
|
||||
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.
|
||||
@ -268,12 +268,12 @@ 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
|
||||
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
|
||||
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:
|
||||
@ -11,7 +11,7 @@ Wails is a project that enables you to write desktop apps using Go and web techn
|
||||
Consider it a lightweight and fast Electron alternative for Go. You can easily build applications with the flexibility
|
||||
and power of Go, combined with a rich, modern frontend.
|
||||
|
||||
Wails doesn't hold back with the eye candy either! This is [varly](https://varlyapp.com) - a desktop application for
|
||||
Wails doesn't hold back with the eye candy either! This is [varly](https://varly.app) - 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.
|
||||
|
||||
@ -24,7 +24,7 @@ The Wails CLI has a number of commands that are used for managing your projects.
|
||||
| -f | Force build application | false |
|
||||
|
||||
Example:
|
||||
`wails init -n test -d mytestproject -g -ide vscode -q`
|
||||
`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.
|
||||
@ -36,15 +36,15 @@ More information on using IDEs with Wails can be found [here](../guides/ides.mdx
|
||||
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]`
|
||||
`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!**
|
||||
**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.
|
||||
If you are unsure about a template, inspect `package.json` and `wails.json` for what scripts are run and what packages are installed.
|
||||
|
||||
:::
|
||||
|
||||
@ -54,13 +54,13 @@ If you are unsure about a template, inspect `package.json` and `wails.json` for
|
||||
|
||||
| Flag | Description | Default |
|
||||
| :------------------- | :-------------------------------------- | :------------------------- |
|
||||
| -platform | Build for the given (comma delimited) [platforms](../reference/cli.mdx#platforms) eg. `windows/arm64`. Note, if you do not give the architecture, `runtime.GOARCH` is used. | runtime.GOOS/runtime.GOARCH |
|
||||
| -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`. |
|
||||
| -clean | Cleans the `build/bin` directory | |
|
||||
| -compiler "compiler"| Use a different go compiler to build, eg go1.15beta1 | go |
|
||||
| -ldflags "flags" | Additional ldflags to pass to the compiler | |
|
||||
| -nopackage | Do not package application | |
|
||||
| -o filename | Output filename | |
|
||||
| -s | Skip building the frontend | |
|
||||
| -s | Skip building the frontend | false |
|
||||
| -f | Force build application | false |
|
||||
| -tags "extra tags" | Build tags to pass to compiler (quoted and space separated) | |
|
||||
| -upx | Compress final binary using "upx" | |
|
||||
@ -68,9 +68,10 @@ If you are unsure about a template, inspect `package.json` and `wails.json` for
|
||||
| -v int | Verbosity level (0 - silent, 1 - default, 2 - verbose) | 1 |
|
||||
| -webview2 | WebView2 installer strategy: download,embed,browser,error | download |
|
||||
| -u | Updates your project's `go.mod` to use the same version of Wails as the CLI | |
|
||||
| -debug | Retains debug information in the application | false |
|
||||
| -debug | Retains debug information in the application. Allows the use of the devtools in the application window | false |
|
||||
| -trimpath | Remove all file system paths from the resulting executable. | false |
|
||||
| -race | Build with Go's race detector | false |
|
||||
| -windowsconsole | Keep the console window for Windows builds | false |
|
||||
|
||||
For a detailed description of the `webview2` flag, please refer to the [Windows](../guides/windows.mdx) Guide.
|
||||
|
||||
@ -83,13 +84,13 @@ Example:
|
||||
|
||||
:::info UPX on Apple Silicon
|
||||
|
||||
There are [issues](https://github.com/upx/upx/issues/446) with using UPX with Apple Silicon.
|
||||
There are [issues](https://github.com/upx/upx/issues/446) with using UPX with Apple Silicon.
|
||||
|
||||
:::
|
||||
|
||||
:::info UPX on Windows
|
||||
|
||||
Some Antivirus vendors false positively mark `upx` compressed binaries as virus, see [issue](https://github.com/upx/upx/issues/437).
|
||||
Some Antivirus vendors false positively mark `upx` compressed binaries as virus, see [issue](https://github.com/upx/upx/issues/437).
|
||||
|
||||
:::
|
||||
|
||||
@ -154,8 +155,8 @@ Your system is ready for Wails development!
|
||||
- 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
|
||||
- Javascript wrappers of your Go methods with autogenerated JSDoc, providing code hinting
|
||||
- TypeScript versions of your Go structs, that can be constructed and passed to your go methods
|
||||
- A second JS module is generated that provides a wrapper + TS declaration for the runtime
|
||||
|
||||
| Flag | Description | Default |
|
||||
@ -176,9 +177,9 @@ Your system is ready for Wails development!
|
||||
| -devserver "host:port" | The address to bind the wails dev server to | "localhost:34115" |
|
||||
| -frontenddevserverurl "url" | Use 3rd party dev server url to serve assets, EG Vite | "" |
|
||||
| -appargs "args" | Arguments passed to the application in shell style | |
|
||||
| -platform "platform" | Platform/Arch to target | `runtime.GOOS` |
|
||||
| -save | Saves the given `assetdir`, `reloaddirs`, `wailsjsdir`, `debounce`, `devserver` and `frontenddevserverurl` flags in `wails.json` to become the defaults for subsequent invocations. | |
|
||||
| -race | Build with Go's race detector | false |
|
||||
| -s | Skip building the frontend | false |
|
||||
|
||||
Example:
|
||||
|
||||
@ -258,7 +258,7 @@ using radio groups that may share a callback.
|
||||
|
||||
:::info Roles
|
||||
|
||||
Roles are currently supported on Mac only.
|
||||
Roles are currently supported on Mac only.
|
||||
|
||||
:::
|
||||
|
||||
@ -34,6 +34,7 @@ func main() {
|
||||
Menu: app.applicationMenu(),
|
||||
Logger: nil,
|
||||
LogLevel: logger.DEBUG,
|
||||
LogLevelProduction: logger.ERROR,
|
||||
OnStartup: app.startup,
|
||||
OnDomReady: app.domready,
|
||||
OnShutdown: app.shutdown,
|
||||
@ -223,8 +224,9 @@ Type: embed.FS
|
||||
|
||||
The frontend assets to be used by the application. Requires an `index.html` file.
|
||||
|
||||
### AssetsHandler <img src="http://badges.github.io/stability-badges/dist/experimental.svg"/>
|
||||
### AssetsHandler
|
||||
|
||||
<img src="http://badges.github.io/stability-badges/dist/experimental.svg"/>
|
||||
|
||||
Name: AssetsHandler
|
||||
|
||||
@ -285,6 +287,16 @@ Default: `Info` in dev mode, `Error` in production mode
|
||||
|
||||
The default log level. More details about logging in the [Log Reference](../reference/runtime/log.mdx).
|
||||
|
||||
### LogLevelProduction
|
||||
|
||||
Name: LogLevelProduction
|
||||
|
||||
Type: logger.LogLevel
|
||||
|
||||
Default: `Error`
|
||||
|
||||
The default log level for production builds. More details about logging in the [Log Reference](../reference/runtime/log.mdx).
|
||||
|
||||
### OnStartup
|
||||
|
||||
Name: OnStartup
|
||||
@ -690,16 +702,14 @@ func main() {
|
||||
The "About" menu item will appear in the app menu:
|
||||
|
||||
<div class="text--center">
|
||||
<img src="/img/reference/about-menu.png"
|
||||
style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px"}}/>
|
||||
<img src="/img/reference/about-menu.png" style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px"}}/>
|
||||
</div>
|
||||
<br/>
|
||||
|
||||
When clicked, that will open an about message box:
|
||||
|
||||
<div class="text--center">
|
||||
<img src="/img/reference/about-dialog.png" width="40%"
|
||||
style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px"}}/>
|
||||
<img src="/img/reference/about-dialog.png" width="40%" style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px"}}/>
|
||||
</div>
|
||||
<br/>
|
||||
|
||||
@ -15,7 +15,7 @@ The project config resides in the `wails.json` file in the project directory. Th
|
||||
"frontend:build": "[The command to build the assets, run in the frontend directory - often `npm run build`]",
|
||||
"frontend:dev": "[This command is the dev equivalent of frontend:build. If not specified falls back to frontend:build]",
|
||||
"frontend:dev:watcher": "[This command is run in a separate process on `wails dev`. Useful for 3rd party watchers or starting 3d party dev servers]",
|
||||
"frontend:dev:serverUrl": "[URL to a 3rd party dev server to be used to serve assets, EG Vite",
|
||||
"frontend:dev:serverUrl": "[URL to a 3rd party dev server to be used to serve assets, EG Vite. If this is set to 'auto' then the devServerUrl will be inferred from the Vite output]",
|
||||
"wailsjsdir": "[Relative path to the directory that the auto-generated JS modules will be created]",
|
||||
"version": "[Project config version]",
|
||||
"outputfilename": "[The name of the binary]",
|
||||
@ -23,6 +23,11 @@ The project config resides in the `wails.json` file in the project directory. Th
|
||||
"devServer": "[Address to bind the wails dev sever to. Default: localhost:34115]",
|
||||
"appargs": "[Arguments passed to the application in shell style when in dev mode]",
|
||||
"runNonNativeBuildHooks": false, // Defines if build hooks should be run though they are defined for an OS other than the host OS.
|
||||
"preBuildHooks": {
|
||||
"GOOS/GOARCH": "[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/*": "[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.]",
|
||||
"*/*": "[The command that will be executed before every build: ${platform} is replaced with the "GOOS/GOARCH".]"
|
||||
},
|
||||
"postBuildHooks": {
|
||||
"GOOS/GOARCH": "[The command that will be executed after a build of the specified GOOS/GOARCH: ${platform} is replaced with the "GOOS/GOARCH" and ${bin} with the path to the compiled binary. The "GOOS/GOARCH" hook is executed before the "GOOS/*" and "*/*" hook.]",
|
||||
"GOOS/*": "[The command that will be executed after a build of the specified GOOS: ${platform} is replaced with the "GOOS/GOARCH" and ${bin} with the path to the compiled binary. The "GOOS/*" hook is executed before the "*/*" hook.]",
|
||||
@ -9,7 +9,7 @@ sidebar_position: 5
|
||||
This part of the runtime provides access to native dialogs, such as File Selectors and Message boxes.
|
||||
|
||||
:::info Javascript
|
||||
Dialog is currently unsupported in the JS runtime.
|
||||
Dialog is currently unsupported in the JS runtime.
|
||||
:::
|
||||
|
||||
### OpenDirectoryDialog
|
||||
@ -157,8 +157,7 @@ selection, err := runtime.MessageDialog(b.ctx, runtime.MessageDialogOptions{
|
||||
```
|
||||
the first button is shown as default:
|
||||
<div class="text--center">
|
||||
<img src="/img/runtime/dialog_no_defaults.png" width="30%"
|
||||
style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px"}}/>
|
||||
<img src="/img/runtime/dialog_no_defaults.png" width="30%" style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px"}}/>
|
||||
</div>
|
||||
<br/>
|
||||
|
||||
@ -173,8 +172,7 @@ selection, err := runtime.MessageDialog(b.ctx, runtime.MessageDialogOptions{
|
||||
```
|
||||
the second button is shown as default. When `return` is pressed, the value "two" is returned.
|
||||
<div class="text--center">
|
||||
<img src="/img/runtime/dialog_default_button.png" width="30%"
|
||||
style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px"}}/>
|
||||
<img src="/img/runtime/dialog_default_button.png" width="30%" style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px"}}/>
|
||||
</div>
|
||||
<br/>
|
||||
|
||||
@ -190,8 +188,7 @@ selection, err := runtime.MessageDialog(b.ctx, runtime.MessageDialogOptions{
|
||||
```
|
||||
the button with "three" is shown at the bottom of the dialog. When `escape` is pressed, the value "three" is returned:
|
||||
<div class="text--center">
|
||||
<img src="/img/runtime/dialog_default_cancel.png" width="30%"
|
||||
style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px"}}/>
|
||||
<img src="/img/runtime/dialog_default_cancel.png" width="30%" style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px"}}/>
|
||||
</div>
|
||||
<br/>
|
||||
<br/>
|
||||
@ -224,8 +221,7 @@ Windows allows you to use multiple file filters in dialog boxes. Each FileFilter
|
||||
dialog:
|
||||
|
||||
<div class="text--center">
|
||||
<img src="/img/runtime/dialog_win_filters.png" width="50%"
|
||||
style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px"}}/>
|
||||
<img src="/img/runtime/dialog_win_filters.png" width="50%" style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px"}}/>
|
||||
</div>
|
||||
<br/>
|
||||
<br/>
|
||||
@ -237,8 +233,7 @@ Linux allows you to use multiple file filters in dialog boxes. Each FileFilter w
|
||||
dialog:
|
||||
|
||||
<div class="text--center">
|
||||
<img src="/img/runtime/dialog_lin_filters.png" width="50%"
|
||||
style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px"}}/>
|
||||
<img src="/img/runtime/dialog_lin_filters.png" width="50%" style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px"}}/>
|
||||
</div>
|
||||
<br/>
|
||||
<br/>
|
||||
@ -24,6 +24,29 @@ The Javascript library is available to the frontend via the `window.runtime` map
|
||||
mode that provides Typescript declarations for the runtime. This should be located in the `wailsjs` directory in your
|
||||
frontend directory.
|
||||
|
||||
### Hide
|
||||
|
||||
Go Signature: `Hide(ctx context.Context)`
|
||||
|
||||
Hides the application.
|
||||
|
||||
:::info Note
|
||||
On Mac, this will hide the application in the same way as the `Hide` menu item in standard Mac applications.
|
||||
This is different to hiding the window, but the application still being in the foreground.
|
||||
For Windows and Linux, this is currently the same as `WindowHide`.
|
||||
:::
|
||||
|
||||
### Show
|
||||
|
||||
Go Signature: `Show(ctx context.Context)`
|
||||
|
||||
Shows the application.
|
||||
|
||||
:::info Note
|
||||
On Mac, this will bring the application back into the foreground.
|
||||
For Windows and Linux, this is currently the same as `WindowShow`.
|
||||
:::
|
||||
|
||||
### Quit
|
||||
|
||||
Go Signature: `Quit(ctx context.Context)`
|
||||
@ -9,7 +9,7 @@ sidebar_position: 6
|
||||
These methods are related to the application menu.
|
||||
|
||||
:::info Javascript
|
||||
Menu is currently unsupported in the JS runtime.
|
||||
Menu is currently unsupported in the JS runtime.
|
||||
:::
|
||||
|
||||
### MenuSetApplicationMenu
|
||||
@ -184,10 +184,10 @@ JS Signature: `WindowUnminimise()`
|
||||
|
||||
Restores the window to the dimensions and position prior to minimising.
|
||||
|
||||
### WindowSetRGBA
|
||||
Go Signature: `WindowSetRGBA(ctx context.Context, R, G, B, A uint8)`
|
||||
### WindowSetBackgroundColour
|
||||
Go Signature: `WindowSetBackgroundColour(ctx context.Context, R, G, B, A uint8)`
|
||||
|
||||
JS Signature: `WindowSetRGBA(R, G, B, A)`
|
||||
JS Signature: `WindowSetBackgroundColour(R, G, B, A)`
|
||||
|
||||
Sets the background colour of the window to the given RGBA colour definition.
|
||||
This colour will show through for all transparent pixels.
|
||||
@ -0,0 +1,4 @@
|
||||
{
|
||||
"label": "Tutorials",
|
||||
"position": 70
|
||||
}
|
||||
@ -0,0 +1,114 @@
|
||||
---
|
||||
sidebar_position: 10
|
||||
---
|
||||
|
||||
# Hello World
|
||||
|
||||
The aim of this tutorial is to get you up and running with the most basic
|
||||
application using Wails. You will be able to:
|
||||
|
||||
- Create a new Wails application
|
||||
- Build the application
|
||||
- Run the application
|
||||
|
||||
:::note
|
||||
This tutorial uses Windows as the target platform. Output will vary slightly
|
||||
depending on your operating system.
|
||||
:::
|
||||
|
||||
## Create a new Wails application
|
||||
|
||||
To create a new Wails application using the default vanilla JS template,
|
||||
you need to run the following command:
|
||||
|
||||
```bash
|
||||
wails init -n helloworld
|
||||
```
|
||||
|
||||
You should see something similar to the following:
|
||||
|
||||
```
|
||||
Wails CLI v2.0.0
|
||||
|
||||
Initialising Project 'helloworld'
|
||||
---------------------------------
|
||||
|
||||
Project Name: helloworld
|
||||
Project Directory: C:\Users\leaan\tutorial\helloworld
|
||||
Project Template: vanilla
|
||||
Template Support: https://wails.io
|
||||
|
||||
Initialised project 'helloworld' in 232ms.
|
||||
```
|
||||
|
||||
This will create a new directory called `helloworld` in the current directory.
|
||||
In this directory, you will find a number of files:
|
||||
|
||||
```
|
||||
build/ - Contains the build files + compiled application
|
||||
frontend/ - Contains the frontend files
|
||||
app.go - Contains the application code
|
||||
main.go - The main program with the application configuration
|
||||
wails.json - The project configuration file
|
||||
go.mod - The go module file
|
||||
go.sum - The go module checksum file
|
||||
```
|
||||
|
||||
## Build the application
|
||||
|
||||
To build the application, change to the new `helloworld` project directory and run the following command:
|
||||
|
||||
```bash
|
||||
wails build
|
||||
```
|
||||
|
||||
You should see something like the following:
|
||||
|
||||
```
|
||||
Wails CLI v2.0.0
|
||||
|
||||
App Type: desktop
|
||||
Platforms: windows/amd64
|
||||
Compiler: C:\Users\leaan\go\go1.18.3\bin\go.exe
|
||||
Build Mode: Production
|
||||
Skip Frontend: false
|
||||
Compress: false
|
||||
Package: true
|
||||
Clean Build Dir: false
|
||||
LDFlags: ""
|
||||
Tags: []
|
||||
Race Detector: false
|
||||
|
||||
Building target: windows/amd64
|
||||
------------------------------
|
||||
- Installing frontend dependencies: Done.
|
||||
- Compiling frontend: Done.
|
||||
- Generating bundle assets: Done.
|
||||
- Compiling application: Done.
|
||||
Built 'C:\Users\leaan\tutorial\helloworld\build\bin\helloworld.exe' in 10.616s.
|
||||
```
|
||||
|
||||
This has compiled the application and saved it in the `build/bin` directory.
|
||||
|
||||
## Run the application
|
||||
|
||||
If we view the `build/bin` directory in Windows Explorer, we should see our project binary:
|
||||
|
||||
<div class="text--center">
|
||||
<img src="/img/helloworld-app-icon.png" width="134px"/>
|
||||
</div>
|
||||
<br/>
|
||||
|
||||
We can run it by simply double-clicking the `helloworld.exe` file.
|
||||
|
||||
On Mac, Wails generates a `helloworld.app` file which can be run by double-clicking it.
|
||||
|
||||
On Linux, you can run the application using `./helloworld` from the `build/bin` directory.
|
||||
|
||||
You should see the application working as expected:
|
||||
|
||||
<div class="text--center">
|
||||
<img src="/img/windows-default-app.png" width="50%"
|
||||
style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 1px 2px 0px, rgb(104 104 104) 0px 1px 5px 0px"}}/>
|
||||
</div>
|
||||
<br/>
|
||||
@ -0,0 +1,8 @@
|
||||
{
|
||||
"tutorialSidebar": [
|
||||
{
|
||||
"type": "autogenerated",
|
||||
"dirName": "."
|
||||
}
|
||||
]
|
||||
}
|
||||
@ -1,4 +1,4 @@
|
||||
[
|
||||
"v2.0.0-beta.39",
|
||||
"v2.0.0-beta.38"
|
||||
"v2.0.0-beta.40",
|
||||
"v2.0.0-beta.39"
|
||||
]
|
||||
Loading…
Reference in New Issue
Block a user