v1からの移行
概要
Wails v2は、v1から大幅に変更されています。 このドキュメントでは、変更点、および既存のプロジェクトを移行する方法に焦点をあてて説明します。
アプリケーションの作成
v1では、wails.CreateApp
でメインアプリケーションを作成して、app.Bind
でバインディングを追加し、app.Run()
でアプリケーションを起動していました。
例:
app := wails.CreateApp(&wails.AppConfig{
Title: "MyApp",
Width: 1024,
Height: 768,
JS: js,
CSS: css,
Colour: "#131313",
})
app.Bind(basic)
app.Run()
v2では、wails.Run()
メソッドだけが、アプリケーションオプションを指定することができます。
err := wails.Run(&options.App{
Title: "MyApp",
Width: 800,
Height: 600,
AssetServer: &assetserver.Options{
Assets: assets,
},
Bind: []interface{}{
basic,
},
})
バインディング
v1では、任意の関数と構造体の両方をバインドすることが可能でした。 v2では、構造体のみバインドできるようになり、シンプルになりました。 v1においてBind()
メソッドに渡していた構造体のインスタンスは、アプリケーションオプションのBind
フィールドで指定できます。
app := wails.CreateApp(/* options */)
app.Bind(basic)
err := wails.Run(&options.App{
/* other options */
Bind: []interface{}{
basic,
},
})
v1では、バインドされたメソッドをフロントエンドから利用するにはwindow.backend
を使用していました。 これはwindow.go
に変更されました。
アプリケーションライフサイクル
v1では、バインドされた構造体の中に、WailsInit()
およびWailsShutdown()
という2つの特別なメソッドが存在しました。 これらは、アプリケーションオプションの一部として、3つのライフサイクルフックに置き換えられています:
注意: OnDomReadyは、v1でのwails:ready
システムイベントに代わるものです。
これらのメソッドは標準的な関数を指定できますが、一般的には、それらのメソッドを構造体の一部として保持しておきます:
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
}
...
ランタイム
v2のランタイムはv1よりも非常に充実しており、メニュー、ウィンドウ操作、優れたダイアログをサポートしています。 The signature of the methods has changed slightly - please refer to the Runtime Reference.
v1では、WailsInit()
に渡された構造体を介してランタイムを利用できていました。 v2では、ランタイムは独自のパッケージとして移植されています。 ランタイムの各メソッドは、OnStartupメソッドで受け渡されるcontext.Context
を引数に取ります。
package main
import "github.com/wailsapp/wails/v2/pkg/runtime"
type Basic struct {
ctx context.Context
}
// startupはアプリケーション起動時に呼び出される
func (a *App) startup(ctx context.Context) {
a.ctx = ctx
runtime.LogInfo(ctx, "Application Startup called!")
}
アセット
v2での最も大きな変更は、アセットの取り扱い方です。
v1では、2つのアプリケーションオプションを介してアセットを指定していました:
JS
- アプリケーションのJavaScriptCSS
- アプリケーションのCSS
これは、単一のJSファイルおよびCSSファイルを、開発者が責任をもって作成する必要があることを意味していました。 基本的には、webpackのような複雑なパッカーを使用する必要がありました。
v2では、Wailsは一般的なWebサーバと同じように、フロントエンドアセットは何でも構いません。 すべてのアプリケーションアセットは、embed.FS
インスタンスとしてアプリケーションオプションに渡されます。
つまりアセットをバンドルしたり、画像をBase64でエンコードしたり、カスタムフォントを使用するためにバンドラーの設定を工夫したりする必要は一切ありません。
アプリケーション起動時に、Wailsは、あらかじめembed.FS
で指定されたディレクトリ内をスキャンしてindex.html
を探し、Webサーバの挙動のように、その場所をすべてのアプリケーションアセットのルートパスとみなします。
例: とあるアプリケーションのプロジェクトディレクトリの構成が次のようになっているとします。 この場合、最終的に必要なすべてのアセットはfrontend/dist
ディレクトリ配下に配置される必要があります:
.
├── build/
├── frontend/
│ └── dist/
│ ├── index.html
│ ├── main.js
│ ├── main.css
│ └── logo.svg
├── main.go
└── wails.json
これらのアセットは、embed.FS
を定義するだけで、アプリケーションから使用することができます:
//go:embed all:frontend/dist
var assets embed.FS
func main() {
err := wails.Run(&options.App{
/* Other Options */
AssetServer: &assetserver.Options{
Assets: assets,
},
})
}
もちろん、必要に応じてバンドラを使用することもできます。 唯一行わなければいけないことは、アプリケーションオプションのAssets
キーにembed.FS
インスタンスを指定して、Wailsにアプリケーションアセットディレクトリを教えてあげることです。
プロジェクト構成
v1では、プロジェクトルートに存在するproject.json
ファイルで、プロジェクト構成を管理していました。 v2では、プロジェクトルートにあるwails.json
ファイルでプロジェクト構成を管理します。
フォーマットは若干変更されています。 比較表は次のとおりです:
v1 | v2 | 備考 |
---|---|---|
name | name | |
description | 消去されました | |
author / name | author / name | |
author / email | author / email | |
version | version | |
binaryname | outputfilename | 変更されました |
frontend / dir | 消去されました | |
frontend / install | frontend:install | 変更されました |
frontend / build | frontend:build | 変更されました |
frontend / bridge | 消去されました | |
frontend / serve | 消去されました | |
tags | 消去されました | |
wailsjsdir | wailsjsモジュールを生成するディレクトリ | |
assetdir | dev モードでコンパイルされたフロントエンドアセットのディレクトリ。 通常は自動推定されるため、空のままで構いません。 | |
reloaddirs | dev モードでリロードをトリガーさせたい追加のディレクトリを指定するための、カンマ区切りのリスト。 高度なアセット構成をとる場合にのみ必要です。 |