![]({require("@site/static/img/showcase/emailit.webp").default})
![]({require("@site/static/img/showcase/encrypteasy.webp").default})
+ ![]({require("@site/static/img/showcase/filehound.webp").default})
+
+
![]({require("@site/static/img/showcase/minecraft-mod-updater.webp").default})
![]({require("@site/static/img/showcase/modalfilemanager.webp").default})
![]({require("@site/static/img/showcase/mollywallet.webp").default})
![]({require("@site/static/img/showcase/october.webp").default})
![]({require("@site/static/img/showcase/optimus.webp").default})
![]({require("@site/static/img/showcase/portfall.webp").default})
![]({require("@site/static/img/showcase/restic-browser-2.png").default})
![]({require("@site/static/img/showcase/riftshare-main.webp").default})
![]({require("@site/static/img/showcase/scriptbar.webp").default})
![]({require("@site/static/img/showcase/surge.png").default})
![]({require("@site/static/img/showcase/wally.webp").default})
![]({require("@site/static/img/showcase/wombat.webp").default})
![]({require("@site/static/img/showcase/ytd.webp").default})
![]({require("@site/static/img/defaultproject.webp").default})
+xcode-select --install.
+ wails doctor command.
+ gcc build tools plus libgtk3 and libwebkit. 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 wails doctor after installation to be shown how to install the dependencies. If your distro/package manager is not supported, please consult the Add Linux Distro guide.
+
+ ![]({require("@site/static/img/assetshandler-does-not-exist.webp").default})
+
+ ![]({require("@site/static/img/assetshandler-go-mod.webp").default})
+
+```
+
+Then we would see the following:
+
+```mdx-code-block
+
+ ![]({require("@site/static/img/assetshandler-image.webp").default})
+
+ ![]({require("@site/static/img/vscode.webp").default})
+
+ +| 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. | + +
diff --git a/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.1.0/guides/mouse-buttons.mdx b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.1.0/guides/mouse-buttons.mdx new file mode 100644 index 000000000..49e9cd69c --- /dev/null +++ b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.1.0/guides/mouse-buttons.mdx @@ -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 diff --git a/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.1.0/guides/obfuscated.mdx b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.1.0/guides/obfuscated.mdx new file mode 100644 index 000000000..d5c6c5a29 --- /dev/null +++ b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.1.0/guides/obfuscated.mdx @@ -0,0 +1,42 @@ +# 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). + +## 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. diff --git a/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.1.0/guides/overscroll.mdx b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.1.0/guides/overscroll.mdx new file mode 100644 index 000000000..9d1d772d0 --- /dev/null +++ b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.1.0/guides/overscroll.mdx @@ -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; +} +``` diff --git a/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.1.0/guides/routing.mdx b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.1.0/guides/routing.mdx new file mode 100644 index 000000000..a3444f98e --- /dev/null +++ b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.1.0/guides/routing.mdx @@ -0,0 +1,47 @@ +# 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/docs/en/v6/routers/hash-router): + +```jsx +import { HashRouter } from "react-router-dom"; + +ReactDOM.render( +![]({require("@site/static/img/vue3-template.png").default})
+
+
+
+ ![]({require("@site/static/img/nsis.webp").default})
+
+
![]({require("@site/static/img/architecture.webp").default})
+
+
+ ![]({require("@site/static/img/showcase/varly2.webp").default})
+
+
+
+The assets handler 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 `assets` because the file is not found.
+
+| 値 | Win | Mac | Lin |
+| ----------------------- | --- | --- | --- |
+| GET | ✅ | ✅ | ✅ |
+| POST | ✅ | ✅ | ❌ |
+| PUT | ✅ | ✅ | ❌ |
+| PATCH | ✅ | ✅ | ❌ |
+| DELETE | ✅ | ✅ | ❌ |
+| Request Headers | ✅ | ✅ | ❌ |
+| Request Body | ✅ | ✅ | ❌ |
+| Request Body Streaming | ❌ | ❌ | ❌ |
+| Response StatusCodes | ✅ | ✅ | ❌ |
+| Response Headers | ✅ | ✅ | ❌ |
+| Response Body | ✅ | ✅ | ✅ |
+| Response Body Streaming | ❌ | ❌ | ✅ |
+
+NOTE: Linux is currently very limited due to targeting a WebKit2GTK Version < 2.36.0. In the future some features will be supported by the introduction of WebKit2GTK 2.36.0+ support.
+
+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.
+
+名前: AssetsHandler![]({require("@site/static/img/reference/about-menu.webp").default})
+![]({require("@site/static/img/reference/about-dialog.webp").default})
+![]({require("@site/static/img/runtime/dialog_no_defaults.png").default})
+![]({require("@site/static/img/runtime/dialog_default_button.png").default})
+![]({require("@site/static/img/runtime/dialog_default_cancel.png").default})
+![]({require("@site/static/img/runtime/dialog_win_filters.png").default})
+![]({require("@site/static/img/runtime/dialog_lin_filters.png").default})
+![]({require("@site/static/img/tutorials/dogsapi/img.webp").default})
+![]({require("@site/static/img/helloworld-app-icon.webp").default}){kind=icon}
+![]({require("@site/static/img/windows-default-app.webp").default})
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+xcode-select --install 来完成。
+ wails doctor 命令进行检查。
+ gcc 构建工具以及 libgtk3 和 libwebkit。 与其为不同的发行版列出大量命令，Wails 可以尝试确定针对您的特定发行版的安装命令。 安装后运行 wails doctor 以显示如何安装依赖项。 如果您的发行版/包管理器不受支持，请参阅 添加Linux发行版指南。
+
+
+
+
+
+```
+
+然后我们会看到以下内容：
+
+```mdx-code-block
+
+
+
+
+
+ +| 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. 这只需要一些更重要的资源配置。 | + +
diff --git a/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.1.0/guides/mouse-buttons.mdx b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.1.0/guides/mouse-buttons.mdx new file mode 100644 index 000000000..13e54ec46 --- /dev/null +++ b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.1.0/guides/mouse-buttons.mdx @@ -0,0 +1,25 @@ +# 鼠标按钮 + +Wails 运行时拦截鼠标单击以确定无框窗口是否需要调整大小或需要移动窗口。 有人询问如何检测鼠标点击何时发生，因为 `window.onclick` 没有正确报告鼠标按钮。 下面的代码展示了如何检测鼠标点击： + +```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 + } +} +``` + +参考：https://developer.mozilla.org/en-US/docs/Web/API/MouseEvent/button diff --git a/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.1.0/guides/obfuscated.mdx b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.1.0/guides/obfuscated.mdx new file mode 100644 index 000000000..aa5814f54 --- /dev/null +++ b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.1.0/guides/obfuscated.mdx @@ -0,0 +1,42 @@ +# 混淆构建 + +Wails 支持使用 [garble](https://github.com/burrowers/garble) 来混淆您的应用程序。 + +要生成混淆构建，您可以将 `-obfuscate` 标志与 `wails build` 命令一起使用： + +```bash +wails build -obfuscated +``` + +要自定义混淆设置，您可以使用以下 `-garbleargs` 标志： + +```bash +wails build -obfuscated -garbleargs "-literals -tiny -seed=myrandomseed" +``` + +这些设置可能会保留在您的 [项目配置](../reference/project-config) 中。 + +## 工作原理 + +在标准构建中，所有绑定的方法都在前端的 `window.go` 变量下可用。 调用这些方法时，会使用完全限定的函数名调用相应的后端方法。 使用混淆构建时，使用 ID 而不是绑定方法的名称。 目录中生成的绑定 `wailsjs` 使用这些 ID 调用后端函数。 + +:::note + + +为确保您的应用程序在混淆模式下工作，您必须使用 `wailsjs` 应用程序目录下生成的绑定。 + +::: + + +## 示例 + +从绑定中导入“Greet” 方法，如下所示： + +```js +import { Greet } from "../../wailsjs/go/main/App"; + +// snip +Greet("World"); +``` + +将确保该方法在混淆模式下正常工作，因为绑定将使用 ID 重新生成并更新调用机制。 diff --git a/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.1.0/guides/overscroll.mdx b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.1.0/guides/overscroll.mdx new file mode 100644 index 000000000..64673dafd --- /dev/null +++ b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.1.0/guides/overscroll.mdx @@ -0,0 +1,10 @@ +# 滚动超出 + +[Overscroll](https://developer.mozilla.org/zh-CN/docs/Web/CSS/overscroll-behavior) 是当您滚动超出页面内容边界时有时会获得的“弹跳效果”。 这在移动应用程序中很常见。 这可以使用 CSS 禁用： + +```css +html { + height: 100%; + overflow: hidden; +} +``` diff --git a/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.1.0/guides/routing.mdx b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.1.0/guides/routing.mdx new file mode 100644 index 000000000..b1b4c6690 --- /dev/null +++ b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.1.0/guides/routing.mdx @@ -0,0 +1,47 @@ +# 路由 + +路由是一种在应用程序中切换视图的流行方式。 此页面提供了有关如何执行此操作的一些指导。 + +## Vue + +在 Vue 中推荐的路由方法是 [Hash 模式](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 + +在 Angular 中推荐的路由方法是 [HashLocationStrategy](https://codecraft.tv/courses/angular/routing/routing-strategies/#_hashlocationstrategy): + +```ts +RouterModule.forRoot(routes, { useHash: true }); +``` + +## React + +React 中推荐的路由方法是 [HashRouter](https://reactrouter.com/docs/en/v6/routers/hash-router)： + +```jsx +import { HashRouter } from "react-router-dom"; + +ReactDOM.render( +
+
+
+
+
+
+
+
+
+
+
+
+
+资产处理程序是一个通用的 `http.Handler` ，对于资产服务器上的任何非 GET 请求和 `assets` 由于找不到文件而无法从 GET 请求提供服务的 GET 请求都将被调用。
+
+| 值 | Win | Mac | Lin |
+| ----------------------- | --- | --- | --- |
+| GET | ✅ | ✅ | ✅ |
+| POST | ✅ | ✅ | ❌ |
+| PUT | ✅ | ✅ | ❌ |
+| PATCH | ✅ | ✅ | ❌ |
+| DELETE | ✅ | ✅ | ❌ |
+| Request Headers | ✅ | ✅ | ❌ |
+| Request Body | ✅ | ✅ | ❌ |
+| Request Body Streaming | ❌ | ❌ | ❌ |
+| Response StatusCodes | ✅ | ✅ | ❌ |
+| Response Headers | ✅ | ✅ | ❌ |
+| Response Body | ✅ | ✅ | ✅ |
+| Response Body Streaming | ❌ | ❌ | ✅ |
+
+注意：Linux 当前非常有限，因为目标是 WebKit2GTK 版本 < 2.36.0。 将来，一些特性将通过引入 WebKit2GTK 2.36.0+ 支持来支持。
+
+注意：当与前端 DevServer 结合使用时，可能会有一些限制，例如。 Vite 在不包含文件扩展名的每个路径上提供 index.html。
+
+名称：AssetsHandler
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
xcode-select --install
+ done by running xcode-select --install.
wails doctor command (see
- below).
+ Wails requires that the WebView2 runtime is installed. Some Windows installations will already have this installed. You can check using the wails doctor command.
gcc build tools plus{" "}
- libgtk3 and libwebkit. 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{" "}
- wails doctor after installation to be shown how to install the
- dependencies. If your distro/package manager is not supported, please
- consult the{" "}
- Add Linux Distro guide.
+ Linux required the standard gcc build tools plus libgtk3 and libwebkit. 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 wails doctor after installation to be shown how to install the dependencies. If your distro/package manager is not supported, please consult the Add Linux Distro guide.
+
@@ -206,6 +226,7 @@ the button with "three" is shown at the bottom of the dialog. When `escape` is p
@@ -242,15 +264,17 @@ dialog:
@@ -258,6 +282,7 @@ dialog: