From 0bb8147f5cebf409036a814dfd476fc55354f777 Mon Sep 17 00:00:00 2001 From: Lea Anthony Date: Wed, 21 Sep 2022 20:30:21 +1000 Subject: [PATCH] Revert "feat: remove documentation for "beta" and "rc" versions" This reverts commit f587457e7e69ce37a601ca3c47a22e805a2b312b. --- website/.prettierrc | 22 + .../version-v2.0.0-beta.44.json | 38 + .../version-v2.0.0-rc.1.json | 38 + .../version-v2.0.0-beta.44.json | 38 + .../version-v2.0.0-rc.1.json | 38 + .../appendix/_category_.json | 4 + .../community/_category_.json | 4 + .../version-v2.0.0-rc.1/community/links.mdx | 23 + .../community/showcase/_category_.json | 4 + .../community/showcase/emailit.mdx | 8 + .../community/showcase/encrypteasy.mdx | 10 + .../community/showcase/filehound.mdx | 14 + .../community/showcase/minecraftupdater.mdx | 10 + .../community/showcase/modalfilemanager.mdx | 12 + .../community/showcase/mollywallet.mdx | 8 + .../community/showcase/october.mdx | 12 + .../community/showcase/optimus.mdx | 8 + .../community/showcase/portfall.mdx | 8 + .../community/showcase/restic-browser.mdx | 10 + .../community/showcase/riftshare.mdx | 19 + .../community/showcase/scriptbar.mdx | 8 + .../community/showcase/surge.mdx | 8 + .../community/showcase/wally.mdx | 8 + .../community/showcase/wombat.mdx | 8 + .../community/showcase/ytd.mdx | 8 + .../community/templates.mdx | 52 ++ .../gettingstarted/_category_.json | 4 + .../gettingstarted/building.mdx | 21 + .../gettingstarted/development.mdx | 16 + .../gettingstarted/firstproject.mdx | 130 ++++ .../gettingstarted/installation.mdx | 90 +++ .../guides/_category_.json | 4 + .../guides/application-development.mdx | 194 +++++ .../guides/bleeding-edge.mdx | 55 ++ .../guides/dynamic-assets.mdx | 126 +++ .../version-v2.0.0-rc.1/guides/frameless.mdx | 84 ++ .../version-v2.0.0-rc.1/guides/frontend.mdx | 75 ++ .../version-v2.0.0-rc.1/guides/ides.mdx | 113 +++ .../guides/linux-distro-support.mdx | 101 +++ .../version-v2.0.0-rc.1/guides/linux.mdx | 18 + .../guides/manual-builds.mdx | 95 +++ .../version-v2.0.0-rc.1/guides/migrating.mdx | 187 +++++ .../guides/mouse-buttons.mdx | 25 + .../version-v2.0.0-rc.1/guides/overscroll.mdx | 10 + .../version-v2.0.0-rc.1/guides/routing.mdx | 47 ++ .../version-v2.0.0-rc.1/guides/signing.mdx | 375 +++++++++ .../version-v2.0.0-rc.1/guides/templates.mdx | 95 +++ .../guides/troubleshooting.mdx | 137 ++++ .../version-v2.0.0-rc.1/guides/vscode.mdx | 82 ++ .../guides/windows-installer.mdx | 56 ++ .../version-v2.0.0-rc.1/guides/windows.mdx | 61 ++ .../version-v2.0.0-rc.1/howdoesitwork.mdx | 356 +++++++++ .../version-v2.0.0-rc.1/introduction.mdx | 71 ++ .../reference/_category_.json | 4 + .../version-v2.0.0-rc.1/reference/cli.mdx | 221 ++++++ .../version-v2.0.0-rc.1/reference/menus.mdx | 266 +++++++ .../version-v2.0.0-rc.1/reference/options.mdx | 627 +++++++++++++++ .../reference/project-config.mdx | 51 ++ .../reference/runtime/_category_.json | 4 + .../reference/runtime/browser.mdx | 14 + .../reference/runtime/dialog.mdx | 283 +++++++ .../reference/runtime/events.mdx | 38 + .../reference/runtime/intro.mdx | 73 ++ .../reference/runtime/log.mdx | 130 ++++ .../reference/runtime/menu.mdx | 23 + .../reference/runtime/window.mdx | 209 +++++ .../tutorials/_category_.json | 4 + .../version-v2.0.0-rc.1/tutorials/dogsapi.mdx | 243 ++++++ .../tutorials/helloworld.mdx | 118 +++ .../version-v2.0.0-beta.44.json | 38 + .../version-v2.0.0-rc.1.json | 38 + .../appendix/_category_.json | 4 + .../community/_category_.json | 4 + .../version-v2.0.0-rc.1/community/links.mdx | 23 + .../community/showcase/_category_.json | 4 + .../community/showcase/emailit.mdx | 8 + .../community/showcase/encrypteasy.mdx | 10 + .../community/showcase/filehound.mdx | 14 + .../community/showcase/minecraftupdater.mdx | 10 + .../community/showcase/modalfilemanager.mdx | 12 + .../community/showcase/mollywallet.mdx | 8 + .../community/showcase/october.mdx | 12 + .../community/showcase/optimus.mdx | 8 + .../community/showcase/portfall.mdx | 8 + .../community/showcase/restic-browser.mdx | 10 + .../community/showcase/riftshare.mdx | 19 + .../community/showcase/scriptbar.mdx | 8 + .../community/showcase/surge.mdx | 8 + .../community/showcase/wally.mdx | 8 + .../community/showcase/wombat.mdx | 8 + .../community/showcase/ytd.mdx | 8 + .../community/templates.mdx | 52 ++ .../contributing/_category_.json | 4 + .../contributing/developing-new-features.mdx | 29 + .../contributing/documenting.mdx | 34 + .../contributing/fixing-bugs.mdx | 27 + .../contributing/helping-others.mdx | 13 + .../setting-up-a-dev-environment.mdx | 30 + .../contributing/testing.mdx | 16 + .../contributing/ways-of-contributing.mdx | 18 + .../gettingstarted/_category_.json | 4 + .../gettingstarted/building.mdx | 21 + .../gettingstarted/development.mdx | 16 + .../gettingstarted/firstproject.mdx | 132 ++++ .../gettingstarted/installation.mdx | 95 +++ .../guides/_category_.json | 4 + .../guides/application-development.mdx | 194 +++++ .../guides/bleeding-edge.mdx | 55 ++ .../guides/dynamic-assets.mdx | 126 +++ .../version-v2.0.0-rc.1/guides/frameless.mdx | 84 ++ .../version-v2.0.0-rc.1/guides/frontend.mdx | 72 ++ .../version-v2.0.0-rc.1/guides/ides.mdx | 125 +++ .../guides/linux-distro-support.mdx | 101 +++ .../version-v2.0.0-rc.1/guides/linux.mdx | 18 + .../guides/manual-builds.mdx | 95 +++ .../version-v2.0.0-rc.1/guides/migrating.mdx | 187 +++++ .../guides/mouse-buttons.mdx | 25 + .../version-v2.0.0-rc.1/guides/overscroll.mdx | 10 + .../version-v2.0.0-rc.1/guides/routing.mdx | 47 ++ .../version-v2.0.0-rc.1/guides/signing.mdx | 379 +++++++++ .../version-v2.0.0-rc.1/guides/templates.mdx | 95 +++ .../guides/troubleshooting.mdx | 142 ++++ .../version-v2.0.0-rc.1/guides/vscode.mdx | 82 ++ .../guides/windows-installer.mdx | 56 ++ .../version-v2.0.0-rc.1/guides/windows.mdx | 61 ++ .../version-v2.0.0-rc.1/howdoesitwork.mdx | 355 +++++++++ .../version-v2.0.0-rc.1/introduction.mdx | 71 ++ .../reference/_category_.json | 4 + .../version-v2.0.0-rc.1/reference/cli.mdx | 221 ++++++ .../version-v2.0.0-rc.1/reference/menus.mdx | 261 +++++++ .../version-v2.0.0-rc.1/reference/options.mdx | 633 +++++++++++++++ .../reference/project-config.mdx | 51 ++ .../reference/runtime/_category_.json | 4 + .../reference/runtime/browser.mdx | 14 + .../reference/runtime/dialog.mdx | 283 +++++++ .../reference/runtime/events.mdx | 38 + .../reference/runtime/intro.mdx | 73 ++ .../reference/runtime/log.mdx | 130 ++++ .../reference/runtime/menu.mdx | 23 + .../reference/runtime/window.mdx | 211 +++++ .../tutorials/_category_.json | 4 + .../version-v2.0.0-rc.1/tutorials/dogsapi.mdx | 243 ++++++ .../tutorials/helloworld.mdx | 118 +++ .../version-v2.0.0-beta.44.json | 38 + .../version-v2.0.0-rc.1.json | 38 + .../appendix/_category_.json | 4 + .../community/_category_.json | 4 + .../version-v2.0.0-rc.1/community/links.mdx | 23 + .../community/showcase/_category_.json | 4 + .../community/showcase/emailit.mdx | 8 + .../community/showcase/encrypteasy.mdx | 10 + .../community/showcase/filehound.mdx | 14 + .../community/showcase/minecraftupdater.mdx | 10 + .../community/showcase/modalfilemanager.mdx | 12 + .../community/showcase/mollywallet.mdx | 8 + .../community/showcase/october.mdx | 12 + .../community/showcase/optimus.mdx | 8 + .../community/showcase/portfall.mdx | 8 + .../community/showcase/restic-browser.mdx | 10 + .../community/showcase/riftshare.mdx | 19 + .../community/showcase/scriptbar.mdx | 8 + .../community/showcase/surge.mdx | 8 + .../community/showcase/wally.mdx | 8 + .../community/showcase/wombat.mdx | 8 + .../community/showcase/ytd.mdx | 8 + .../community/templates.mdx | 52 ++ .../gettingstarted/_category_.json | 4 + .../gettingstarted/building.mdx | 21 + .../gettingstarted/development.mdx | 16 + .../gettingstarted/firstproject.mdx | 130 ++++ .../gettingstarted/installation.mdx | 90 +++ .../guides/_category_.json | 4 + .../guides/application-development.mdx | 194 +++++ .../guides/bleeding-edge.mdx | 55 ++ .../guides/dynamic-assets.mdx | 126 +++ .../version-v2.0.0-rc.1/guides/frameless.mdx | 84 ++ .../version-v2.0.0-rc.1/guides/frontend.mdx | 75 ++ .../version-v2.0.0-rc.1/guides/ides.mdx | 113 +++ .../guides/linux-distro-support.mdx | 101 +++ .../version-v2.0.0-rc.1/guides/linux.mdx | 18 + .../guides/manual-builds.mdx | 95 +++ .../version-v2.0.0-rc.1/guides/migrating.mdx | 189 +++++ .../guides/mouse-buttons.mdx | 25 + .../version-v2.0.0-rc.1/guides/overscroll.mdx | 10 + .../version-v2.0.0-rc.1/guides/routing.mdx | 47 ++ .../version-v2.0.0-rc.1/guides/signing.mdx | 377 +++++++++ .../version-v2.0.0-rc.1/guides/templates.mdx | 95 +++ .../guides/troubleshooting.mdx | 137 ++++ .../version-v2.0.0-rc.1/guides/vscode.mdx | 82 ++ .../guides/windows-installer.mdx | 56 ++ .../version-v2.0.0-rc.1/guides/windows.mdx | 61 ++ .../version-v2.0.0-rc.1/howdoesitwork.mdx | 356 +++++++++ .../version-v2.0.0-rc.1/introduction.mdx | 71 ++ .../reference/_category_.json | 4 + .../version-v2.0.0-rc.1/reference/cli.mdx | 221 ++++++ .../version-v2.0.0-rc.1/reference/menus.mdx | 266 +++++++ .../version-v2.0.0-rc.1/reference/options.mdx | 627 +++++++++++++++ .../reference/project-config.mdx | 51 ++ .../reference/runtime/_category_.json | 4 + .../reference/runtime/browser.mdx | 14 + .../reference/runtime/dialog.mdx | 283 +++++++ .../reference/runtime/events.mdx | 38 + .../reference/runtime/intro.mdx | 73 ++ .../reference/runtime/log.mdx | 130 ++++ .../reference/runtime/menu.mdx | 23 + .../reference/runtime/window.mdx | 211 +++++ .../tutorials/_category_.json | 4 + .../version-v2.0.0-rc.1/tutorials/dogsapi.mdx | 243 ++++++ .../tutorials/helloworld.mdx | 118 +++ .../version-v2.0.0-beta.44.json | 38 + .../version-v2.0.0-rc.1.json | 38 + .../appendix/_category_.json | 4 + .../community/_category_.json | 4 + .../version-v2.0.0-rc.1/community/links.mdx | 23 + .../community/showcase/_category_.json | 4 + .../community/showcase/emailit.mdx | 8 + .../community/showcase/encrypteasy.mdx | 10 + .../community/showcase/filehound.mdx | 14 + .../community/showcase/minecraftupdater.mdx | 10 + .../community/showcase/modalfilemanager.mdx | 12 + .../community/showcase/mollywallet.mdx | 8 + .../community/showcase/october.mdx | 12 + .../community/showcase/optimus.mdx | 8 + .../community/showcase/portfall.mdx | 8 + .../community/showcase/restic-browser.mdx | 10 + .../community/showcase/riftshare.mdx | 19 + .../community/showcase/scriptbar.mdx | 8 + .../community/showcase/surge.mdx | 8 + .../community/showcase/wally.mdx | 8 + .../community/showcase/wombat.mdx | 8 + .../community/showcase/ytd.mdx | 8 + .../community/templates.mdx | 52 ++ .../contributing/developing-new-features.mdx | 34 + .../contributing/documenting.mdx | 34 + .../contributing/fixing-bugs.mdx | 29 + .../setting-up-a-dev-environment.mdx | 30 + .../contributing/ways-of-contributing.mdx | 18 + .../gettingstarted/_category_.json | 4 + .../gettingstarted/building.mdx | 21 + .../gettingstarted/development.mdx | 16 + .../gettingstarted/firstproject.mdx | 132 ++++ .../gettingstarted/installation.mdx | 109 +++ .../guides/_category_.json | 4 + .../guides/application-development.mdx | 194 +++++ .../guides/bleeding-edge.mdx | 55 ++ .../guides/dynamic-assets.mdx | 130 ++++ .../version-v2.0.0-rc.1/guides/frameless.mdx | 84 ++ .../version-v2.0.0-rc.1/guides/frontend.mdx | 72 ++ .../version-v2.0.0-rc.1/guides/ides.mdx | 110 +++ .../guides/linux-distro-support.mdx | 101 +++ .../version-v2.0.0-rc.1/guides/linux.mdx | 18 + .../guides/manual-builds.mdx | 95 +++ .../version-v2.0.0-rc.1/guides/migrating.mdx | 205 +++++ .../guides/mouse-buttons.mdx | 25 + .../version-v2.0.0-rc.1/guides/overscroll.mdx | 10 + .../version-v2.0.0-rc.1/guides/routing.mdx | 49 ++ .../version-v2.0.0-rc.1/guides/signing.mdx | 575 ++++++++++++++ .../version-v2.0.0-rc.1/guides/templates.mdx | 102 +++ .../guides/troubleshooting.mdx | 142 ++++ .../version-v2.0.0-rc.1/guides/vscode.mdx | 118 +++ .../guides/windows-installer.mdx | 56 ++ .../version-v2.0.0-rc.1/guides/windows.mdx | 61 ++ .../version-v2.0.0-rc.1/howdoesitwork.mdx | 435 +++++++++++ .../version-v2.0.0-rc.1/introduction.mdx | 71 ++ .../reference/_category_.json | 4 + .../version-v2.0.0-rc.1/reference/cli.mdx | 252 ++++++ .../version-v2.0.0-rc.1/reference/menus.mdx | 277 +++++++ .../version-v2.0.0-rc.1/reference/options.mdx | 644 +++++++++++++++ .../reference/project-config.mdx | 63 ++ .../reference/runtime/_category_.json | 4 + .../reference/runtime/browser.mdx | 14 + .../reference/runtime/dialog.mdx | 283 +++++++ .../reference/runtime/events.mdx | 38 + .../reference/runtime/intro.mdx | 73 ++ .../reference/runtime/log.mdx | 130 ++++ .../reference/runtime/menu.mdx | 24 + .../reference/runtime/window.mdx | 213 +++++ .../tutorials/_category_.json | 4 + .../version-v2.0.0-rc.1/tutorials/dogsapi.mdx | 243 ++++++ .../tutorials/helloworld.mdx | 117 +++ .../appendix/_category_.json | 4 + .../community/_category_.json | 4 + .../community/links.mdx | 24 + .../community/showcase/_category_.json | 4 + .../community/showcase/emailit.mdx | 8 + .../community/showcase/encrypteasy.mdx | 10 + .../community/showcase/filehound.mdx | 23 + .../community/showcase/modalfilemanager.mdx | 10 + .../community/showcase/mollywallet.mdx | 9 + .../community/showcase/october.mdx | 11 + .../community/showcase/optimus.mdx | 9 + .../community/showcase/portfall.mdx | 9 + .../community/showcase/restic-browser.mdx | 11 + .../community/showcase/riftshare.mdx | 19 + .../community/showcase/scriptbar.mdx | 7 + .../community/showcase/surge.mdx | 9 + .../community/showcase/wally.mdx | 9 + .../community/showcase/wombat.mdx | 10 + .../community/showcase/ytd.mdx | 10 + .../community/templates.mdx | 49 ++ .../contributing/_category_.json | 4 + .../contributing/developing-new-features.mdx | 35 + .../contributing/documenting.mdx | 39 + .../contributing/fixing-bugs.mdx | 30 + .../contributing/helping-others.mdx | 17 + .../setting-up-a-dev-environment.mdx | 34 + .../contributing/testing.mdx | 21 + .../contributing/ways-of-contributing.mdx | 22 + .../gettingstarted/_category_.json | 4 + .../gettingstarted/building.mdx | 19 + .../gettingstarted/development.mdx | 16 + .../gettingstarted/firstproject.mdx | 125 +++ .../gettingstarted/installation.mdx | 95 +++ .../guides/_category_.json | 4 + .../guides/application-development.mdx | 231 ++++++ .../guides/bleeding-edge.mdx | 54 ++ .../guides/dynamic-assets.mdx | 123 +++ .../guides/frameless.mdx | 47 ++ .../guides/frontend.mdx | 77 ++ .../version-v2.0.0-beta.44/guides/ides.mdx | 114 +++ .../guides/linux-distro-support.mdx | 108 +++ .../version-v2.0.0-beta.44/guides/linux.mdx | 20 + .../guides/manual-builds.mdx | 99 +++ .../guides/migrating.mdx | 206 +++++ .../guides/mouse-buttons.mdx | 28 + .../guides/overscroll.mdx | 11 + .../version-v2.0.0-beta.44/guides/routing.mdx | 47 ++ .../version-v2.0.0-beta.44/guides/signing.mdx | 386 +++++++++ .../guides/templates.mdx | 95 +++ .../guides/troubleshooting.mdx | 111 +++ .../guides/windows-installer.mdx | 51 ++ .../version-v2.0.0-beta.44/guides/windows.mdx | 71 ++ .../version-v2.0.0-beta.44/howdoesitwork.mdx | 403 ++++++++++ .../version-v2.0.0-beta.44/introduction.mdx | 78 ++ .../reference/_category_.json | 4 + .../version-v2.0.0-beta.44/reference/cli.mdx | 227 ++++++ .../reference/menus.mdx | 271 +++++++ .../reference/options.mdx | 732 ++++++++++++++++++ .../reference/project-config.mdx | 52 ++ .../reference/runtime/_category_.json | 4 + .../reference/runtime/browser.mdx | 20 + .../reference/runtime/dialog.mdx | 263 +++++++ .../reference/runtime/events.mdx | 51 ++ .../reference/runtime/intro.mdx | 70 ++ .../reference/runtime/log.mdx | 153 ++++ .../reference/runtime/menu.mdx | 25 + .../reference/runtime/window.mdx | 224 ++++++ .../tutorials/_category_.json | 4 + .../tutorials/helloworld.mdx | 113 +++ .../appendix/_category_.json | 4 + .../community/_category_.json | 4 + .../version-v2.0.0-rc.1/community/links.mdx | 24 + .../community/showcase/_category_.json | 4 + .../community/showcase/emailit.mdx | 8 + .../community/showcase/encrypteasy.mdx | 10 + .../community/showcase/filehound.mdx | 22 + .../community/showcase/minecraftupdater.mdx | 10 + .../community/showcase/modalfilemanager.mdx | 12 + .../community/showcase/mollywallet.mdx | 8 + .../community/showcase/october.mdx | 12 + .../community/showcase/optimus.mdx | 8 + .../community/showcase/portfall.mdx | 8 + .../community/showcase/restic-browser.mdx | 10 + .../community/showcase/riftshare.mdx | 19 + .../community/showcase/scriptbar.mdx | 8 + .../community/showcase/surge.mdx | 8 + .../community/showcase/wally.mdx | 8 + .../community/showcase/wombat.mdx | 8 + .../community/showcase/ytd.mdx | 8 + .../community/templates.mdx | 53 ++ .../gettingstarted/_category_.json | 4 + .../gettingstarted/building.mdx | 21 + .../gettingstarted/development.mdx | 16 + .../gettingstarted/firstproject.mdx | 134 ++++ .../gettingstarted/installation.mdx | 98 +++ .../guides/_category_.json | 4 + .../guides/application-development.mdx | 228 ++++++ .../guides/bleeding-edge.mdx | 61 ++ .../guides/dynamic-assets.mdx | 133 ++++ .../version-v2.0.0-rc.1/guides/frameless.mdx | 89 +++ .../version-v2.0.0-rc.1/guides/frontend.mdx | 73 ++ .../version-v2.0.0-rc.1/guides/ides.mdx | 129 +++ .../guides/linux-distro-support.mdx | 108 +++ .../version-v2.0.0-rc.1/guides/linux.mdx | 20 + .../guides/manual-builds.mdx | 98 +++ .../version-v2.0.0-rc.1/guides/migrating.mdx | 204 +++++ .../guides/mouse-buttons.mdx | 27 + .../version-v2.0.0-rc.1/guides/obfuscated.mdx | 43 + .../version-v2.0.0-rc.1/guides/overscroll.mdx | 11 + .../version-v2.0.0-rc.1/guides/routing.mdx | 47 ++ .../version-v2.0.0-rc.1/guides/signing.mdx | 411 ++++++++++ .../version-v2.0.0-rc.1/guides/templates.mdx | 97 +++ .../guides/troubleshooting.mdx | 159 ++++ .../version-v2.0.0-rc.1/guides/vscode.mdx | 85 ++ .../guides/windows-installer.mdx | 58 ++ .../version-v2.0.0-rc.1/guides/windows.mdx | 71 ++ .../version-v2.0.0-rc.1/howdoesitwork.mdx | 405 ++++++++++ .../version-v2.0.0-rc.1/introduction.mdx | 90 +++ .../reference/_category_.json | 4 + .../version-v2.0.0-rc.1/reference/cli.mdx | 226 ++++++ .../version-v2.0.0-rc.1/reference/menus.mdx | 271 +++++++ .../version-v2.0.0-rc.1/reference/options.mdx | 668 ++++++++++++++++ .../reference/project-config.mdx | 54 ++ .../reference/runtime/_category_.json | 4 + .../reference/runtime/browser.mdx | 15 + .../reference/runtime/dialog.mdx | 284 +++++++ .../reference/runtime/events.mdx | 45 ++ .../reference/runtime/intro.mdx | 92 +++ .../reference/runtime/log.mdx | 142 ++++ .../reference/runtime/menu.mdx | 23 + .../reference/runtime/window.mdx | 243 ++++++ .../tutorials/_category_.json | 4 + .../version-v2.0.0-rc.1/tutorials/dogsapi.mdx | 248 ++++++ .../tutorials/helloworld.mdx | 120 +++ .../version-v2.0.0-beta.44-sidebars.json | 8 + .../version-v2.0.0-rc.1-sidebars.json | 13 + website/versions.json | 5 +- 417 files changed, 32855 insertions(+), 1 deletion(-) create mode 100644 website/.prettierrc create mode 100644 website/i18n/en/docusaurus-plugin-content-docs/version-v2.0.0-beta.44.json create mode 100644 website/i18n/en/docusaurus-plugin-content-docs/version-v2.0.0-rc.1.json create mode 100644 website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-beta.44.json create mode 100644 website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1.json create mode 100644 website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/appendix/_category_.json create mode 100644 website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/_category_.json create mode 100644 website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/links.mdx create mode 100644 website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/_category_.json create mode 100644 website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/emailit.mdx create mode 100644 website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/encrypteasy.mdx create mode 100644 website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/filehound.mdx create mode 100644 website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/minecraftupdater.mdx create mode 100644 website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/modalfilemanager.mdx create mode 100644 website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/mollywallet.mdx create mode 100644 website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/october.mdx create mode 100644 website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/optimus.mdx create mode 100644 website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/portfall.mdx create mode 100644 website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/restic-browser.mdx create mode 100644 website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/riftshare.mdx create mode 100644 website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/scriptbar.mdx create mode 100644 website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/surge.mdx create mode 100644 website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/wally.mdx create mode 100644 website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/wombat.mdx create mode 100644 website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/ytd.mdx create mode 100644 website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/templates.mdx create mode 100644 website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/gettingstarted/_category_.json create mode 100644 website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/gettingstarted/building.mdx create mode 100644 website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/gettingstarted/development.mdx create mode 100644 website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/gettingstarted/firstproject.mdx create mode 100644 website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/gettingstarted/installation.mdx create mode 100644 website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/_category_.json create mode 100644 website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/application-development.mdx create mode 100644 website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/bleeding-edge.mdx create mode 100644 website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/dynamic-assets.mdx create mode 100644 website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/frameless.mdx create mode 100644 website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/frontend.mdx create mode 100644 website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/ides.mdx create mode 100644 website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/linux-distro-support.mdx create mode 100644 website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/linux.mdx create mode 100644 website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/manual-builds.mdx create mode 100644 website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/migrating.mdx create mode 100644 website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/mouse-buttons.mdx create mode 100644 website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/overscroll.mdx create mode 100644 website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/routing.mdx create mode 100644 website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/signing.mdx create mode 100644 website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/templates.mdx create mode 100644 website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/troubleshooting.mdx create mode 100644 website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/vscode.mdx create mode 100644 website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/windows-installer.mdx create mode 100644 website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/windows.mdx create mode 100644 website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/howdoesitwork.mdx create mode 100644 website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/introduction.mdx create mode 100644 website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/_category_.json create mode 100644 website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/cli.mdx create mode 100644 website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/menus.mdx create mode 100644 website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/options.mdx create mode 100644 website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/project-config.mdx create mode 100644 website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/_category_.json create mode 100644 website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/browser.mdx create mode 100644 website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/dialog.mdx create mode 100644 website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/events.mdx create mode 100644 website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/intro.mdx create mode 100644 website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/log.mdx create mode 100644 website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/menu.mdx create mode 100644 website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/window.mdx create mode 100644 website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/tutorials/_category_.json create mode 100644 website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/tutorials/dogsapi.mdx create mode 100644 website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/tutorials/helloworld.mdx create mode 100644 website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-beta.44.json create mode 100644 website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1.json create mode 100644 website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/appendix/_category_.json create mode 100644 website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/_category_.json create mode 100644 website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/links.mdx create mode 100644 website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/_category_.json create mode 100644 website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/emailit.mdx create mode 100644 website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/encrypteasy.mdx create mode 100644 website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/filehound.mdx create mode 100644 website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/minecraftupdater.mdx create mode 100644 website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/modalfilemanager.mdx create mode 100644 website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/mollywallet.mdx create mode 100644 website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/october.mdx create mode 100644 website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/optimus.mdx create mode 100644 website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/portfall.mdx create mode 100644 website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/restic-browser.mdx create mode 100644 website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/riftshare.mdx create mode 100644 website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/scriptbar.mdx create mode 100644 website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/surge.mdx create mode 100644 website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/wally.mdx create mode 100644 website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/wombat.mdx create mode 100644 website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/ytd.mdx create mode 100644 website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/templates.mdx create mode 100644 website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/contributing/_category_.json create mode 100644 website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/contributing/developing-new-features.mdx create mode 100644 website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/contributing/documenting.mdx create mode 100644 website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/contributing/fixing-bugs.mdx create mode 100644 website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/contributing/helping-others.mdx create mode 100644 website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/contributing/setting-up-a-dev-environment.mdx create mode 100644 website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/contributing/testing.mdx create mode 100644 website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/contributing/ways-of-contributing.mdx create mode 100644 website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/gettingstarted/_category_.json create mode 100644 website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/gettingstarted/building.mdx create mode 100644 website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/gettingstarted/development.mdx create mode 100644 website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/gettingstarted/firstproject.mdx create mode 100644 website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/gettingstarted/installation.mdx create mode 100644 website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/_category_.json create mode 100644 website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/application-development.mdx create mode 100644 website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/bleeding-edge.mdx create mode 100644 website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/dynamic-assets.mdx create mode 100644 website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/frameless.mdx create mode 100644 website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/frontend.mdx create mode 100644 website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/ides.mdx create mode 100644 website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/linux-distro-support.mdx create mode 100644 website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/linux.mdx create mode 100644 website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/manual-builds.mdx create mode 100644 website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/migrating.mdx create mode 100644 website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/mouse-buttons.mdx create mode 100644 website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/overscroll.mdx create mode 100644 website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/routing.mdx create mode 100644 website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/signing.mdx create mode 100644 website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/templates.mdx create mode 100644 website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/troubleshooting.mdx create mode 100644 website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/vscode.mdx create mode 100644 website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/windows-installer.mdx create mode 100644 website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/windows.mdx create mode 100644 website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/howdoesitwork.mdx create mode 100644 website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/introduction.mdx create mode 100644 website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/_category_.json create mode 100644 website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/cli.mdx create mode 100644 website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/menus.mdx create mode 100644 website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/options.mdx create mode 100644 website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/project-config.mdx create mode 100644 website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/_category_.json create mode 100644 website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/browser.mdx create mode 100644 website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/dialog.mdx create mode 100644 website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/events.mdx create mode 100644 website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/intro.mdx create mode 100644 website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/log.mdx create mode 100644 website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/menu.mdx create mode 100644 website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/window.mdx create mode 100644 website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/tutorials/_category_.json create mode 100644 website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/tutorials/dogsapi.mdx create mode 100644 website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/tutorials/helloworld.mdx create mode 100644 website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-beta.44.json create mode 100644 website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1.json create mode 100644 website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/appendix/_category_.json create mode 100644 website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/_category_.json create mode 100644 website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/links.mdx create mode 100644 website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/_category_.json create mode 100644 website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/emailit.mdx create mode 100644 website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/encrypteasy.mdx create mode 100644 website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/filehound.mdx create mode 100644 website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/minecraftupdater.mdx create mode 100644 website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/modalfilemanager.mdx create mode 100644 website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/mollywallet.mdx create mode 100644 website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/october.mdx create mode 100644 website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/optimus.mdx create mode 100644 website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/portfall.mdx create mode 100644 website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/restic-browser.mdx create mode 100644 website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/riftshare.mdx create mode 100644 website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/scriptbar.mdx create mode 100644 website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/surge.mdx create mode 100644 website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/wally.mdx create mode 100644 website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/wombat.mdx create mode 100644 website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/ytd.mdx create mode 100644 website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/templates.mdx create mode 100644 website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/gettingstarted/_category_.json create mode 100644 website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/gettingstarted/building.mdx create mode 100644 website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/gettingstarted/development.mdx create mode 100644 website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/gettingstarted/firstproject.mdx create mode 100644 website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/gettingstarted/installation.mdx create mode 100644 website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/_category_.json create mode 100644 website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/application-development.mdx create mode 100644 website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/bleeding-edge.mdx create mode 100644 website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/dynamic-assets.mdx create mode 100644 website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/frameless.mdx create mode 100644 website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/frontend.mdx create mode 100644 website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/ides.mdx create mode 100644 website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/linux-distro-support.mdx create mode 100644 website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/linux.mdx create mode 100644 website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/manual-builds.mdx create mode 100644 website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/migrating.mdx create mode 100644 website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/mouse-buttons.mdx create mode 100644 website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/overscroll.mdx create mode 100644 website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/routing.mdx create mode 100644 website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/signing.mdx create mode 100644 website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/templates.mdx create mode 100644 website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/troubleshooting.mdx create mode 100644 website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/vscode.mdx create mode 100644 website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/windows-installer.mdx create mode 100644 website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/windows.mdx create mode 100644 website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/howdoesitwork.mdx create mode 100644 website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/introduction.mdx create mode 100644 website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/_category_.json create mode 100644 website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/cli.mdx create mode 100644 website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/menus.mdx create mode 100644 website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/options.mdx create mode 100644 website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/project-config.mdx create mode 100644 website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/_category_.json create mode 100644 website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/browser.mdx create mode 100644 website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/dialog.mdx create mode 100644 website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/events.mdx create mode 100644 website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/intro.mdx create mode 100644 website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/log.mdx create mode 100644 website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/menu.mdx create mode 100644 website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/window.mdx create mode 100644 website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/tutorials/_category_.json create mode 100644 website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/tutorials/dogsapi.mdx create mode 100644 website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/tutorials/helloworld.mdx create mode 100644 website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-beta.44.json create mode 100644 website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1.json create mode 100644 website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/appendix/_category_.json create mode 100644 website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/_category_.json create mode 100644 website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/links.mdx create mode 100644 website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/_category_.json create mode 100644 website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/emailit.mdx create mode 100644 website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/encrypteasy.mdx create mode 100644 website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/filehound.mdx create mode 100644 website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/minecraftupdater.mdx create mode 100644 website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/modalfilemanager.mdx create mode 100644 website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/mollywallet.mdx create mode 100644 website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/october.mdx create mode 100644 website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/optimus.mdx create mode 100644 website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/portfall.mdx create mode 100644 website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/restic-browser.mdx create mode 100644 website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/riftshare.mdx create mode 100644 website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/scriptbar.mdx create mode 100644 website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/surge.mdx create mode 100644 website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/wally.mdx create mode 100644 website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/wombat.mdx create mode 100644 website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/ytd.mdx create mode 100644 website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/templates.mdx create mode 100644 website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/contributing/developing-new-features.mdx create mode 100644 website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/contributing/documenting.mdx create mode 100644 website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/contributing/fixing-bugs.mdx create mode 100644 website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/contributing/setting-up-a-dev-environment.mdx create mode 100644 website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/contributing/ways-of-contributing.mdx create mode 100644 website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/gettingstarted/_category_.json create mode 100644 website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/gettingstarted/building.mdx create mode 100644 website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/gettingstarted/development.mdx create mode 100644 website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/gettingstarted/firstproject.mdx create mode 100644 website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/gettingstarted/installation.mdx create mode 100644 website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/_category_.json create mode 100644 website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/application-development.mdx create mode 100644 website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/bleeding-edge.mdx create mode 100644 website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/dynamic-assets.mdx create mode 100644 website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/frameless.mdx create mode 100644 website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/frontend.mdx create mode 100644 website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/ides.mdx create mode 100644 website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/linux-distro-support.mdx create mode 100644 website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/linux.mdx create mode 100644 website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/manual-builds.mdx create mode 100644 website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/migrating.mdx create mode 100644 website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/mouse-buttons.mdx create mode 100644 website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/overscroll.mdx create mode 100644 website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/routing.mdx create mode 100644 website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/signing.mdx create mode 100644 website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/templates.mdx create mode 100644 website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/troubleshooting.mdx create mode 100644 website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/vscode.mdx create mode 100644 website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/windows-installer.mdx create mode 100644 website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/windows.mdx create mode 100644 website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/howdoesitwork.mdx create mode 100644 website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/introduction.mdx create mode 100644 website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/_category_.json create mode 100644 website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/cli.mdx create mode 100644 website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/menus.mdx create mode 100644 website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/options.mdx create mode 100644 website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/project-config.mdx create mode 100644 website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/_category_.json create mode 100644 website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/browser.mdx create mode 100644 website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/dialog.mdx create mode 100644 website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/events.mdx create mode 100644 website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/intro.mdx create mode 100644 website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/log.mdx create mode 100644 website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/menu.mdx create mode 100644 website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/window.mdx create mode 100644 website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/tutorials/_category_.json create mode 100644 website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/tutorials/dogsapi.mdx create mode 100644 website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/tutorials/helloworld.mdx create mode 100644 website/versioned_docs/version-v2.0.0-beta.44/appendix/_category_.json create mode 100644 website/versioned_docs/version-v2.0.0-beta.44/community/_category_.json create mode 100644 website/versioned_docs/version-v2.0.0-beta.44/community/links.mdx create mode 100644 website/versioned_docs/version-v2.0.0-beta.44/community/showcase/_category_.json create mode 100644 website/versioned_docs/version-v2.0.0-beta.44/community/showcase/emailit.mdx create mode 100644 website/versioned_docs/version-v2.0.0-beta.44/community/showcase/encrypteasy.mdx create mode 100644 website/versioned_docs/version-v2.0.0-beta.44/community/showcase/filehound.mdx create mode 100644 website/versioned_docs/version-v2.0.0-beta.44/community/showcase/modalfilemanager.mdx create mode 100644 website/versioned_docs/version-v2.0.0-beta.44/community/showcase/mollywallet.mdx create mode 100644 website/versioned_docs/version-v2.0.0-beta.44/community/showcase/october.mdx create mode 100644 website/versioned_docs/version-v2.0.0-beta.44/community/showcase/optimus.mdx create mode 100644 website/versioned_docs/version-v2.0.0-beta.44/community/showcase/portfall.mdx create mode 100644 website/versioned_docs/version-v2.0.0-beta.44/community/showcase/restic-browser.mdx create mode 100644 website/versioned_docs/version-v2.0.0-beta.44/community/showcase/riftshare.mdx create mode 100644 website/versioned_docs/version-v2.0.0-beta.44/community/showcase/scriptbar.mdx create mode 100644 website/versioned_docs/version-v2.0.0-beta.44/community/showcase/surge.mdx create mode 100644 website/versioned_docs/version-v2.0.0-beta.44/community/showcase/wally.mdx create mode 100644 website/versioned_docs/version-v2.0.0-beta.44/community/showcase/wombat.mdx create mode 100644 website/versioned_docs/version-v2.0.0-beta.44/community/showcase/ytd.mdx create mode 100644 website/versioned_docs/version-v2.0.0-beta.44/community/templates.mdx create mode 100644 website/versioned_docs/version-v2.0.0-beta.44/contributing/_category_.json create mode 100644 website/versioned_docs/version-v2.0.0-beta.44/contributing/developing-new-features.mdx create mode 100644 website/versioned_docs/version-v2.0.0-beta.44/contributing/documenting.mdx create mode 100644 website/versioned_docs/version-v2.0.0-beta.44/contributing/fixing-bugs.mdx create mode 100644 website/versioned_docs/version-v2.0.0-beta.44/contributing/helping-others.mdx create mode 100644 website/versioned_docs/version-v2.0.0-beta.44/contributing/setting-up-a-dev-environment.mdx create mode 100644 website/versioned_docs/version-v2.0.0-beta.44/contributing/testing.mdx create mode 100644 website/versioned_docs/version-v2.0.0-beta.44/contributing/ways-of-contributing.mdx create mode 100644 website/versioned_docs/version-v2.0.0-beta.44/gettingstarted/_category_.json create mode 100644 website/versioned_docs/version-v2.0.0-beta.44/gettingstarted/building.mdx create mode 100644 website/versioned_docs/version-v2.0.0-beta.44/gettingstarted/development.mdx create mode 100644 website/versioned_docs/version-v2.0.0-beta.44/gettingstarted/firstproject.mdx create mode 100644 website/versioned_docs/version-v2.0.0-beta.44/gettingstarted/installation.mdx create mode 100644 website/versioned_docs/version-v2.0.0-beta.44/guides/_category_.json create mode 100644 website/versioned_docs/version-v2.0.0-beta.44/guides/application-development.mdx create mode 100644 website/versioned_docs/version-v2.0.0-beta.44/guides/bleeding-edge.mdx create mode 100644 website/versioned_docs/version-v2.0.0-beta.44/guides/dynamic-assets.mdx create mode 100644 website/versioned_docs/version-v2.0.0-beta.44/guides/frameless.mdx create mode 100644 website/versioned_docs/version-v2.0.0-beta.44/guides/frontend.mdx create mode 100644 website/versioned_docs/version-v2.0.0-beta.44/guides/ides.mdx create mode 100644 website/versioned_docs/version-v2.0.0-beta.44/guides/linux-distro-support.mdx create mode 100644 website/versioned_docs/version-v2.0.0-beta.44/guides/linux.mdx create mode 100644 website/versioned_docs/version-v2.0.0-beta.44/guides/manual-builds.mdx create mode 100644 website/versioned_docs/version-v2.0.0-beta.44/guides/migrating.mdx create mode 100644 website/versioned_docs/version-v2.0.0-beta.44/guides/mouse-buttons.mdx create mode 100644 website/versioned_docs/version-v2.0.0-beta.44/guides/overscroll.mdx create mode 100644 website/versioned_docs/version-v2.0.0-beta.44/guides/routing.mdx create mode 100644 website/versioned_docs/version-v2.0.0-beta.44/guides/signing.mdx create mode 100644 website/versioned_docs/version-v2.0.0-beta.44/guides/templates.mdx create mode 100644 website/versioned_docs/version-v2.0.0-beta.44/guides/troubleshooting.mdx create mode 100644 website/versioned_docs/version-v2.0.0-beta.44/guides/windows-installer.mdx create mode 100644 website/versioned_docs/version-v2.0.0-beta.44/guides/windows.mdx create mode 100644 website/versioned_docs/version-v2.0.0-beta.44/howdoesitwork.mdx create mode 100644 website/versioned_docs/version-v2.0.0-beta.44/introduction.mdx create mode 100644 website/versioned_docs/version-v2.0.0-beta.44/reference/_category_.json create mode 100644 website/versioned_docs/version-v2.0.0-beta.44/reference/cli.mdx create mode 100644 website/versioned_docs/version-v2.0.0-beta.44/reference/menus.mdx create mode 100644 website/versioned_docs/version-v2.0.0-beta.44/reference/options.mdx create mode 100644 website/versioned_docs/version-v2.0.0-beta.44/reference/project-config.mdx create mode 100644 website/versioned_docs/version-v2.0.0-beta.44/reference/runtime/_category_.json create mode 100644 website/versioned_docs/version-v2.0.0-beta.44/reference/runtime/browser.mdx create mode 100644 website/versioned_docs/version-v2.0.0-beta.44/reference/runtime/dialog.mdx create mode 100644 website/versioned_docs/version-v2.0.0-beta.44/reference/runtime/events.mdx create mode 100644 website/versioned_docs/version-v2.0.0-beta.44/reference/runtime/intro.mdx create mode 100644 website/versioned_docs/version-v2.0.0-beta.44/reference/runtime/log.mdx create mode 100644 website/versioned_docs/version-v2.0.0-beta.44/reference/runtime/menu.mdx create mode 100644 website/versioned_docs/version-v2.0.0-beta.44/reference/runtime/window.mdx create mode 100644 website/versioned_docs/version-v2.0.0-beta.44/tutorials/_category_.json create mode 100644 website/versioned_docs/version-v2.0.0-beta.44/tutorials/helloworld.mdx create mode 100644 website/versioned_docs/version-v2.0.0-rc.1/appendix/_category_.json create mode 100644 website/versioned_docs/version-v2.0.0-rc.1/community/_category_.json create mode 100644 website/versioned_docs/version-v2.0.0-rc.1/community/links.mdx create mode 100644 website/versioned_docs/version-v2.0.0-rc.1/community/showcase/_category_.json create mode 100644 website/versioned_docs/version-v2.0.0-rc.1/community/showcase/emailit.mdx create mode 100644 website/versioned_docs/version-v2.0.0-rc.1/community/showcase/encrypteasy.mdx create mode 100644 website/versioned_docs/version-v2.0.0-rc.1/community/showcase/filehound.mdx create mode 100644 website/versioned_docs/version-v2.0.0-rc.1/community/showcase/minecraftupdater.mdx create mode 100644 website/versioned_docs/version-v2.0.0-rc.1/community/showcase/modalfilemanager.mdx create mode 100644 website/versioned_docs/version-v2.0.0-rc.1/community/showcase/mollywallet.mdx create mode 100644 website/versioned_docs/version-v2.0.0-rc.1/community/showcase/october.mdx create mode 100644 website/versioned_docs/version-v2.0.0-rc.1/community/showcase/optimus.mdx create mode 100644 website/versioned_docs/version-v2.0.0-rc.1/community/showcase/portfall.mdx create mode 100644 website/versioned_docs/version-v2.0.0-rc.1/community/showcase/restic-browser.mdx create mode 100644 website/versioned_docs/version-v2.0.0-rc.1/community/showcase/riftshare.mdx create mode 100644 website/versioned_docs/version-v2.0.0-rc.1/community/showcase/scriptbar.mdx create mode 100644 website/versioned_docs/version-v2.0.0-rc.1/community/showcase/surge.mdx create mode 100644 website/versioned_docs/version-v2.0.0-rc.1/community/showcase/wally.mdx create mode 100644 website/versioned_docs/version-v2.0.0-rc.1/community/showcase/wombat.mdx create mode 100644 website/versioned_docs/version-v2.0.0-rc.1/community/showcase/ytd.mdx create mode 100644 website/versioned_docs/version-v2.0.0-rc.1/community/templates.mdx create mode 100644 website/versioned_docs/version-v2.0.0-rc.1/gettingstarted/_category_.json create mode 100644 website/versioned_docs/version-v2.0.0-rc.1/gettingstarted/building.mdx create mode 100644 website/versioned_docs/version-v2.0.0-rc.1/gettingstarted/development.mdx create mode 100644 website/versioned_docs/version-v2.0.0-rc.1/gettingstarted/firstproject.mdx create mode 100644 website/versioned_docs/version-v2.0.0-rc.1/gettingstarted/installation.mdx create mode 100644 website/versioned_docs/version-v2.0.0-rc.1/guides/_category_.json create mode 100644 website/versioned_docs/version-v2.0.0-rc.1/guides/application-development.mdx create mode 100644 website/versioned_docs/version-v2.0.0-rc.1/guides/bleeding-edge.mdx create mode 100644 website/versioned_docs/version-v2.0.0-rc.1/guides/dynamic-assets.mdx create mode 100644 website/versioned_docs/version-v2.0.0-rc.1/guides/frameless.mdx create mode 100644 website/versioned_docs/version-v2.0.0-rc.1/guides/frontend.mdx create mode 100644 website/versioned_docs/version-v2.0.0-rc.1/guides/ides.mdx create mode 100644 website/versioned_docs/version-v2.0.0-rc.1/guides/linux-distro-support.mdx create mode 100644 website/versioned_docs/version-v2.0.0-rc.1/guides/linux.mdx create mode 100644 website/versioned_docs/version-v2.0.0-rc.1/guides/manual-builds.mdx create mode 100644 website/versioned_docs/version-v2.0.0-rc.1/guides/migrating.mdx create mode 100644 website/versioned_docs/version-v2.0.0-rc.1/guides/mouse-buttons.mdx create mode 100644 website/versioned_docs/version-v2.0.0-rc.1/guides/obfuscated.mdx create mode 100644 website/versioned_docs/version-v2.0.0-rc.1/guides/overscroll.mdx create mode 100644 website/versioned_docs/version-v2.0.0-rc.1/guides/routing.mdx create mode 100644 website/versioned_docs/version-v2.0.0-rc.1/guides/signing.mdx create mode 100644 website/versioned_docs/version-v2.0.0-rc.1/guides/templates.mdx create mode 100644 website/versioned_docs/version-v2.0.0-rc.1/guides/troubleshooting.mdx create mode 100644 website/versioned_docs/version-v2.0.0-rc.1/guides/vscode.mdx create mode 100644 website/versioned_docs/version-v2.0.0-rc.1/guides/windows-installer.mdx create mode 100644 website/versioned_docs/version-v2.0.0-rc.1/guides/windows.mdx create mode 100644 website/versioned_docs/version-v2.0.0-rc.1/howdoesitwork.mdx create mode 100644 website/versioned_docs/version-v2.0.0-rc.1/introduction.mdx create mode 100644 website/versioned_docs/version-v2.0.0-rc.1/reference/_category_.json create mode 100644 website/versioned_docs/version-v2.0.0-rc.1/reference/cli.mdx create mode 100644 website/versioned_docs/version-v2.0.0-rc.1/reference/menus.mdx create mode 100644 website/versioned_docs/version-v2.0.0-rc.1/reference/options.mdx create mode 100644 website/versioned_docs/version-v2.0.0-rc.1/reference/project-config.mdx create mode 100644 website/versioned_docs/version-v2.0.0-rc.1/reference/runtime/_category_.json create mode 100644 website/versioned_docs/version-v2.0.0-rc.1/reference/runtime/browser.mdx create mode 100644 website/versioned_docs/version-v2.0.0-rc.1/reference/runtime/dialog.mdx create mode 100644 website/versioned_docs/version-v2.0.0-rc.1/reference/runtime/events.mdx create mode 100644 website/versioned_docs/version-v2.0.0-rc.1/reference/runtime/intro.mdx create mode 100644 website/versioned_docs/version-v2.0.0-rc.1/reference/runtime/log.mdx create mode 100644 website/versioned_docs/version-v2.0.0-rc.1/reference/runtime/menu.mdx create mode 100644 website/versioned_docs/version-v2.0.0-rc.1/reference/runtime/window.mdx create mode 100644 website/versioned_docs/version-v2.0.0-rc.1/tutorials/_category_.json create mode 100644 website/versioned_docs/version-v2.0.0-rc.1/tutorials/dogsapi.mdx create mode 100644 website/versioned_docs/version-v2.0.0-rc.1/tutorials/helloworld.mdx create mode 100644 website/versioned_sidebars/version-v2.0.0-beta.44-sidebars.json create mode 100644 website/versioned_sidebars/version-v2.0.0-rc.1-sidebars.json diff --git a/website/.prettierrc b/website/.prettierrc new file mode 100644 index 000000000..9c1c6d2d4 --- /dev/null +++ b/website/.prettierrc @@ -0,0 +1,22 @@ +{ + "arrowParens": "always", + "bracketSpacing": true, + "endOfLine": "lf", + "htmlWhitespaceSensitivity": "css", + "insertPragma": false, + "singleAttributePerLine": false, + "bracketSameLine": false, + "jsxBracketSameLine": false, + "jsxSingleQuote": false, + "printWidth": 80, + "proseWrap": "preserve", + "quoteProps": "as-needed", + "requirePragma": false, + "semi": true, + "singleQuote": false, + "tabWidth": 2, + "trailingComma": "es5", + "useTabs": false, + "vueIndentScriptAndStyle": false, + "parser": "mdx" +} diff --git a/website/i18n/en/docusaurus-plugin-content-docs/version-v2.0.0-beta.44.json b/website/i18n/en/docusaurus-plugin-content-docs/version-v2.0.0-beta.44.json new file mode 100644 index 000000000..b6f38500b --- /dev/null +++ b/website/i18n/en/docusaurus-plugin-content-docs/version-v2.0.0-beta.44.json @@ -0,0 +1,38 @@ +{ + "version.label": { + "message": "v2.0.0-beta.44", + "description": "The label for version v2.0.0-beta.44" + }, + "sidebar.tutorialSidebar.category.Getting Started": { + "message": "Getting Started", + "description": "The label for category Getting Started in sidebar tutorialSidebar" + }, + "sidebar.tutorialSidebar.category.Reference": { + "message": "Reference", + "description": "The label for category Reference in sidebar tutorialSidebar" + }, + "sidebar.tutorialSidebar.category.Runtime": { + "message": "Runtime", + "description": "The label for category Runtime in sidebar tutorialSidebar" + }, + "sidebar.tutorialSidebar.category.Community": { + "message": "Community", + "description": "The label for category Community in sidebar tutorialSidebar" + }, + "sidebar.tutorialSidebar.category.Showcase": { + "message": "Showcase", + "description": "The label for category Showcase in sidebar tutorialSidebar" + }, + "sidebar.tutorialSidebar.category.Guides": { + "message": "Guides", + "description": "The label for category Guides in sidebar tutorialSidebar" + }, + "sidebar.tutorialSidebar.category.Tutorials": { + "message": "Tutorials", + "description": "The label for category Tutorials in sidebar tutorialSidebar" + }, + "sidebar.tutorialSidebar.category.Contributing": { + "message": "Contributing", + "description": "The label for category Contributing in sidebar tutorialSidebar" + } +} diff --git a/website/i18n/en/docusaurus-plugin-content-docs/version-v2.0.0-rc.1.json b/website/i18n/en/docusaurus-plugin-content-docs/version-v2.0.0-rc.1.json new file mode 100644 index 000000000..49cf4687e --- /dev/null +++ b/website/i18n/en/docusaurus-plugin-content-docs/version-v2.0.0-rc.1.json @@ -0,0 +1,38 @@ +{ + "version.label": { + "message": "v2.0.0-rc.1", + "description": "The label for version v2.0.0-rc.1" + }, + "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" + } +} diff --git a/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-beta.44.json b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-beta.44.json new file mode 100644 index 000000000..b6f38500b --- /dev/null +++ b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-beta.44.json @@ -0,0 +1,38 @@ +{ + "version.label": { + "message": "v2.0.0-beta.44", + "description": "The label for version v2.0.0-beta.44" + }, + "sidebar.tutorialSidebar.category.Getting Started": { + "message": "Getting Started", + "description": "The label for category Getting Started in sidebar tutorialSidebar" + }, + "sidebar.tutorialSidebar.category.Reference": { + "message": "Reference", + "description": "The label for category Reference in sidebar tutorialSidebar" + }, + "sidebar.tutorialSidebar.category.Runtime": { + "message": "Runtime", + "description": "The label for category Runtime in sidebar tutorialSidebar" + }, + "sidebar.tutorialSidebar.category.Community": { + "message": "Community", + "description": "The label for category Community in sidebar tutorialSidebar" + }, + "sidebar.tutorialSidebar.category.Showcase": { + "message": "Showcase", + "description": "The label for category Showcase in sidebar tutorialSidebar" + }, + "sidebar.tutorialSidebar.category.Guides": { + "message": "Guides", + "description": "The label for category Guides in sidebar tutorialSidebar" + }, + "sidebar.tutorialSidebar.category.Tutorials": { + "message": "Tutorials", + "description": "The label for category Tutorials in sidebar tutorialSidebar" + }, + "sidebar.tutorialSidebar.category.Contributing": { + "message": "Contributing", + "description": "The label for category Contributing in sidebar tutorialSidebar" + } +} diff --git a/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1.json b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1.json new file mode 100644 index 000000000..49cf4687e --- /dev/null +++ b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1.json @@ -0,0 +1,38 @@ +{ + "version.label": { + "message": "v2.0.0-rc.1", + "description": "The label for version v2.0.0-rc.1" + }, + "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" + } +} diff --git a/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/appendix/_category_.json b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/appendix/_category_.json new file mode 100644 index 000000000..83af4ca28 --- /dev/null +++ b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/appendix/_category_.json @@ -0,0 +1,4 @@ +{ + "label": "Appendix", + "position": 70 +} diff --git a/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/_category_.json b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/_category_.json new file mode 100644 index 000000000..524986e1e --- /dev/null +++ b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/_category_.json @@ -0,0 +1,4 @@ +{ + "label": "Community", + "position": 50 +} diff --git a/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/links.mdx b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/links.mdx new file mode 100644 index 000000000..4a3a89e87 --- /dev/null +++ b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/links.mdx @@ -0,0 +1,23 @@ +--- +sidebar_position: 2 +--- + +# Links + +This page serves as a list for community related links. Please submit a PR (click `Edit this page` at the bottom) to submit links. + +## Awesome Wails + +The [definitive list](https://github.com/wailsapp/awesome-wails) of links related to Wails. + +## Support Channels + +- [Gophers Slack Channel](https://gophers.slack.com/messages/CJ4P9F7MZ/) +- [Gophers Slack Channel Invite](https://invite.slack.golangbridge.org/) +- [Github Issues](https://github.com/wailsapp/wails/issues) +- [v2 Beta Discussion Board](https://github.com/wailsapp/wails/discussions/828) + +## Social Media + +- [Twitter](https://twitter.com/wailsapp) +- [Wails Chinese Community QQ Group](https://qm.qq.com/cgi-bin/qm/qr?k=PmIURne5hFGNd7QWzW5qd6FV-INEjNJv&jump_from=webapi) - Group number: 1067173054 diff --git a/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/_category_.json b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/_category_.json new file mode 100644 index 000000000..276e283b7 --- /dev/null +++ b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/_category_.json @@ -0,0 +1,4 @@ +{ + "label": "Showcase", + "position": 1 +} diff --git a/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/emailit.mdx b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/emailit.mdx new file mode 100644 index 000000000..4a1ebe835 --- /dev/null +++ b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/emailit.mdx @@ -0,0 +1,8 @@ +# EmailIt + +

+ +
+

+ +[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 builtin [Node-Red](https://nodered.org/) server, scripts terminal, and the [ScriptBar](https://github.com/raguay/ScriptBarApp) program for displaying results from Node-Red or a script on your system. Documentation is very scarce, but the programs works. It’s built using Wails2 and Svelte, and the download is a universal macOS application. diff --git a/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/encrypteasy.mdx b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/encrypteasy.mdx new file mode 100644 index 000000000..13c2d8345 --- /dev/null +++ b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/encrypteasy.mdx @@ -0,0 +1,10 @@ +# EncryptEasy + +

+ +
+

+ +**[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. diff --git a/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/filehound.mdx b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/filehound.mdx new file mode 100644 index 000000000..78cbfca86 --- /dev/null +++ b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/filehound.mdx @@ -0,0 +1,14 @@ +# FileHound Export Utility + +

+ +
+

+ +[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 diff --git a/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/minecraftupdater.mdx b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/minecraftupdater.mdx new file mode 100644 index 000000000..11247339d --- /dev/null +++ b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/minecraftupdater.mdx @@ -0,0 +1,10 @@ +# Minecraft Updater + +

+ +
+

+ +[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. diff --git a/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/modalfilemanager.mdx b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/modalfilemanager.mdx new file mode 100644 index 000000000..a7ae8c492 --- /dev/null +++ b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/modalfilemanager.mdx @@ -0,0 +1,12 @@ +# Modal File Manager + +

+ +
+

+ +[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. 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. diff --git a/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/mollywallet.mdx b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/mollywallet.mdx new file mode 100644 index 000000000..534b097ca --- /dev/null +++ b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/mollywallet.mdx @@ -0,0 +1,8 @@ +# Molley Wallet + +

+ +
+

+ +[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. diff --git a/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/october.mdx b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/october.mdx new file mode 100644 index 000000000..889d2dd9e --- /dev/null +++ b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/october.mdx @@ -0,0 +1,12 @@ +# October + +

+ +
+

+ +[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. diff --git a/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/optimus.mdx b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/optimus.mdx new file mode 100644 index 000000000..c3eb79507 --- /dev/null +++ b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/optimus.mdx @@ -0,0 +1,8 @@ +# Optimus + +

+ +
+

+ +[Optimus](https://github.com/splode/optimus) is a desktop image optimization application. It supports conversion and compression between WebP, JPEG, and PNG image formats. diff --git a/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/portfall.mdx b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/portfall.mdx new file mode 100644 index 000000000..4cc2c63c9 --- /dev/null +++ b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/portfall.mdx @@ -0,0 +1,8 @@ +# Portfall + +

+ +
+

+ +[Portfall](https://github.com/rekon-oss/portfall) - A desktop k8s port-forwarding portal for easy access to all your cluster UIs diff --git a/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/restic-browser.mdx b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/restic-browser.mdx new file mode 100644 index 000000000..1505ce07a --- /dev/null +++ b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/restic-browser.mdx @@ -0,0 +1,10 @@ +# Restic Browser + +

+ +
+

+ +[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. diff --git a/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/riftshare.mdx b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/riftshare.mdx new file mode 100644 index 000000000..5223e88cf --- /dev/null +++ b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/riftshare.mdx @@ -0,0 +1,19 @@ +# RiftShare + +

+ +
+

+ +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! diff --git a/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/scriptbar.mdx b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/scriptbar.mdx new file mode 100644 index 000000000..aaa556f92 --- /dev/null +++ b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/scriptbar.mdx @@ -0,0 +1,8 @@ +# ScriptBar + +

+ +
+

+ +[ScriptBar](https://GitHub.com/raguay/ScriptBarApp) is a program to show the output of the embedded [Node-Red](https://nodered.org) server in the [EmailIt](https://GitHub.com/raguay/EmailIt) application. 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. diff --git a/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/surge.mdx b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/surge.mdx new file mode 100644 index 000000000..2d895dc29 --- /dev/null +++ b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/surge.mdx @@ -0,0 +1,8 @@ +# Surge + +

+ +
+

+ +[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. diff --git a/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/wally.mdx b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/wally.mdx new file mode 100644 index 000000000..2a2498f40 --- /dev/null +++ b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/wally.mdx @@ -0,0 +1,8 @@ +# Wally + +

+ +
+

+ +[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. diff --git a/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/wombat.mdx b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/wombat.mdx new file mode 100644 index 000000000..54cedacea --- /dev/null +++ b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/wombat.mdx @@ -0,0 +1,8 @@ +# Wombat + +

+ +
+

+ +[Wombat](https://github.com/rogchap/wombat) is a cross platform gRPC client. diff --git a/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/ytd.mdx b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/ytd.mdx new file mode 100644 index 000000000..178ff0529 --- /dev/null +++ b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/ytd.mdx @@ -0,0 +1,8 @@ +# Ytd + +

+ +
+

+ +[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. diff --git a/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/templates.mdx b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/templates.mdx new file mode 100644 index 000000000..d9a29a6fa --- /dev/null +++ b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/templates.mdx @@ -0,0 +1,52 @@ +--- +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) - A template using Vite,Vue and Vue-Router(Support both JavaScript and TypeScript) +- [wails-vite-vue-ts](https://github.com/codydbentley/wails-vite-vue-ts) - Vue 3 TypeScript with Vite (and instructions to add features) +- [wails-vite-vue-the-works](https://github.com/codydbentley/wails-vite-vue-the-works) - Vue 3 TypeScript with Vite, Vuex, Vue Router, Sass, and ESLint + Prettier + +## Angular + +- [wails-angular-template](https://github.com/TAINCER/wails-angular-template) - Angular with TypeScript, Sass, Hot-Reload, Code-Splitting and i18n + +## React + +- [wails-react-template](https://github.com/AlienRecall/wails-react-template) - A template using reactjs +- [wails-react-template](https://github.com/flin7/wails-react-template) - A minimal template for React that supports live development +- [wails-template-nextjs](https://github.com/LGiki/wails-template-nextjs) - A template using Next.js and TypeScript + +## Svelte + +- [wails-svelte-template](https://github.com/raitonoberu/wails-svelte-template) - A template using Svelte +- [wails-vite-svelte-template](https://github.com/BillBuilt/wails-vite-svelte-template) - A template using Svelte and Vite +- [wails-vite-svelte-tailwind-template](https://github.com/BillBuilt/wails-vite-svelte-tailwind-template) - A template using Svelte and Vite with TailwindCSS v3 +- [wails-sveltekit-template](https://github.com/h8gi/wails-sveltekit-template) - A template using SvelteKit + +## 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: + +## 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 \ No newline at end of file diff --git a/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/gettingstarted/_category_.json b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/gettingstarted/_category_.json new file mode 100644 index 000000000..597b920df --- /dev/null +++ b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/gettingstarted/_category_.json @@ -0,0 +1,4 @@ +{ + "label": "Getting Started", + "position": 10 +} diff --git a/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/gettingstarted/building.mdx b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/gettingstarted/building.mdx new file mode 100644 index 000000000..3e0df3b68 --- /dev/null +++ b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/gettingstarted/building.mdx @@ -0,0 +1,21 @@ +--- +sidebar_position: 6 +--- + +# Compiling your Project + +From the project directory, run `wails build`. This will compile your project and save the production-ready binary in the `build/bin` directory. + +If you run the binary, you should see the default application: + +
+ +
+ +
+ +For more details on compilation options, please refer to the [CLI Reference](../reference/cli.mdx#build). diff --git a/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/gettingstarted/development.mdx b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/gettingstarted/development.mdx new file mode 100644 index 000000000..54dda5faa --- /dev/null +++ b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/gettingstarted/development.mdx @@ -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 diff --git a/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/gettingstarted/firstproject.mdx b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/gettingstarted/firstproject.mdx new file mode 100644 index 000000000..86036d24b --- /dev/null +++ b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/gettingstarted/firstproject.mdx @@ -0,0 +1,130 @@ +--- +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: + + + +import Tabs from "@theme/Tabs"; +import TabItem from "@theme/TabItem"; + + + + Generate a Svelte project using Javascript with:

+ + wails init -n myproject -t svelte +If you would rather use Typescript:
+ + wails init -n myproject -t svelte-ts + + + + Generate a React project using Javascript with:

+ + wails init -n myproject -t react +If you would rather use Typescript:
+ + wails init -n myproject -t react-ts + + + + Vue用のJavascriptプロジェクトを生成する場合:

+ + wails init -n myproject -t vue + +Typescriptプロジェクトを生成する場合:
+ + wails init -n myproject -t vue-ts + + + + Preact用のJavascriptプロジェクトを生成する場合:

+ + wails init -n myproject -t preact + +Typescriptプロジェクトを生成する場合:
+ + wails init -n myproject -t preact-ts + + + + Lit用のJavascriptプロジェクトを生成する場合:

+ + wails init -n myproject -t lit + +Typescriptプロジェクトを生成する場合:
+ + wails init -n myproject -t lit-ts + + + + Vanilla用のJavascriptプロジェクトを生成する場合:

+ + wails init -n myproject -t vanilla + +Typescriptプロジェクトを生成する場合:
+ + wails init -n myproject -t vanilla-ts + + + + + + +
+ +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. + +The default module name in `go.mod` is "changeme". You should change this to something more appropriate. diff --git a/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/gettingstarted/installation.mdx b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/gettingstarted/installation.mdx new file mode 100644 index 000000000..bfadb7275 --- /dev/null +++ b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/gettingstarted/installation.mdx @@ -0,0 +1,90 @@ +--- +sidebar_position: 1 +--- + +# Installation + +## Supported Platforms + +- Windows 10/11 AMD64/ARM64 +- MacOS 10.13+ AMD64 +- MacOS 11.0+ ARM64 +- Linux AMD64/ARM64 + +## Dependencies + +Wails has a number of common dependencies that are required before installation: + +- Go 1.17+ +- NPM (Node 15+) + +### Go + +Download Go from the [Go Downloads Page](https://go.dev/doc/install). + +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: + + + +import Tabs from "@theme/Tabs"; +import TabItem from "@theme/TabItem"; + + + + Wailsを使用するには、xcodeコマンドラインツールがインストールされている必要があります。 This can be done by running:
+ xcode-select --install + + + Wails requires that the WebView2{" "} + runtime is installed. Some Windows installations will already have this installed. You can check using + the{" "} + wails doctor command (see below). + + + 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. + + + + + +## Optional Dependencies + +- [UPX](https://upx.github.io/) for compressing your applications. + +## Installing Wails + +Run `go install github.com/wailsapp/wails/v2/cmd/wails@latest` to install the Wails CLI. + +## System Check + +Running `wails doctor` will check if you have the correct dependencies installed. If not, it will advise on what is missing and help on how to rectify any problems. + +## 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. diff --git a/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/_category_.json b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/_category_.json new file mode 100644 index 000000000..5935dad93 --- /dev/null +++ b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/_category_.json @@ -0,0 +1,4 @@ +{ + "label": "Guides", + "position": 50 +} diff --git a/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/application-development.mdx b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/application-development.mdx new file mode 100644 index 000000000..a618076f1 --- /dev/null +++ b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/application-development.mdx @@ -0,0 +1,194 @@ +# 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) + } +} +``` + +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 specifiy `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/). For [create-react-app](https://create-react-app.dev/), it's possible to use [this script](https://gist.github.com/int128/e0cdec598c5b3db728ff35758abdbafd) to achieve a similar result. + +## Go Module + +The default Wails templates generate a `go.mod` file that contains the module name "changeme". You should change this to something more appropriate after project generation. diff --git a/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/bleeding-edge.mdx b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/bleeding-edge.mdx new file mode 100644 index 000000000..b81cc79dc --- /dev/null +++ b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/bleeding-edge.mdx @@ -0,0 +1,55 @@ +# Bleeding Edge + +## Overview + +Wails is in constant development and new releases are regularly "tagged". This usually happens when all the newer code on `master` has been tested and confirmed working. If you need a bugfix or feature that has not yet made it to a release, it's possible to use the latest "bleeding edge" version using the following steps: + +- `git clone https://github.com/wailsapp/wails` +- `cd wails/v2/cmd/wails` +- `go install` + +NOTE: The directory that you cloned the project into will now be called "clonedir". + +The Wails CLI will now be at the very latest version. + +### 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 => ` + +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. diff --git a/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/dynamic-assets.mdx b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/dynamic-assets.mdx new file mode 100644 index 000000000..77ad6d09e --- /dev/null +++ b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/dynamic-assets.mdx @@ -0,0 +1,126 @@ +# 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: 255}, + 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: + +

+ +

+ +However, if we request `go.mod`, we will see the following output: + +

+ +

+ +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 + +``` + +with: + +```html + +``` + +Then we would see the following: + +

+ +

+ +:::warning +Exposing your filesystem in this way is a security risk. It is recommended that you properly manage access +to your filesystem. +::: diff --git a/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/frameless.mdx b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/frameless.mdx new file mode 100644 index 000000000..c7ca5f6c3 --- /dev/null +++ b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/frameless.mdx @@ -0,0 +1,84 @@ +# 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 + + + + + + + +
+ + +
+
+ + + + +``` + +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" +) + +//go:embed 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, + Assets: assets, + Frameless: true, + CSSDragProperty: "widows", + CSSDragValue: "1", + Bind: []interface{}{ + app, + }, + }) + + if err != nil { + println("Error:", err) + } +} +``` + +```html title=index.html + + + + + + alwaysontop + + +
+ + + + +``` + +:::info Fullscreen + If you allow your application to go fullscreen, this drag functionality will be disabled. +::: diff --git a/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/frontend.mdx b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/frontend.mdx new file mode 100644 index 000000000..4b192c557 --- /dev/null +++ b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/frontend.mdx @@ -0,0 +1,75 @@ +# Frontend + +## Script Injection + +When Wails serves your `index.html`, by default, it will inject 2 script entries into the `` 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 + + + injection example + + + + + + + +
Please enter your name below 👇
+
+ + +
+ + + + + +``` + +### Overriding Default Script Injection + +To provide more flexibility to developers, there is a meta tag that may be used to customise this behaviour: + +```html + +``` + +The options are as follows: + +| Value | Description | +| ------------------- | ------------------------------------------------ | +| noautoinjectruntime | Disable the autoinjection of `/wails/runtime.js` | +| noautoinjectipc | Disable the autoinjection of `/wails/ipc.js` | +| noautoinject | Disable all autoinjection of scripts | + +Multiple options may be used provided they are comma seperated. + +This code is perfectly valid and operates the same as the autoinjection version: + +```html + + + + injection example + + + + + + +
Please enter your name below 👇
+
+ + +
+ + + + + + + +``` diff --git a/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/ides.mdx b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/ides.mdx new file mode 100644 index 000000000..a20ae4131 --- /dev/null +++ b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/ides.mdx @@ -0,0 +1,113 @@ +# IDEs + +Wails aims to provide a great development experience. To that aim, we now support generating IDE specific configuration to provide smoother project setup. + +Currently, we support [Visual Studio Code](https://code.visualstudio.com/) but aim to support other IDEs such as Goland. + +## Visual Studio Code + +

+ +

+ +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. + +::: diff --git a/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/linux-distro-support.mdx b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/linux-distro-support.mdx new file mode 100644 index 000000000..28a224a26 --- /dev/null +++ b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/linux-distro-support.mdx @@ -0,0 +1,101 @@ +# 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 `.go`, where `` 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! +::: diff --git a/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/linux.mdx b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/linux.mdx new file mode 100644 index 000000000..229c282bf --- /dev/null +++ b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/linux.mdx @@ -0,0 +1,18 @@ +# 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) diff --git a/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/manual-builds.mdx b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/manual-builds.mdx new file mode 100644 index 000000000..dcf192d33 --- /dev/null +++ b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/manual-builds.mdx @@ -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/.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. diff --git a/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/migrating.mdx b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/migrating.mdx new file mode 100644 index 000000000..c3b920e05 --- /dev/null +++ b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/migrating.mdx @@ -0,0 +1,187 @@ +# 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, + 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 the 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 frontend/dist +var assets embed.FS + +func main() { + err := wails.Run(&options.App{ + /* Other Options */ + Assets: assets, + }) +} +``` + +Of course, bundlers can be used if you wish to. The only requirement is to pass the final application assets directory to Wails using an `embed.FS` in the `Assets` key of the [application options](../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: + +

+ +| 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.0.0-rc.1/guides/mouse-buttons.mdx b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/mouse-buttons.mdx new file mode 100644 index 000000000..49e9cd69c --- /dev/null +++ b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/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.0.0-rc.1/guides/overscroll.mdx b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/overscroll.mdx new file mode 100644 index 000000000..dca7e83a3 --- /dev/null +++ b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/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.0.0-rc.1/guides/routing.mdx b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/routing.mdx new file mode 100644 index 000000000..5a47814cc --- /dev/null +++ b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/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( + + {/* The rest of your app goes here */} + + } exact /> + } /> + } /> + {/* more... */} + + , + root +); +``` diff --git a/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/signing.mdx b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/signing.mdx new file mode 100644 index 000000000..3e56f06c1 --- /dev/null +++ b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/signing.mdx @@ -0,0 +1,375 @@ +# 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. + +- 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/* + - 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. Now you need to make two action secrets on GitHub. 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 /t /f certificate\certificate.pfx /p '${{ secrets.WIN_SIGNING_CERT_PASSWORD }}' + +``` + +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@v2 + - 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@v2 + - 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/mitchellh/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 mitchellh/gon/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": "@env:APPLE_PASSWORD" + }, + "sign" :{ + "application_identity" : "Developer ID Application: My Name" + } + } +``` + +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 +``` + +2. entitlements.plist: + +```plist + + + + + com.apple.security.app-sandbox + + com.apple.security.network.client + + com.apple.security.network.server + + com.apple.security.files.user-selected.read-write + + com.apple.security.files.downloads.read-write + + + +``` + +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 + + + CFBundlePackageTypeAPPL + CFBundleNameMyApp + CFBundleExecutableapp + CFBundleIdentifierapp.myapp + CFBundleVersion0.1.0 + CFBundleGetInfoStringMy app is cool and nice and chill and + CFBundleShortVersionString0.1.0 + CFBundleIconFileiconfile + LSMinimumSystemVersion10.13.0 + NSHighResolutionCapabletrue + LSApplicationCategoryTypepublic.app-category.utilities + NSHumanReadableCopyright© Me + +``` + +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@v2 + - 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 mitchellh/gon/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. + - 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 mitchellh/gon/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. +``` + +# 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). diff --git a/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/templates.mdx b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/templates.mdx new file mode 100644 index 000000000..df75cbbc7 --- /dev/null +++ b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/templates.mdx @@ -0,0 +1,95 @@ +# Templates + +Wails generates projects from pre-created templates. In v1, this was a difficult to maintain set of projects that were subject to going out of date. In v2, to empower the community, a couple of new features have been added for templates: + +- Ability to generate projects from [Remote Templates](../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: + +
+ +
+ +## 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 diff --git a/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/troubleshooting.mdx b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/troubleshooting.mdx new file mode 100644 index 000000000..b6a73efa5 --- /dev/null +++ b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/troubleshooting.mdx @@ -0,0 +1,137 @@ +# 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 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 +NSAppTransportSecurity + + NSAllowsLocalNetworking + + +``` + +Reference: https://github.com/wailsapp/wails/issues/1504#issuecomment-1174317433 + +## Mac application not valid + +If your built application looks like this in finder: + +

+ +

+ +it's likely that your application's `info.plist` is invalid. Update the file in `build/.app/Contents/info.plist` and check if the data is valid, EG check the binary name is correct. To persist the changes, copy the file back to the `build/darwin` directory. + +## Cannot call backend method from frontend with variadic arguments + +If you have a backend method defined with variadic parameters, eg: + +```go +func (a *App) TestFunc(msg string, args ...interface{}) error { + // Code +} +``` + +calling this method from the frontend like this will fail: + +```js +var msg = "Hello: " +var args = ["Go", "JS"] +window.go.main.App.TestFunc(msg, ...args).then((result) => { + //do things here +}).catch((error) => { + //handle error +}); +``` + +Workaround: + +```js +var msg = "Hello " +var args = ["Go", "JS"] +window.go.main.App.TestFunc(msg, args).then((result) => { //without the 3 dots + //do things here +}).catch((error) => { + //handle error +}); +``` + +Credit: https://github.com/wailsapp/wails/issues/1186 + +## I'm having getting proxy errors when trying to install Wails + +If you are getting errors like this: + +``` +"https://proxy.golang.org/github.com/wailsapp/wails/cmd/wails/@v/list": dial tcp 172.217.163.49:443: connectex: A connection attempt failed because the connected party did not properly respond after a period of time, or established connection failed because connected host has failed to respond. +``` + +it's probably because the official Go Proxy is being blocked (Users in China have reported this). The solution is to set up the proxy manually, eg: + +``` +go env -w GO111MODULE=on +go env -w GOPROXY=https://goproxy.cn,direct +``` + +Source: https://github.com/wailsapp/wails/issues/1233 + +## 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 `` section of any new page you navigate to: + +```html + + + + +``` + +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. + +Source: https://github.com/wailsapp/wails/issues/1806 \ No newline at end of file diff --git a/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/vscode.mdx b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/vscode.mdx new file mode 100644 index 000000000..ed258656d --- /dev/null +++ b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/vscode.mdx @@ -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. diff --git a/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/windows-installer.mdx b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/windows-installer.mdx new file mode 100644 index 000000000..249ec5527 --- /dev/null +++ b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/windows-installer.mdx @@ -0,0 +1,56 @@ +# NSIS installer + +

+ +
+

+ +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. + +If you use the chocolatey package manager, run the following script: + +``` +choco install nsis +``` + +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. diff --git a/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/windows.mdx b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/windows.mdx new file mode 100644 index 000000000..821808c0b --- /dev/null +++ b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/windows.mdx @@ -0,0 +1,61 @@ +# 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. + +## 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). diff --git a/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/howdoesitwork.mdx b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/howdoesitwork.mdx new file mode 100644 index 000000000..95db08724 --- /dev/null +++ b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/howdoesitwork.mdx @@ -0,0 +1,356 @@ +--- +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. + +
+ +
+ +## The Main Application + +### Overview + +The main application consists of a single call to `wails.Run()`. It accepts the application configuration which describes the size of the application window, the window title, what assets to use, etc. A basic application might look like this: + +```go title="main.go" +package main + +import ( + "embed" + "log" + + "github.com/wailsapp/wails/v2" + "github.com/wailsapp/wails/v2/pkg/options" +) + +//go:embed frontend/dist +var assets embed.FS + +func main() { + + app := &App{} + + err := wails.Run(&options.App{ + Title: "Basic Demo", + Width: 1024, + Height: 768, + Assets: &assets, + OnStartup: app.startup, + OnShutdown: app.shutdown, + Bind: []interface{}{ + app, + }, + }) + if err != nil { + log.Fatal(err) + } +} + + +type App struct { + ctx context.Context +} + +func (b *App) startup(ctx context.Context) { + b.ctx = ctx +} + +func (b *App) shutdown(ctx context.Context) {} + +func (b *App) Greet(name string) string { + return fmt.Sprintf("Hello %s!", name) +} +``` + +### Options rundown + +This example has the following options set: + +- `Title` - The text that should appear in the window's title bar +- `Width` & `Height` - The dimensions of the window +- `Assets` - The application's frontend assets +- `OnStartup` - A callback for when the window is created and is about to start loading the frontend assets +- `OnShutdown` - A callback for when the application is about to quit +- `Bind` - A slice of struct instances that we wish to expose to the frontend + +A full list of application options can be found in the [Options Reference](reference/options). + +#### Assets + +The `Assets` option is mandatory as you can't have a Wails application without frontend assets. Those assets can be any files you would expect to find in a web application - html, js, css, svg, png, etc. **There is no requirement to generate asset bundles** - plain files will do. When the application starts, it will attempt to load `index.html` from your assets and the frontend will essentially work as a browser from that point on. It is worth noting that there is no requirement on where in the `embed.FS` the files live. It is likely that the embed path uses a nested directory relative to your main application code, such as `frontend/dist`: + +```go title="main.go" +//go:embed frontend/dist +var assets embed.FS +``` + +At startup, Wails will iterate the embedded files looking for the directory containing `index.html`. All other assets will be loaded relative to this directory. + +As production binaries use the files contained in `embed.FS`, there are no external files required to be shipped with the application. + +When running in development mode using the `wails dev` command, the assets are loaded off disk, and any changes result in a "live reload". The location of the assets will be inferred from the `embed.FS`. + +More details can be found in the [Application Development Guide](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で構造体を正しくバインドするためには、構造体の*インスタンス*をオプションで指定してください。 + +::: + +In this example, we create a new `App` instance and then add this instance to the `Bind` option in `wails.Run`: + +```go {16,24} title="main.go" +package main + +import ( + "embed" + "log" + + "github.com/wailsapp/wails/v2" + "github.com/wailsapp/wails/v2/pkg/options" +) + +//go:embed frontend/dist +var assets embed.FS + +func main() { + + app := &App{} + + err := wails.Run(&options.App{ + Title: "Basic Demo", + Width: 1024, + Height: 768, + Assets: &assets, + 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 {8-10} + //... + err := wails.Run(&options.App{ + Title: "Basic Demo", + Width: 1024, + Height: 768, + Assets: &assets, + Bind: []interface{}{ + app, + &mystruct1{}, + &mystruct2{}, + }, + }) + +``` + +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) => { + // resultを使って何かする + }) + } +``` + +The Typescript declaration file gives you the correct types for the bound methods: + +```ts +export function Greet(arg1:string):Promise; +``` + +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. Note: If you wish to use structs, you **must** define `json` struct tags for your fields! + +:::info Note +Anonymous nested structs are not supported at this time. +::: + +It is 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; +``` + +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) { + 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). + +[^1]: There is a very small subset of libraries that use features unsupported in WebViews. There are often alternatives and workarounds for such cases. diff --git a/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/introduction.mdx b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/introduction.mdx new file mode 100644 index 000000000..ab616d0a6 --- /dev/null +++ b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/introduction.mdx @@ -0,0 +1,71 @@ +--- +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://vite.net/) +- Powerful CLI to easily Create, Build and Package applications +- A rich [runtime library](/docs/next/reference/runtime) +- Applications built with Wails are Apple & Microsoft Store compliant + + +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. + +

+ + + +

+ +### 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 is resource efficient. Instead, it uses the native rendering engine for the platform. On Windows, this is the new Microsoft Webview2 library, built on Chromium. + +### Go & Javascript Interoperability + +Wails automatically makes your Go methods available to Javascript, so you can call them by name from your frontend! It even generates Typescript 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! diff --git a/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/_category_.json b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/_category_.json new file mode 100644 index 000000000..ebb337b83 --- /dev/null +++ b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/_category_.json @@ -0,0 +1,4 @@ +{ + "label": "Reference", + "position": 40 +} diff --git a/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/cli.mdx b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/cli.mdx new file mode 100644 index 000000000..5a00db158 --- /dev/null +++ b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/cli.mdx @@ -0,0 +1,221 @@ +--- +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 ` + +## init + +`wails init` is used for generating projects. + +| Flag | Description | Default | +|:------------------ |:----------------------------------------------------------------------------------------------------------------------- |:-------------------:| +| -n "project name" | Name of the project. **Mandatory**. | | +| -d "project dir" | Project directory to create | Name of the project | +| -g | Initialise git repository | | +| -l | List available project templates | | +| -q | Suppress output to console | | +| -t "template name" | The project template to use. This can be the name of a default template or a URL to a remote template hosted on github. | vanilla | +| -ide | Generate IDE project files | | +| -f | Force build application | false | + +Example: `wails init -n test -d mytestproject -g -ide vscode -q` + +This will generate a a project called "test" in the "mytestproject" directory, initialise git, generate vscode project files and do so silently. + +More information on using IDEs with Wails can be found [here](../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 | +|:-------------------- |:--------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |:--------------------------------------------------------------------------------------------------------------------------------------------------- | +| -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`.
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 | 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" | | +| -upxflags | Flags to pass to upx | | +| -v int | Verbosity level (0 - silent, 1 - default, 2 - verbose) | 1 | +| -webview2 | WebView2 installer strategy: download,embed,browser,error | download | +| -u | Updates your project's `go.mod` to use the same version of Wails as the CLI | | +| -debug | Retains debug information in the application. 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. + +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 UPX on Apple Silicon + +There are [issues](https://github.com/upx/upx/issues/446) with using UPX with Apple Silicon. + +::: + +:::info UPX on Windows + +Some Antivirus vendors false positively mark `upx` compressed binaries as virus, see [issue](https://github.com/upx/upx/issues/437). + +::: + +### Platforms + +Supported platforms are: + +| Platform | Description | +|:---------------- |:--------------------------------------------- | +| darwin | MacOS + architecture of build machine | +| darwin/amd64 | MacOS 10.13+ AMD64 | +| darwin/arm64 | MacOS 11.0+ ARM64 | +| darwin/universal | MacOS AMD64+ARM64 universal application | +| windows | Windows 10/11 + architecture of build machine | +| windows/amd64 | Windows 10/11 AMD64 | +| windows/arm64 | Windows 10/11 ARM64 | +| linux | Linux + architecture of build machine | +| linux/amd64 | Linux AMD64 | +| linux/arm64 | Linux ARM64 | + +## doctor + +`wails doctor` will run diagnostics to ensure that your system is ready for development. + +Example: + +``` +Wails CLI v2.0.0-beta + +Scanning system - Please wait (this may take a long time)...Done. + +System +------ +OS: Windows 10 Pro +Version: 2009 (Build: 19043) +ID: 21H1 +Go Version: go1.17 +Platform: windows +Architecture: amd64 + +Dependency Package Name Status Version +---------- ------------ ------ ------- +WebView2 N/A Installed 93.0.961.52 +npm N/A Installed 6.14.15 +*upx N/A Installed upx 3.96 + +* - Optional Dependency + +Diagnosis +--------- +Your system is ready for Wails development! + +``` + +## dev + +`wails dev` is used to run your application in a "live development" mode. This means: + +- The application's `go.mod` will be updated to use the same version of Wails as the CLI +- The application is compiled and run automatically +- A watcher is started and will trigger a rebuild of your dev app if it detects changes to your go files +- A webserver is started on `http://localhost:34115` which serves your application (not just frontend) over http. This allows you to use your favourite browser development extensions +- All application assets are loaded from disk. If they are changed, the application will automatically reload (not rebuild). All connected browsers will also reload +- A JS module is generated that provides the following: + - Javascript wrappers of your Go methods with autogenerated JSDoc, providing code hinting + - TypeScript versions of your Go structs, that can be constructed and passed to your go methods +- A second JS module is generated that provides a wrapper + TS declaration for the runtime + +| Flag | Description | Default | +|:---------------------------- |:----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |:--------------------- | +| -assetdir "./path/to/assets" | Serve assets from the given directory instead of using the provided asset FS | Value in `wails.json` | +| -browser | Opens a browser to `http://localhost:34115` on startup | | +| -compiler "compiler" | Use a different go compiler to build, eg go1.15beta1 | go | +| -e | Extensions to trigger rebuilds (comma separated) | go | +| -reloaddirs | Additional directories to trigger reloads (comma separated) | Value in `wails.json` | +| -ldflags "flags" | Additional ldflags to pass to the compiler | | +| -tags "extra tags" | Build tags to pass to compiler (quoted and space separated) | | +| -loglevel "loglevel" | Loglevel to use - Trace, Debug, Info, Warning, Error | Debug | +| -noreload | Disable automatic reload when assets change | | +| -nogen | Disable generate module | | +| -v | Verbosity level (0 - silent, 1 - standard, 2 - verbose) | 1 | +| -wailsjsdir | The directory to generate the generated Wails JS modules | Value in `wails.json` | +| -debounce | The time to wait for reload after an asset change is detected | 100 (milliseconds) | +| -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 | | +| -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: + +`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. + +## 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. diff --git a/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/menus.mdx b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/menus.mdx new file mode 100644 index 000000000..565c8cb48 --- /dev/null +++ b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/menus.mdx @@ -0,0 +1,266 @@ +--- +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 + AppMenu := menu.NewMenu() + FileMenu := AppMenu.AddSubmenu("File") + FileMenu.AddText("&Open", keys.CmdOrCtrl("o"), openFile) + FileMenu.AddSeparator() + FileMenu.AddText("Quit", keys.CmdOrCtrl("q"), func(_ *menu.CallbackData) { + runtime.Quit() + }) + + if runtime.GOOS == "darwin" { + AppMenu.Append(menu.EditMenu()) // on macos platform, we should append EditMenu to enable Cmd+C,Cmd+V,Cmd+Z... shortcut + } + + err := wails.Run(&options.App{ + Title: "Menus Demo", + Width: 800, + Height: 600, + Menu: AppMenu, + 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" +## Menu + +A Menu is a collection of MenuItems: + +```go title="Package: github.com/wailsapp/wails/v2/pkg/menu" +type Menu struct { + Items []*MenuItem +} +``` + +For the Application menu, each MenuItem represents a single menu such as "Edit". + +A simple helper method is provided for building menus: + +```go title="Package: github.com/wailsapp/wails/v2/pkg/menu" +func NewMenuFromItems(first *MenuItem, rest ...*MenuItem) *Menu +``` + +This makes the layout of the code more like that of a menu without the need to add the menu items manually after creating them. Alternatively, you can just create the menu items and add them to the menu manually. + +## MenuItem + +A MenuItem represents an item within a Menu. + +```go title="Package: github.com/wailsapp/wails/v2/pkg/menu" +// MenuItem represents a menu item contained in a menu +type MenuItem struct { + Label string + Role Role + Accelerator *keys.Accelerator + Type Type + Disabled bool + Hidden bool + Checked bool + SubMenu *Menu + Click Callback +} +``` + +| Field | Type | Notes | +| ----------- | ------------------------------------ | ------------------------------------------------------------- | +| Label | string | The menu text | +| Accelerator | [\*keys.Accelerator](#accelerator) | Key binding for this menu item | +| Type | [Type](#type) | Type of MenuItem | +| Disabled | bool | Disables the menu item | +| Hidden | bool | Hides this menu item | +| Checked | bool | Adds check to item (Checkbox & Radio types) | +| SubMenu | [\*Menu](#menu) | Sets the submenu | +| Click | [Callback](#callback) | Callback function when menu clicked | +| Role | string | Defines a [role](#role) for this menu item. Mac only for now. | + +### Accelerator + +Accelerators (sometimes called keyboard shortcuts) define a binding between a keystroke and a menu item. Wails defines an Accelerator as a combination or key + [Modifier](#modifier). They are available in the `"github.com/wailsapp/wails/v2/pkg/menu/keys"` package. + +Example: + +```go title="Package: github.com/wailsapp/wails/v2/pkg/menu/keys" + // Defines cmd+o on Mac and ctrl-o on Window/Linux + myShortcut := keys.CmdOrCtrl("o") +``` + +Keys are any single character on a keyboard with the exception of `+`, which is defined as `plus`. Some keys cannot be represented as characters so there are a set of named characters that may be used: + +- `backspace` +- `tab` +- `return` +- `enter` +- `escape` +- `left` +- `right` +- `up` +- `down` +- `space` +- `delete` +- `home` +- `end` +- `page up` +- `page down` +- `f1` +- `f2` +- `f3` +- `f4` +- `f5` +- `f6` +- `f7` +- `f8` +- `f9` +- `f10` +- `f11` +- `f12` +- `f13` +- `f14` +- `f15` +- `f16` +- `f17` +- `f18` +- `f19` +- `f20` +- `f21` +- `f22` +- `f23` +- `f24` +- `f25` +- `f26` +- `f27` +- `f28` +- `f29` +- `f30` +- `f31` +- `f32` +- `f33` +- `f34` +- `f35` +- `numlock` + +Wails also supports parsing accelerators using the same syntax as Electron. This is useful for storing accelerators in config files. + +Example: + +```go title="Package: github.com/wailsapp/wails/v2/pkg/menu/keys" + // Defines cmd+o on Mac and ctrl-o on Window/Linux + myShortcut, err := keys.Parse("Ctrl+Option+A") +``` + +#### Modifier + +The following modifiers are keys that may be used in combination with the accelerator key: + +```go title="Package: github.com/wailsapp/wails/v2/pkg/menu/keys" +const ( + // CmdOrCtrlKey represents Command on Mac and Control on other platforms + CmdOrCtrlKey Modifier = "cmdorctrl" + // OptionOrAltKey represents Option on Mac and Alt on other platforms + OptionOrAltKey Modifier = "optionoralt" + // ShiftKey represents the shift key on all systems + ShiftKey Modifier = "shift" + // ControlKey represents the control key on all systems + ControlKey Modifier = "ctrl" +) +``` + +A number of helper methods are available to create Accelerators using modifiers: + +```go title="Package: github.com/wailsapp/wails/v2/pkg/menu/keys" +func CmdOrCtrl(key string) *Accelerator +func OptionOrAlt(key string) *Accelerator +func Shift(key string) *Accelerator +func Control(key string) *Accelerator +``` + +Modifiers can be combined using `keys.Combo(key string, modifier1 Modifier, modifier2 Modifier, rest ...Modifier)`: + +```go title="Package: github.com/wailsapp/wails/v2/pkg/menu/keys" + // Defines "Ctrl+Option+A" on Mac and "Ctrl+Alt+A" on Window/Linux + myShortcut := keys.Combo("a", ControlKey, OptionOrAltKey) +``` + +### Type + +Each menu item must have a type and there are 5 types available: + +```go title="Package: github.com/wailsapp/wails/v2/pkg/menu" +const ( + TextType Type = "Text" + SeparatorType Type = "Separator" + SubmenuType Type = "Submenu" + CheckboxType Type = "Checkbox" + RadioType Type = "Radio" +) +``` + +For convenience, helper methods are provided to quickly create a menu item: + +```go title="Package: github.com/wailsapp/wails/v2/pkg/menu" +func Text(label string, accelerator *keys.Accelerator, click Callback) *MenuItem +func Separator() *MenuItem +func Radio(label string, selected bool, accelerator *keys.Accelerator, click Callback) *MenuItem +func Checkbox(label string, checked bool, accelerator *keys.Accelerator, click Callback) *MenuItem +func SubMenu(label string, menu *Menu) *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()` | diff --git a/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/options.mdx b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/options.mdx new file mode 100644 index 000000000..797ac7932 --- /dev/null +++ b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/options.mdx @@ -0,0 +1,627 @@ +--- +sidebar_position: 3 +--- + +# Options + +## Application Options + +The `Options.App` struct contains the application configuration. It is passed to the `wails.Run()` method: + +```go title="Example" +import "github.com/wailsapp/wails/v2/pkg/options" + +func main() { + + err := wails.Run(&options.App{ + Title: "Menus Demo", + Width: 800, + Height: 600, + DisableResize: false, + Fullscreen: false, + Frameless: true, + MinWidth: 400, + MinHeight: 400, + MaxWidth: 1280, + MaxHeight: 1024, + StartHidden: false, + HideWindowOnClose: false, + BackgroundColour: &options.RGBA{R: 0, G: 0, B: 0, A: 255}, + AlwaysOnTop: false, + Assets: assets, + AssetsHandler: assetsHandler, + Menu: app.applicationMenu(), + Logger: nil, + LogLevel: logger.DEBUG, + LogLevelProduction: logger.ERROR, + OnStartup: app.startup, + OnDomReady: app.domready, + OnShutdown: app.shutdown, + OnBeforeClose: app.beforeClose, + WindowStartState: options.Maximised, + CSSDragProperty: "--wails-draggable", + CSSDragValue: "drag", + Bind: []interface{}{ + app, + }, + Windows: &windows.Options{ + WebviewIsTransparent: false, + WindowIsTranslucent: 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), + }, + // User messages that can be customised + Messages *windows.Messages + }, + Mac: &mac.Options{ + TitleBar: &mac.TitleBar{ + TitlebarAppearsTransparent: true, + HideTitle: false, + HideTitleBar: false, + FullSizeContent: false, + UseToolbar: false, + HideToolbarSeparator: true, + }, + Appearance: mac.NSAppearanceNameDarkAqua, + WebviewIsTransparent: true, + WindowIsTranslucent: false, + About: &mac.AboutInfo{ + Title: "My Application", + Message: "© 2021 Me", + Icon: icon, + }, + }, + Linux: &linux.Options{ + Icon: icon, + }, + }) + if err != nil { + log.Fatal(err) + } +} + +``` + +### Title + +The text shown in the window's title bar. + +Type: string + +### Width + +The initial width of the window. + +Name: Width + +### Height + +The initial height of the window. + +Type: [AppearanceType](#appearance-type) + +### DisableResize + +By default, the main window is resizable. Setting this to `true` will keep it a fixed size. + +Type: int + +### Fullscreen + +Setting this to `true` will make the window fullscreen at startup. + +Type: int + +### Frameless + +When set to `true`, the window will have no borders or title bar. Also see [Frameless Windows](../guides/frameless.mdx). + +Type: int + +### 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. + +Type: bool + +### 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. + +Type: bool + +### 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. + +Type: bool + +### 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. + +Type: bool + +### StartHidden + +When set to `true`, the application will be hidden until [WindowShow](../reference/runtime/window.mdx#windowshow) is called. + +Type: int +### HideWindowOnClose + +By default, closing the window will close the application. Setting this to `true` means closing the window will hide the window instead. + +hide the window instead. + +Type: int + +### BackgroundColour + +This value is the default background colour of the window. Default: white + +Type: *options.RGBA Example: options.NewRGBA(255,0,0,128) - Red at 50% transparency + +### AlwaysOnTop + +Indicates that the window should stay above other windows when losing focus. + +Type: int + +### Assets + +The frontend assets to be used by the application. Requires an `index.html` file. + +Name: StartHidden + +### AssetsHandler + + + +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. + +| Value | 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. + +Type: http.Handler + +### 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. ::: + +Type: \*menu.Menu + +### Logger + +The logger to be used by the application. More details about logging in the [Log Reference](../reference/runtime/log.mdx). + +Type: bool + +### LogLevel + +The default log level. More details about logging in the [Log Reference](../reference/runtime/log.mdx). + +Name: Assets + +### LogLevelProduction + +The default log level for production builds. More details about logging in the [Log Reference](../reference/runtime/log.mdx). + +Type: logger.LogLevel + +### 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: AssetsHandler + +### OnDomReady + +This callback is called after the frontend has loaded `index.html` and its resources. It is given the application context. + +Name: AssetsHandler + +### OnShutdown + +This callback is called after the frontend has been destroyed, just before the application terminates. It is given the application context. + +Name: AssetsHandler + +### 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" +} +``` + +Type: func(ctx context.Context) bool + +### WindowStartState + +Defines how the window should present itself at startup. + +| Value | Win | Mac | Lin | +| ---------- | --- | --- | --- | +| Fullscreen | ✅ | ✅ | ✅ | +| Maximised | ✅ | ✅ | ✅ | +| Minimised | ✅ | ❌ | ✅ | + +Name: Logger + +### CSSDragProperty + +Indicates the CSS property to use to identify which elements can be used to drag the window. Default: `--wails-draggable`. + +Type: string + +### CSSDragValue + +Indicates what value the `CSSDragProperty` style should have to drag the window. Default: `drag`. + +Type: string + +### Bind + +A slice of struct instances defining methods that need to be bound to the frontend. + +Default: Logger to Stdout + +### Windows + +This defines [Windows specific options](#windows-specific-options). + +Name: LogLevel + +### Mac + +This defines [Mac specific options](#mac-specific-options). + +Default: `Info` in dev mode, `Error` in production mode + +### Linux + +This defines [Linux specific options](#linux-specific-options). + +Name: LogLevelProduction + +## Windows Specific 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. + +Type: int + +### WindowIsTranslucent + +Setting this to `true` will make the window background translucent. Often combined with [WebviewIsTransparent](#WebviewIsTransparent) to make frosty-looking applications. + +Type: int + +### DisableWindowIcon + +Setting this to `true` will remove the icon in the top left corner of the title bar. + +Type: int + +### 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. + +Type: int + +### WebviewUserDataPath + +This defines the path where the WebView2 stores the user data. If empty `%APPDATA%\[BinaryName.exe]` will be used. + +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) + +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 | + +Type: `windows.Theme` + +### CustomTheme + +Name: WindowStartState + +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. + +Type: `windows.CustomTheme` + +#### Name: CustomTheme + +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. + +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. + +Type: \*mac.Options + +### OnSuspend + +If set, this function will be called when windows initiates a switch to low power mode (suspend/hibernate) + +Name: Linux + +### OnResume + +If set, this function will be called when windows resumes from low power mode (suspend/hibernate) + +Name: Linux + +## Mac Specific Options + +### TitleBar + +The TitleBar struct provides the ability to configure the look and feel of the title bar. + +Type: bool + + +### 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: WindowIsTranslucent + +### 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. + +Type: int + +### WindowIsTranslucent + +Setting this to `true` will make the window background translucent. Often combined with [WebviewIsTransparent](#WebviewIsTransparent) to make frosty-looking applications. + +Type: int + +### 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: DisableFramelessWindowDecorations + + +#### 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 type + +You can specify the application's [appearance](https://developer.apple.com/documentation/appkit/nsappearance?language=objc). + +| Value | Description | +| ----------------------------------------------------- | --------------------------------------------------------------- | +| DefaultAppearance | DefaultAppearance uses the default system value | +| NSAppearanceNameAqua | The standard light system appearance | +| NSAppearanceNameDarkAqua | The standard dark system appearance | +| NSAppearanceNameVibrantLight | The light vibrant appearance | +| NSAppearanceNameAccessibilityHighContrastAqua | A high-contrast version of the standard light system appearance | +| NSAppearanceNameAccessibilityHighContrastDarkAqua | A high-contrast version of the standard dark system appearance | +| NSAppearanceNameAccessibilityHighContrastVibrantLight | A high-contrast version of the light vibrant appearance | +| NSAppearanceNameAccessibilityHighContrastVibrantDark | A high-contrast version of the dark vibrant appearance | + +Example: + +```go +Mac: &mac.Options{ + Appearance: mac.NSAppearanceNameDarkAqua, +} +``` + +#### About struct + +```go +type AboutInfo struct { + Title string + Message string + Icon []byte +} +``` + +If these settings are provided, an "About" menu item will appear in the app menu (when using the `AppMenu` role). Given this configuration: + +```go +//go:embed build/appicon.png +var icon []byte + +func main() { + err := wails.Run(&options.App{ + ... + Mac: &mac.Options{ + About: &mac.AboutInfo{ + Title: "My Application", + Message: "© 2021 Me", + Icon: icon, + }, + }, + }) +``` + +The "About" menu item will appear in the app menu: + +
+ +
+ +
+ +When clicked, that will open an about message box: + +
+ +
+ +
+ +## Linux Specific Options + +### Icon + +Sets up the icon representing the window. This icon is used when the window is minimized (also known as iconified). + +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. diff --git a/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/project-config.mdx b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/project-config.mdx new file mode 100644 index 000000000..3dc1cf002 --- /dev/null +++ b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/project-config.mdx @@ -0,0 +1,51 @@ +--- +sidebar_position: 5 +--- + +# Project Config + +The project config resides in the `wails.json` file in the project directory. The structure of the config is: + +```json +{ + "name": "[The project name]", + "assetdir": "[Relative path to the directory containing the compiled assets, this is normally inferred and could be left empty]", + "reloaddirs": "[Additional directories to trigger reloads (comma separated), this is only used for some advanced asset configurations]", + "frontend:install": "[The command to install node dependencies, run in the frontend directory - often `npm install`]", + "frontend:build": "[The command to build the assets, run in the frontend directory - often `npm run build`]", + "frontend:dev": "[This command has been replaced by frontend:dev:build. If frontend:dev:build is not specified will falls back to this command. If this command is also not specified will falls back to frontend:build]", + "frontend:dev:build": "[This command is the dev equivalent of frontend:build. If not specified falls back to frontend:dev]", + "frontend:dev:install": "[This command is the dev equivalent of frontend:install. If not specified falls back to frontend:install]", + "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. 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]", + "debounceMS": 100, // The default time the dev server waits to reload when it detects a change in assets + "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.]", + "*/*": "[The command that will be executed after every build: ${platform} is replaced with the "GOOS/GOARCH" and ${bin} with the path to the compiled binary.]" + }, + "info": { // Data used to populate manifests and version info. + "companyName": "[The company name. Default: [The project name]]", + "productName": "[The product name. Default: [The project name]]", + "productVersion": "[The version of the product. Default: '1.0.0']", + "copyright": "[The copyright of the product. Default: 'Copyright.........']", + "comments": "[A short comment of the app. Default: 'Built using Wails (https://wails.app)']" + }, + "nsisType": "['multiple': One installer per architecture. 'single': Single universal installer for all architectures being built. Default: 'multiple']" +} +``` + +This file is read by the Wails CLI when running `wails build` or `wails dev`. + +The `assetdir`, `reloaddirs`, `wailsjsdir`, `debounceMS`, `devserver` and `frontenddevserverurl` flags in `wails build/dev` will update the project config and thus become defaults for subsequent runs. diff --git a/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/_category_.json b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/_category_.json new file mode 100644 index 000000000..ac6d55488 --- /dev/null +++ b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/_category_.json @@ -0,0 +1,4 @@ +{ + "label": "Runtime", + "position": 1 +} diff --git a/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/browser.mdx b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/browser.mdx new file mode 100644 index 000000000..976ca1d80 --- /dev/null +++ b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/browser.mdx @@ -0,0 +1,14 @@ +--- +sidebar_position: 7 +--- + +# Browser + +These methods are related to the system browser. + +### BrowserOpenURL + +Opens the given URL in the system browser. + +Go: `BrowserOpenURL(ctx context.Context, url string)`
JS: `BrowserOpenURL(url string)` + diff --git a/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/dialog.mdx b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/dialog.mdx new file mode 100644 index 000000000..bf1dd7246 --- /dev/null +++ b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/dialog.mdx @@ -0,0 +1,283 @@ +--- +sidebar_position: 5 +--- + +# Dialog + +This part of the runtime provides access to native dialogs, such as File Selectors and Message boxes. + +:::info Javascript + Dialog is currently unsupported in the JS runtime. +::: + +### OpenDirectoryDialog + +Opens a dialog that prompts the user to select a directory. Can be customised using [OpenDialogOptions](#opendialogoptions). + +Go: `OpenDirectoryDialog(ctx context.Context, dialogOptions OpenDialogOptions) (string, error)` + +Returns: Selected directory (blank if the user cancelled) or an error + +### OpenFileDialog + +Opens a dialog that prompts the user to select a file. Can be customised using [OpenDialogOptions](#opendialogoptions). + +Go: `OpenFileDialog(ctx context.Context, dialogOptions OpenDialogOptions) (string, error)` + +Returns: Selected file (blank if the user cancelled) or an error + +### OpenMultipleFilesDialog + +Opens a dialog that prompts the user to select multiple files. Can be customised using [OpenDialogOptions](#opendialogoptions). + +Go: `OpenMultipleFilesDialog(ctx context.Context, dialogOptions OpenDialogOptions) ([]string, error)` + +Returns: Selected files (nil if the user cancelled) or an error + +### SaveFileDialog + +Opens a dialog that prompts the user to select a filename for the purposes of saving. Can be customised using [SaveDialogOptions](#savedialogoptions). + +Go: `SaveFileDialog(ctx context.Context, dialogOptions SaveDialogOptions) (string, error)` + +Returns: The selected file (blank if the user cancelled) or an error + +### MessageDialog + +Displays a message using a message dialog. Can be customised using [MessageDialogOptions](#messagedialogoptions). + +Go: `MessageDialog(ctx context.Context, dialogOptions MessageDialogOptions) (string, error)` + +Returns: The text of the selected button or an error + +## Options + +### OpenDialogOptions + +```go +type OpenDialogOptions struct { + DefaultDirectory string + DefaultFilename string + Title string + Filters []FileFilter + ShowHiddenFiles bool + CanCreateDirectories bool + ResolvesAliases bool + TreatPackagesAsDirectories bool +} +``` + +| Field | Description | Win | Mac | Lin | +| -------------------------- | ---------------------------------------------- | --- | --- | --- | +| DefaultDirectory | The directory the dialog will show when opened | ✅ | ✅ | ✅ | +| DefaultFilename | The default filename | ✅ | ✅ | ✅ | +| Title | Title for the dialog | ✅ | ✅ | ✅ | +| [Filters](#filefilter) | A list of file filters | ✅ | ✅ | ✅ | +| ShowHiddenFiles | Show files hidden by the system | | ✅ | ✅ | +| CanCreateDirectories | Allow user to create directories | | ✅ | | +| ResolvesAliases | If true, returns the file not the alias | | ✅ | | +| TreatPackagesAsDirectories | Allow navigating into packages | | ✅ | | + +### SaveDialogOptions + +```go +type SaveDialogOptions struct { + DefaultDirectory string + DefaultFilename string + Title string + Filters []FileFilter + ShowHiddenFiles bool + CanCreateDirectories bool + TreatPackagesAsDirectories bool +} +``` + +| Field | Description | Win | Mac | Lin | +| -------------------------- | ---------------------------------------------- | --- | --- | --- | +| DefaultDirectory | The directory the dialog will show when opened | ✅ | ✅ | ✅ | +| DefaultFilename | The default filename | ✅ | ✅ | ✅ | +| Title | Title for the dialog | ✅ | ✅ | ✅ | +| [Filters](#filefilter) | A list of file filters | ✅ | ✅ | ✅ | +| ShowHiddenFiles | Show files hidden by the system | | ✅ | ✅ | +| CanCreateDirectories | Allow user to create directories | | ✅ | | +| TreatPackagesAsDirectories | Allow navigating into packages | | ✅ | | + +### MessageDialogOptions + +```go +type MessageDialogOptions struct { + Type DialogType + Title string + Message string + Buttons []string + DefaultButton string + CancelButton string +} +``` + +| Field | Description | Win | Mac | Lin | +| ------------- | ------------------------------------------------------------------------- | --- | --- | --- | +| Type | The type of message dialog, eg question, info... | ✅ | ✅ | ✅ | +| Title | Title for the dialog | ✅ | ✅ | ✅ | +| Message | The message to show the user | ✅ | ✅ | ✅ | +| Buttons | A list of button titles | | ✅ | | +| DefaultButton | The button with this text should be treated as default. Bound to `return` | | ✅ | | +| CancelButton | The button with this text should be treated as cancel. Bound to `escape` | | ✅ | | + +#### Windows + +Windows has standard dialog types in which the buttons are not customisable. The value returned will be one of: "Ok", "Cancel", "Abort", "Retry", "Ignore", "Yes", "No", "Try Again" or "Continue" + +#### Linux + +Linux has standard dialog types in which the buttons are not customisable. The value returned will be one of: "Ok", "Cancel", "Yes", "No" + +#### Mac + +A message dialog on Mac may specify up to 4 buttons. If no `DefaultButton` or `CancelButton` is given, the first button is considered default and is bound to the `return` key. + +For the following code: + +```go +selection, err := runtime.MessageDialog(b.ctx, runtime.MessageDialogOptions{ + Title: "It's your turn!", + Message: "Select a number", + Buttons: []string{"one", "two", "three", "four"}, +}) +``` + +the first button is shown as default: + +
+ +
+ +
+ +And if we specify `DefaultButton` to be "two": + +```go +selection, err := runtime.MessageDialog(b.ctx, runtime.MessageDialogOptions{ + Title: "It's your turn!", + Message: "Select a number", + Buttons: []string{"one", "two", "three", "four"}, + DefaultButton: "two", +}) +``` + +the second button is shown as default. When `return` is pressed, the value "two" is returned. + +
+ +
+ +
+ +If we now specify `CancelButton` to be "three": + +```go +selection, err := runtime.MessageDialog(b.ctx, runtime.MessageDialogOptions{ + Title: "It's your turn!", + Message: "Select a number", + Buttons: []string{"one", "two", "three", "four"}, + DefaultButton: "two", + CancelButton: "three", +}) +``` + +the button with "three" is shown at the bottom of the dialog. When `escape` is pressed, the value "three" is returned: + +
+ +
+ +
+
+
+ +#### DialogType + +```go +const ( + InfoDialog DialogType = "info" + WarningDialog DialogType = "warning" + ErrorDialog DialogType = "error" + QuestionDialog DialogType = "question" + ) +``` + +### FileFilter + +```go +type FileFilter struct { + DisplayName string // Filter information EG: "Image Files (*.jpg, *.png)" + Pattern string // semi-colon separated list of extensions, EG: "*.jpg;*.png" +} +``` + +#### Windows + +Windows allows you to use multiple file filters in dialog boxes. Each FileFilter will show up as a separate entry in the dialog: + +
+ +
+ +
+
+
+ +#### Linux + +Linux allows you to use multiple file filters in dialog boxes. Each FileFilter will show up as a separate entry in the dialog: + +
+ +
+ +
+
+
+ +#### Mac + +Mac dialogs only have the concept of a single set of patterns to filter files. If multiple FileFilters are provided, Wails will use all the Patterns defined. + +Example: + +```go + selection, err := runtime.OpenFileDialog(b.ctx, runtime.OpenDialogOptions{ + Title: "Select File", + Filters: []runtime.FileFilter{ + { + DisplayName: "Images (*.png;*.jpg)", + Pattern: "*.png;*.jpg", + }, { + DisplayName: "Videos (*.mov;*.mp4)", + Pattern: "*.mov;*.mp4", + }, + }, + }) +``` + +This will result in the Open File dialog using `*.png,*.jpg,*.mov,*.mp4` as a filter. diff --git a/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/events.mdx b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/events.mdx new file mode 100644 index 000000000..75e8b0a50 --- /dev/null +++ b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/events.mdx @@ -0,0 +1,38 @@ +--- +sidebar_position: 2 +--- + +# Events + +The Wails runtime provides a unified events system, where events can be emitted or received by either Go or Javascript. Optionally, data may be passed with the events. Listeners will receive the data in the local data types. + +### EventsOn + +This method sets up a listener for the given event name. When an event of type `eventName` is [emitted](#EventsEmit), the callback is triggered. Any additional data sent with the emitted event will be passed to the callback. + +Go: `EventsOn(ctx context.Context, eventName string, callback func(optionalData ...interface{}))`
JS: `EventsOn(eventName string, callback function(optionalData?: any))` + +### EventsOff + +This method unregisters the listener for the given event name, optionally multiple listeneres can be unregistered via `additionalEventNames`. + +Go: `EventsOff(ctx context.Context, eventName string, additionalEventNames ...string)`
JS: `EventsOff(eventName string, ...additionalEventNames)` + +### EventsOnce + +This method sets up a listener for the given event name, but will only trigger once. + +Go: `EventsOnce(ctx context.Context, eventName string, callback func(optionalData ...interface{}))`
JS: `EventsOnce(eventName string, callback function(optionalData?: any))` + +### EventsOnMultiple + +This method sets up a listener for the given event name, but will only trigger a maximum of `counter` times. + +Go: `EventsOnMultiple(ctx context.Context, eventName string, callback func(optionalData ...interface{}), counter int)`
JS: `EventsOnMultiple(eventName string, callback function(optionalData?: any), counter int)` + +### EventsEmit + +This method emits the given event. Optional data may be passed with the event. This will trigger any event listeners. + +Go: `EventsEmit(ctx context.Context, eventName string, optionalData ...interface{})`
JS: `EventsEmit(ctx context, optionalData function(optionalData?: any))` + diff --git a/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/intro.mdx b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/intro.mdx new file mode 100644 index 000000000..6c02c71cd --- /dev/null +++ b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/intro.mdx @@ -0,0 +1,73 @@ +--- +sidebar_position: 1 +--- + +# Introduction + +The runtime is a library that provides utility methods for your application. There is both a Go and Javascript runtime and the aim is to try and keep them at parity where possible. + +It has utility methods for: + +- [Window](window.mdx) +- [Menu](menu.mdx) +- [Dialog](dialog.mdx) +- [Events](events.mdx) +- [Browser](browser.mdx) +- [Log](log.mdx) + +The Go Runtime is available through importing `github.com/wailsapp/wails/v2/pkg/runtime`. All methods in this package take a context as the first parameter. This context should be obtained from the [OnStartup](../options.mdx#onstartup) or [OnDomReady](../options.mdx#ondomready) hooks. + +:::info Note + +Whilst the context will be provided to the [OnStartup](../options.mdx#onstartup) method, there's no guarantee the runtime will work in this method as the window is initialising in a different thread. If you wish to call runtime methods at startup, use [OnDomReady](../options.mdx#ondomready). + +::: + +The Javascript library is available to the frontend via the `window.runtime` map. There is a runtime package generated when using `dev` mode that provides Typescript declarations for the runtime. This should be located in the `wailsjs` directory in your frontend directory. + +### Hide + +Go: `Hide(ctx context.Context)`
JS: `Hide()` + +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 + +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`. ::: + +Go: `Show(ctx context.Context)`
JS: `Show()` + +### Quit + +Quits the application. + +Go: `Quit(ctx context.Context)`
JS: `Quit()` + +### Environment + +Returns details of the current environment. + +Go: `Environment(ctx context.Context) EnvironmentInfo`
JS: `Environment(): Promise` + +#### EnvironmentInfo + +Go: +```go +type EnvironmentInfo struct { + BuildType string + Platform string + Arch string +} +``` +JS: +```ts +interface EnvironmentInfo { + buildType: string; + platform: string; + arch: string; +} +``` diff --git a/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/log.mdx b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/log.mdx new file mode 100644 index 000000000..e5e6ea7ac --- /dev/null +++ b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/log.mdx @@ -0,0 +1,130 @@ +--- +sidebar_position: 3 +--- + +# Log + +The Wails runtime provides a logging mechanism that may be called from Go or Javascript. Like most loggers, there are a number of log levels: + +- Trace +- Debug +- Info +- Warning +- Error +- Fatal + +The logger will output any log message at the current, or higher, log level. Example: The `Debug` log level will output all messages except `Trace` messages. + +### LogPrint + +Logs the given message as a raw message. + +Go: `LogPrint(ctx context.Context, message string)`
JS: `LogPrint(message: string)` + +### LogPrintf + +Logs the given message as a raw message. + +Go: `LogPrintf(ctx context.Context, format string, args ...interface{})`
+ +### LogTrace + +Logs the given message at the `Trace` log level. + +Go: `LogTrace(ctx context.Context, message string)`
JS: `LogTrace(message: string)` + +### LogTracef + +Logs the given message at the `Trace` log level. + +Go: `LogTracef(ctx context.Context, format string, args ...interface{})`
+ +### LogDebug + +Logs the given message at the `Debug` log level. + +Go: `LogDebug(ctx context.Context, message string)`
JS: `LogDebug(message: string)` + +### LogDebugf + +Logs the given message at the `Debug` log level. + +Go: `LogDebugf(ctx context.Context, format string, args ...interface{})`
+ +### LogInfo + +Logs the given message at the `Info` log level. + +Go: `LogInfo(ctx context.Context, message string)`
JS: `LogInfo(message: string)` + +### LogInfof + +Logs the given message at the `Info` log level. + +Go: `LogInfof(ctx context.Context, format string, args ...interface{})`
+ +### LogWarning + +Logs the given message at the `Warning` log level. + +Go: `LogWarning(ctx context.Context, message string)`
JS: `LogWarning(message: string)` + +### LogWarningf + +Logs the given message at the `Warning` log level. + +Go: `LogWarningf(ctx context.Context, format string, args ...interface{})`
+ +### LogError + +Logs the given message at the `Error` log level. + +Go: `LogError(ctx context.Context, message string)`
JS: `LogError(message: string)` + +### LogErrorf + +Logs the given message at the `Error` log level. + +Go: `LogErrorf(ctx context.Context, format string, args ...interface{})`
+ +### LogFatal + +Logs the given message at the `Fatal` log level. + +Go: `LogFatal(ctx context.Context, message string)`
JS: `LogFatal(message: string)` + +### LogFatalf + +Logs the given message at the `Fatal` log level. + +Go: `LogFatalf(ctx context.Context, format string, args ...interface{})`
+ +### LogSetLogLevel + +Sets the log level. In Javascript, the number relates to the following log levels: + +| Value | Log Level | +| ----- | --------- | +| 1 | Trace | +| 2 | Debug | +| 3 | Info | +| 4 | Warning | +| 5 | Error | + +Go: `LogSetLogLevel(ctx context.Context, level logger.LogLevel)`
JS: `LogSetLogLevel(level: number)` + +## Using a Custom Logger + +A custom logger may be used by providing it using the [Logger](../options.mdx#logger) application option. The only requirement is that the logger implements the `logger.Logger` interface defined in `github.com/wailsapp/wails/v2/pkg/logger`: + +```go title="logger.go" +type Logger interface { + Print(message string) + Trace(message string) + Debug(message string) + Info(message string) + Warning(message string) + Error(message string) + Fatal(message string) +} +``` diff --git a/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/menu.mdx b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/menu.mdx new file mode 100644 index 000000000..226ff2c68 --- /dev/null +++ b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/menu.mdx @@ -0,0 +1,23 @@ +--- +sidebar_position: 6 +--- + +# Menu + +These methods are related to the application menu. + +:::info Javascript + Menu is currently unsupported in the JS runtime. +::: + +### MenuSetApplicationMenu + +Sets the application menu to the given [menu](../menus.mdx). + +Go: `MenuSetApplicationMenu(ctx context.Context, menu *menu.Menu)` + +### MenuUpdateApplicationMenu + +Updates the application menu, picking up any changes to the menu passed to `MenuSetApplicationMenu`. + +Go: `MenuUpdateApplicationMenu(ctx context.Context)` diff --git a/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/window.mdx b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/window.mdx new file mode 100644 index 000000000..d33db2cbf --- /dev/null +++ b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/window.mdx @@ -0,0 +1,209 @@ +--- +sidebar_position: 4 +--- + +# Window + +These methods give control of the application window. + +### WindowSetTitle + +Sets the text in the window title bar. + +Go: `WindowSetTitle(ctx context.Context, title string)`
JS: `WindowSetTitle(title: string)` + +### WindowFullscreen + +Makes the window full screen. + +Go: `WindowFullscreen(ctx context.Context)`
JS: `WindowFullscreen()` + +### WindowUnfullscreen + +Restores the previous window dimensions and position prior to full screen. + +Go: `WindowUnfullscreen(ctx context.Context)`
JS: `WindowUnfullscreen()` + +### WindowIsFullscreen + +Returns true if the window is full screen. + +Go: `WindowCenter(ctx context.Context)`
JS: `WindowCenter()` + +### WindowCenter + +Centers the window on the monitor the window is currently on. + +Go: `WindowReload(ctx context.Context)`
JS: `WindowReload()` + +### WindowReload + +Performs a "reload" (Reloads current page). + +Go: `WindowReloadApp(ctx context.Context)`
JS: `WindowReloadApp()` + +### WindowReloadApp + +Reloads the application frontend. + +Go: `WindowSetSystemDefaultTheme(ctx context.Context)`
JS: `WindowSetSystemDefaultTheme()` + +### WindowSetSystemDefaultTheme + +Windows only. + +Go: `WindowSetDarkTheme(ctx context.Context)`
JS: `WindowSetDarkTheme()` + +Sets window theme to system default (dark/light). + +### WindowSetLightTheme + +Windows only. + +Go: `WindowSetLightTheme(ctx context.Context)`
JS: `WindowSetLightTheme()` + +Sets window theme to light. + +### WindowSetDarkTheme + +Windows only. + +Go: `WindowShow(ctx context.Context)`
JS: `WindowShow()` + +Sets window theme to dark. + +### WindowShow + +Shows the window, if it is currently hidden. + +Go: `WindowHide(ctx context.Context)`
JS: `WindowHide()` + +### WindowHide + +Hides the window, if it is currently visible. + +Go: `WindowSetSize(ctx context.Context, width int, height int)`
JS: `WindowSetSize(size: Size)` + +### WindowIsNormal + +Returns true if the window not minimised, maximised or fullscreen. + +Go: `WindowGetSize(ctx context.Context) (width int, height int)`
JS: `WindowGetSize() : Size` + +### WindowSetSize + +Sets the width and height of the window. + +Go: `WindowSetMaxSize(ctx context.Context, width int, height int)`
JS: `WindowSetMaxSize(size: Size)` + +### WindowGetSize + +Gets the width and height of the window. + +Go: `WindowSetMinSize(ctx context.Context, width int, height int)`
JS: `WindowSetMinSize(size: Size)` + +### WindowSetMinSize + +Sets the minimum window size. Will resize the window if the window is currently smaller than the given dimensions. + +Setting a size of `0,0` will disable this constraint. + +Go: `WindowSetAlwaysOnTop(ctx context.Context, b bool)`
JS: `WindowSetAlwaysOnTop(b: Boolen)` + +### WindowSetMaxSize + +Sets the maximum window size. Will resize the window if the window is currently larger than the given dimensions. + +Setting a size of `0,0` will disable this constraint. + +Go: `WindowSetPosition(ctx context.Context, x int, y int)`
JS: `WindowSetPosition(position: Position)` + +### WindowSetAlwaysOnTop + +Sets the window AlwaysOnTop or not on top. + +Go: `WindowGetPosition(ctx context.Context) (x int, y int)`
JS: `WindowGetPosition() : Position` + +### WindowSetPosition + +Sets the window position relative to the monitor the window is currently on. + +Go: `WindowMaximise(ctx context.Context)`
JS: `WindowMaximise()` + +### WindowGetPosition + +Gets the window position relative to the monitor the window is currently on. + +Go: `WindowUnmaximise(ctx context.Context)`
JS: `WindowUnmaximise()` + +### WindowMaximise + +Maximises the window to fill the screen. + +Go: `WindowToggleMaximise(ctx context.Context)`
JS: `WindowToggleMaximise()` + +### WindowUnmaximise + +Restores the window to the dimensions and position prior to maximising. + +Go: `WindowMinimise(ctx context.Context)`
JS: `WindowMinimise()` + +### WindowIsMaximised + +Returns true if the window is maximised. + +Go: `WindowUnminimise(ctx context.Context)`
JS: `WindowUnminimise()` + +### WindowToggleMaximise + +Toggles between Maximised and UnMaximised. + +Go: `WindowToggleMaximise(ctx context.Context)`
JS: `WindowToggleMaximise()` + +### WindowMinimise + +Minimises the window. + +Go: `WindowSetBackgroundColour(ctx context.Context, R, G, B, A uint8)`
JS: `WindowSetBackgroundColour(R, G, B, A)` + +### WindowUnminimise + +Restores the window to the dimensions and position prior to minimising. + +Go: `WindowUnminimise(ctx context.Context)`
JS: `WindowUnminimise()` + +### WindowIsMinimised + +Returns true if the window is minimised. + +Go: `WindowIsMinimised(ctx context.Context) bool` JS: `WindowIsMinimised() bool` + +### WindowSetBackgroundColour + +Sets the background colour of the window to the given RGBA colour definition. This colour will show through for all transparent pixels. + +Valid values for R, G, B and A are 0-255. + +Any value that is not 0 will be considered 255. Any value that is not 0 will be considered 255. ::: + +Go: `WindowSetBackgroundColour(ctx context.Context, R, G, B, A uint8)`
JS: `WindowSetBackgroundColour(R, G, B, A)` + +## Typescript Object Definitions + +### Position + +```ts +interface Position { + x: number; + y: number; +} +``` + +### Size + +```ts +interface Size { + w: number; + h: number; +} +``` diff --git a/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/tutorials/_category_.json b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/tutorials/_category_.json new file mode 100644 index 000000000..dfac1d175 --- /dev/null +++ b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/tutorials/_category_.json @@ -0,0 +1,4 @@ +{ + "label": "Tutorials", + "position": 70 +} diff --git a/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/tutorials/dogsapi.mdx b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/tutorials/dogsapi.mdx new file mode 100644 index 000000000..f4845fdbe --- /dev/null +++ b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/tutorials/dogsapi.mdx @@ -0,0 +1,243 @@ +--- +sidebar_position: 20 +--- + +# Dogs API + +
+ +
+ +
+ +:::note This tutorial has been kindly provided by [@tatadan](https://twitter.com/tatadan) and forms part of their [Wails Examples Repository](https://github.com/tataDan/wails-v2-examples). ::: + +In this tutorial we are going to develop an application that retrieves photos of dogs from the web and then displays them. + +### Create the project + +Let's create the application. From a terminal enter: `wails init -n dogs-api -t svelte` + +Note: We could optionally add `-ide vscode` or `-ide goland` to the end of this command if you wanted to add IDE support. + +Now let's `cd dogs-api` and start editing the project files. + +### Remove unused code + +We will start by removing some elements that we know we will not use: + +- Open `app.go` and remove the following lines: + +```go +// Greet returns a greeting for the given name +func (a *App) Greet(name string) string { + return fmt.Sprintf("Hello %s, It's show time!", name) +} +``` + +- Open `frontend/src/App.svelte` and delete all lines. +- Delete the `frontend/src/assets/images/logo-universal.png` file + +### Creating our application + +Now let's add our new Go code. + +Add the following struct declarations to `app.go` before the function definitions: + +```go +type RandomImage struct { + Message string + Status string +} + +type AllBreeds struct { + Message map[string]map[string][]string + Status string +} + +type ImagesByBreed struct { + Message []string + Status string +} +``` + +Add the following functions to `app.go` (perhaps after the existing function definitions): + +```go +func (a *App) GetRandomImageUrl() string { + response, err := http.Get("https://dog.ceo/api/breeds/image/random") + if err != nil { + log.Fatal(err) + } + + responseData, err := ioutil.ReadAll(response.Body) + if err != nil { + log.Fatal(err) + } + + var data RandomImage + json.Unmarshal(responseData, &data) + + return data.Message +} + +func (a *App) GetBreedList() []string { + var breeds []string + + response, err := http.Get("https://dog.ceo/api/breeds/list/all") + if err != nil { + log.Fatal(err) + } + + responseData, err := ioutil.ReadAll(response.Body) + if err != nil { + log.Fatal(err) + } + + var data AllBreeds + json.Unmarshal(responseData, &data) + + for k := range data.Message { + breeds = append(breeds, k) + } + + sort.Strings(breeds) + + return breeds +} + +func (a *App) GetImageUrlsByBreed(breed string) []string { + + url := fmt.Sprintf("%s%s%s%s", "https://dog.ceo/api/", "breed/", breed, "/images") + response, err := http.Get(url) + if err != nil { + log.Fatal(err) + } + + responseData, err := ioutil.ReadAll(response.Body) + if err != nil { + log.Fatal(err) + } + + var data ImagesByBreed + json.Unmarshal(responseData, &data) + + return data.Message +} +``` + +Modify the `import` section of `app.go` to look like this: + +```go +import ( + "context" + "fmt" + "encoding/json" + "io/ioutil" + "log" + "net/http" + "sort" +) +``` + +Add the following lines to `frontend/src/App.svelte`: + +```html + + +

Dogs API

+
+ + Click on down arrow to select a breed + + +
+
+{#if showRandomPhoto} + No dog found +{/if} +{#if showBreedPhotos} + {#each photos as photo} + No dog found + {/each} +{/if} + + +``` + +### Testing the application + +To generate the bindings and test the application, run `wails dev`. + +### Compiling the application + +To compile the application to a single, production grade binary, run `wails build`. + + + + + diff --git a/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/tutorials/helloworld.mdx b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/tutorials/helloworld.mdx new file mode 100644 index 000000000..d1b8e9f98 --- /dev/null +++ b/website/i18n/ja/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/tutorials/helloworld.mdx @@ -0,0 +1,118 @@ +--- +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: + +
+ +
+ +
+ +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: + +
+ +
+
diff --git a/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-beta.44.json b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-beta.44.json new file mode 100644 index 000000000..9702534ef --- /dev/null +++ b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-beta.44.json @@ -0,0 +1,38 @@ +{ + "version.label": { + "message": "v2.0.0-beta.44", + "description": "The label for version v2.0.0-beta.44" + }, + "sidebar.tutorialSidebar.category.Getting Started": { + "message": "시작하기", + "description": "The label for category Getting Started in sidebar tutorialSidebar" + }, + "sidebar.tutorialSidebar.category.Reference": { + "message": "참조", + "description": "The label for category Reference in sidebar tutorialSidebar" + }, + "sidebar.tutorialSidebar.category.Runtime": { + "message": "런타임", + "description": "The label for category Runtime in sidebar tutorialSidebar" + }, + "sidebar.tutorialSidebar.category.Community": { + "message": "커뮤니티", + "description": "The label for category Community in sidebar tutorialSidebar" + }, + "sidebar.tutorialSidebar.category.Showcase": { + "message": "쇼케이스", + "description": "The label for category Showcase in sidebar tutorialSidebar" + }, + "sidebar.tutorialSidebar.category.Guides": { + "message": "가이드", + "description": "The label for category Guides in sidebar tutorialSidebar" + }, + "sidebar.tutorialSidebar.category.Tutorials": { + "message": "Tutorials", + "description": "The label for category Tutorials in sidebar tutorialSidebar" + }, + "sidebar.tutorialSidebar.category.Contributing": { + "message": "Contributing", + "description": "The label for category Contributing in sidebar tutorialSidebar" + } +} diff --git a/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1.json b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1.json new file mode 100644 index 000000000..49cf4687e --- /dev/null +++ b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1.json @@ -0,0 +1,38 @@ +{ + "version.label": { + "message": "v2.0.0-rc.1", + "description": "The label for version v2.0.0-rc.1" + }, + "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" + } +} diff --git a/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/appendix/_category_.json b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/appendix/_category_.json new file mode 100644 index 000000000..83af4ca28 --- /dev/null +++ b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/appendix/_category_.json @@ -0,0 +1,4 @@ +{ + "label": "Appendix", + "position": 70 +} diff --git a/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/_category_.json b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/_category_.json new file mode 100644 index 000000000..524986e1e --- /dev/null +++ b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/_category_.json @@ -0,0 +1,4 @@ +{ + "label": "Community", + "position": 50 +} diff --git a/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/links.mdx b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/links.mdx new file mode 100644 index 000000000..4a3a89e87 --- /dev/null +++ b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/links.mdx @@ -0,0 +1,23 @@ +--- +sidebar_position: 2 +--- + +# Links + +This page serves as a list for community related links. Please submit a PR (click `Edit this page` at the bottom) to submit links. + +## Awesome Wails + +The [definitive list](https://github.com/wailsapp/awesome-wails) of links related to Wails. + +## Support Channels + +- [Gophers Slack Channel](https://gophers.slack.com/messages/CJ4P9F7MZ/) +- [Gophers Slack Channel Invite](https://invite.slack.golangbridge.org/) +- [Github Issues](https://github.com/wailsapp/wails/issues) +- [v2 Beta Discussion Board](https://github.com/wailsapp/wails/discussions/828) + +## Social Media + +- [Twitter](https://twitter.com/wailsapp) +- [Wails Chinese Community QQ Group](https://qm.qq.com/cgi-bin/qm/qr?k=PmIURne5hFGNd7QWzW5qd6FV-INEjNJv&jump_from=webapi) - Group number: 1067173054 diff --git a/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/_category_.json b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/_category_.json new file mode 100644 index 000000000..276e283b7 --- /dev/null +++ b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/_category_.json @@ -0,0 +1,4 @@ +{ + "label": "Showcase", + "position": 1 +} diff --git a/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/emailit.mdx b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/emailit.mdx new file mode 100644 index 000000000..4a1ebe835 --- /dev/null +++ b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/emailit.mdx @@ -0,0 +1,8 @@ +# EmailIt + +

+ +
+

+ +[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 builtin [Node-Red](https://nodered.org/) server, scripts terminal, and the [ScriptBar](https://github.com/raguay/ScriptBarApp) program for displaying results from Node-Red or a script on your system. Documentation is very scarce, but the programs works. It’s built using Wails2 and Svelte, and the download is a universal macOS application. diff --git a/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/encrypteasy.mdx b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/encrypteasy.mdx new file mode 100644 index 000000000..13c2d8345 --- /dev/null +++ b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/encrypteasy.mdx @@ -0,0 +1,10 @@ +# EncryptEasy + +

+ +
+

+ +**[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. diff --git a/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/filehound.mdx b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/filehound.mdx new file mode 100644 index 000000000..78cbfca86 --- /dev/null +++ b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/filehound.mdx @@ -0,0 +1,14 @@ +# FileHound Export Utility + +

+ +
+

+ +[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 diff --git a/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/minecraftupdater.mdx b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/minecraftupdater.mdx new file mode 100644 index 000000000..11247339d --- /dev/null +++ b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/minecraftupdater.mdx @@ -0,0 +1,10 @@ +# Minecraft Updater + +

+ +
+

+ +[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. diff --git a/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/modalfilemanager.mdx b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/modalfilemanager.mdx new file mode 100644 index 000000000..a7ae8c492 --- /dev/null +++ b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/modalfilemanager.mdx @@ -0,0 +1,12 @@ +# Modal File Manager + +

+ +
+

+ +[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. 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. diff --git a/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/mollywallet.mdx b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/mollywallet.mdx new file mode 100644 index 000000000..534b097ca --- /dev/null +++ b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/mollywallet.mdx @@ -0,0 +1,8 @@ +# Molley Wallet + +

+ +
+

+ +[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. diff --git a/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/october.mdx b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/october.mdx new file mode 100644 index 000000000..889d2dd9e --- /dev/null +++ b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/october.mdx @@ -0,0 +1,12 @@ +# October + +

+ +
+

+ +[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. diff --git a/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/optimus.mdx b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/optimus.mdx new file mode 100644 index 000000000..c3eb79507 --- /dev/null +++ b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/optimus.mdx @@ -0,0 +1,8 @@ +# Optimus + +

+ +
+

+ +[Optimus](https://github.com/splode/optimus) is a desktop image optimization application. It supports conversion and compression between WebP, JPEG, and PNG image formats. diff --git a/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/portfall.mdx b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/portfall.mdx new file mode 100644 index 000000000..4cc2c63c9 --- /dev/null +++ b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/portfall.mdx @@ -0,0 +1,8 @@ +# Portfall + +

+ +
+

+ +[Portfall](https://github.com/rekon-oss/portfall) - A desktop k8s port-forwarding portal for easy access to all your cluster UIs diff --git a/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/restic-browser.mdx b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/restic-browser.mdx new file mode 100644 index 000000000..1505ce07a --- /dev/null +++ b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/restic-browser.mdx @@ -0,0 +1,10 @@ +# Restic Browser + +

+ +
+

+ +[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. diff --git a/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/riftshare.mdx b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/riftshare.mdx new file mode 100644 index 000000000..5223e88cf --- /dev/null +++ b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/riftshare.mdx @@ -0,0 +1,19 @@ +# RiftShare + +

+ +
+

+ +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! diff --git a/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/scriptbar.mdx b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/scriptbar.mdx new file mode 100644 index 000000000..aaa556f92 --- /dev/null +++ b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/scriptbar.mdx @@ -0,0 +1,8 @@ +# ScriptBar + +

+ +
+

+ +[ScriptBar](https://GitHub.com/raguay/ScriptBarApp) is a program to show the output of the embedded [Node-Red](https://nodered.org) server in the [EmailIt](https://GitHub.com/raguay/EmailIt) application. 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. diff --git a/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/surge.mdx b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/surge.mdx new file mode 100644 index 000000000..2d895dc29 --- /dev/null +++ b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/surge.mdx @@ -0,0 +1,8 @@ +# Surge + +

+ +
+

+ +[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. diff --git a/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/wally.mdx b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/wally.mdx new file mode 100644 index 000000000..2a2498f40 --- /dev/null +++ b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/wally.mdx @@ -0,0 +1,8 @@ +# Wally + +

+ +
+

+ +[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. diff --git a/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/wombat.mdx b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/wombat.mdx new file mode 100644 index 000000000..54cedacea --- /dev/null +++ b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/wombat.mdx @@ -0,0 +1,8 @@ +# Wombat + +

+ +
+

+ +[Wombat](https://github.com/rogchap/wombat) is a cross platform gRPC client. diff --git a/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/ytd.mdx b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/ytd.mdx new file mode 100644 index 000000000..178ff0529 --- /dev/null +++ b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/ytd.mdx @@ -0,0 +1,8 @@ +# Ytd + +

+ +
+

+ +[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. diff --git a/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/templates.mdx b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/templates.mdx new file mode 100644 index 000000000..d9a29a6fa --- /dev/null +++ b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/templates.mdx @@ -0,0 +1,52 @@ +--- +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) - A template using Vite,Vue and Vue-Router(Support both JavaScript and TypeScript) +- [wails-vite-vue-ts](https://github.com/codydbentley/wails-vite-vue-ts) - Vue 3 TypeScript with Vite (and instructions to add features) +- [wails-vite-vue-the-works](https://github.com/codydbentley/wails-vite-vue-the-works) - Vue 3 TypeScript with Vite, Vuex, Vue Router, Sass, and ESLint + Prettier + +## Angular + +- [wails-angular-template](https://github.com/TAINCER/wails-angular-template) - Angular with TypeScript, Sass, Hot-Reload, Code-Splitting and i18n + +## React + +- [wails-react-template](https://github.com/AlienRecall/wails-react-template) - A template using reactjs +- [wails-react-template](https://github.com/flin7/wails-react-template) - A minimal template for React that supports live development +- [wails-template-nextjs](https://github.com/LGiki/wails-template-nextjs) - A template using Next.js and TypeScript + +## Svelte + +- [wails-svelte-template](https://github.com/raitonoberu/wails-svelte-template) - A template using Svelte +- [wails-vite-svelte-template](https://github.com/BillBuilt/wails-vite-svelte-template) - A template using Svelte and Vite +- [wails-vite-svelte-tailwind-template](https://github.com/BillBuilt/wails-vite-svelte-tailwind-template) - A template using Svelte and Vite with TailwindCSS v3 +- [wails-sveltekit-template](https://github.com/h8gi/wails-sveltekit-template) - A template using SvelteKit + +## 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: + +## 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 \ No newline at end of file diff --git a/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/contributing/_category_.json b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/contributing/_category_.json new file mode 100644 index 000000000..fad21931a --- /dev/null +++ b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/contributing/_category_.json @@ -0,0 +1,4 @@ +{ + "label": "Contributing", + "position": 99 +} diff --git a/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/contributing/developing-new-features.mdx b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/contributing/developing-new-features.mdx new file mode 100644 index 000000000..57c5b101b --- /dev/null +++ b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/contributing/developing-new-features.mdx @@ -0,0 +1,29 @@ +--- +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/_` +- 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. +::: diff --git a/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/contributing/documenting.mdx b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/contributing/documenting.mdx new file mode 100644 index 000000000..06f33914b --- /dev/null +++ b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/contributing/documenting.mdx @@ -0,0 +1,34 @@ +--- +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. + +## Languages + +The default documents of the Wails project are English documents. We use the "crowdin" tool to translate documents in other languages and synchronize them to the website. You can [join our project](https://crowdin.com/project/wails) and submit your translations to make contributions. + +### Add new language + +If you want to add a new language to the documentation, please follow the prompts to [fill in and submit an Issue](https://github.com/wailsapp/wails/issues/new?assignees=&labels=documentation&template=documentation.yml). After being confirmed by the maintainer, we will add the language to the "crowdin" and you will then be able to submit your translation. diff --git a/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/contributing/fixing-bugs.mdx b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/contributing/fixing-bugs.mdx new file mode 100644 index 000000000..51bd90b74 --- /dev/null +++ b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/contributing/fixing-bugs.mdx @@ -0,0 +1,27 @@ +--- +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/_` +- 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. +::: diff --git a/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/contributing/helping-others.mdx b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/contributing/helping-others.mdx new file mode 100644 index 000000000..933c06b35 --- /dev/null +++ b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/contributing/helping-others.mdx @@ -0,0 +1,13 @@ +--- +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 +::: diff --git a/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/contributing/setting-up-a-dev-environment.mdx b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/contributing/setting-up-a-dev-environment.mdx new file mode 100644 index 000000000..b933af9a6 --- /dev/null +++ b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/contributing/setting-up-a-dev-environment.mdx @@ -0,0 +1,30 @@ +--- +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 => ` + +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` diff --git a/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/contributing/testing.mdx b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/contributing/testing.mdx new file mode 100644 index 000000000..e751dfc3e --- /dev/null +++ b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/contributing/testing.mdx @@ -0,0 +1,16 @@ +--- +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. diff --git a/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/contributing/ways-of-contributing.mdx b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/contributing/ways-of-contributing.mdx new file mode 100644 index 000000000..6b76d99d9 --- /dev/null +++ b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/contributing/ways-of-contributing.mdx @@ -0,0 +1,18 @@ +--- +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. diff --git a/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/gettingstarted/_category_.json b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/gettingstarted/_category_.json new file mode 100644 index 000000000..597b920df --- /dev/null +++ b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/gettingstarted/_category_.json @@ -0,0 +1,4 @@ +{ + "label": "Getting Started", + "position": 10 +} diff --git a/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/gettingstarted/building.mdx b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/gettingstarted/building.mdx new file mode 100644 index 000000000..a74c762d2 --- /dev/null +++ b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/gettingstarted/building.mdx @@ -0,0 +1,21 @@ +--- +sidebar_position: 6 +--- + +# 프로젝트 컴파일 + +프로젝트 디렉토리에서 `wails build`를 실행하세요. 이 작업은 프로젝트를 컴파일한 후 실행파일을 `build/bin` 디렉토리에 저장합니다. + +실행파일을 실행하면 아래와 같은 기본 애플리케이션을 볼 수 있습니다. + +
+ +
+ +
+ +컴파일 옵션에 대한 자세한 내용은 [CLI Reference](../reference/cli.mdx#build)를 참조하세요. diff --git a/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/gettingstarted/development.mdx b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/gettingstarted/development.mdx new file mode 100644 index 000000000..fc9387174 --- /dev/null +++ b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/gettingstarted/development.mdx @@ -0,0 +1,16 @@ +--- +sidebar_position: 5 +--- + +# 애플리케이션 개발 + +프로젝트 디렉토리에서 `wails dev`를 실행하여 개발 모드에서 애플리케이션을 실행할 수 있습니다. 이렇게 하면 다음과 같은 작업이 수행됩니다. + +- 애플리케이션 빌드 및 실행 +- Go 코드를 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 + +시작하려면 프로젝트 디렉토리에서 `wails dev`를 실행하세요. 더 자세한 정보는 [여기](../reference/cli.mdx#dev)에서 찾을 수 있습니다. + +Coming soon: Tutorial diff --git a/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/gettingstarted/firstproject.mdx b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/gettingstarted/firstproject.mdx new file mode 100644 index 000000000..9348ea0a2 --- /dev/null +++ b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/gettingstarted/firstproject.mdx @@ -0,0 +1,132 @@ +--- +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: + + + +import Tabs from "@theme/Tabs"; +import TabItem from "@theme/TabItem"; + + + + Generate a Svelte project using Javascript with:

+ + wails init -n myproject -t svelte + +If you would rather use Typescript:
+ + wails init -n myproject -t svelte-ts + + + + Generate a React project using Javascript with:

+ + wails init -n myproject -t react + +If you would rather use Typescript:
+ + wails init -n myproject -t react-ts + + + + Generate a Vue project using Javascript with:

+ + wails init -n myproject -t vue + +If you would rather use Typescript:
+ + wails init -n myproject -t vue-ts + + + + Generate a Preact project using Javascript with:

+ + wails init -n myproject -t preact + +If you would rather use Typescript:
+ + wails init -n myproject -t preact-ts + + + + Generate a Lit project using Javascript with:

+ + wails init -n myproject -t lit + +If you would rather use Typescript:
+ + wails init -n myproject -t lit-ts + + + + Generate a Vanilla project using Javascript with:

+ + wails init -n myproject -t vanilla + +If you would rather use Typescript:
+ + wails init -n myproject -t vanilla-ts + + + + + + +
+ +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. + +The default module name in `go.mod` is "changeme". You should change this to something more appropriate. diff --git a/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/gettingstarted/installation.mdx b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/gettingstarted/installation.mdx new file mode 100644 index 000000000..1d702d6cc --- /dev/null +++ b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/gettingstarted/installation.mdx @@ -0,0 +1,95 @@ +--- +sidebar_position: 1 +--- + +# 설치하기 + +## 지원되는 플랫폼 + +- Windows 10/11 AMD64/ARM64 +- MacOS 10.13+ AMD64 +- MacOS 11.0+ ARM64 +- Linux AMD64/ARM64 + +## 의존성 + +Wails는 설치 전에 아래와 같은 몇 가지 공통적인 의존성이 필요합니다. + +- Go 1.17+ +- NPM (Node 15+) + +### Go + +[Go 다운로드 페이지](https://go.dev/doc/install)에서 Go를 다운로드 합니다. + +공식 [Go 설치 지침](https://go.dev/doc/install)에 따라 진행하세요. 또한 `PATH` 환경변수에 `~/go/bin` 디렉토리 경로가 포함되어 있는지 확인해야 합니다. 터미널을 다시 시작하고 아래 내용을 확인하세요. + +- Go 설치 확인: `go version` +- PATH 변수에 "~/go/bin" 확인: `echo $PATH | grep go/bin` + +### NPM + +[Node 다운로드 페이지](https://nodejs.org/en/download/)에서 NPM을 다운로드 합니다. 우리는 일반적으로 최신 버전에서 테스트를 진행하기 때문에 최신 버전 사용을 권장합니다. + +정상적으로 설치된 것을 확인하기 위해 `npm --version`을 실행합니다. + +## 플랫폼에 따른 의존성 + +아래와 같이 플랫폼별 의존성이 있습니다. + + + +import Tabs from "@theme/Tabs"; +import TabItem from "@theme/TabItem"; + + + + Wails를 사용하려면 xcode 명령어 라인 도구가 설치되어 있어야 합니다. This can be + done by running:
+ xcode-select --install + + + Wails requires that the{" "} + + WebView2 + {" "} + runtime is installed. Some Windows installations will already have this + installed. You can check using the wails doctor command (see + below). + + + 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. + + + + + +## 선택 설치 + +- [UPX](https://upx.github.io/)는 어플리케이션 압축에 필요합니다. + +## Wails 설치 + +`go install github.com/wailsapp/wails/v2/cmd/wails@latest`을 실행하여 Wails CLI를 설치합니다. + +## 시스템 점검 + +`wails doctor`를 실행하면 의존성이 올바르게 설치되어 있는지 점검할 수 있습니다. 문제가 있는 의존성에 대해서는 문제 해결을 위한 도움을 줄 수 있습니다. + +## `wails` 명령어를 찾을 수 없나요? + +시스템에서 `wails` 명령어를 찾을 수 없는 경우 Go 설치 지침을 잘 따라했는지 확인해보세요. 대부분 사용자 홈 디렉토리에 있는 `go/bin` 디렉토리가 `PATH` 환경변수에 존재하지 않는 경우입니다. 또한 변경사항이 명령 프롬프트에 반영되도록 일반적으로 열려 있는 모든 명령 프롬프트를 닫았다가 다시 열어야 합니다. diff --git a/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/_category_.json b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/_category_.json new file mode 100644 index 000000000..5935dad93 --- /dev/null +++ b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/_category_.json @@ -0,0 +1,4 @@ +{ + "label": "Guides", + "position": 50 +} diff --git a/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/application-development.mdx b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/application-development.mdx new file mode 100644 index 000000000..a618076f1 --- /dev/null +++ b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/application-development.mdx @@ -0,0 +1,194 @@ +# 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) + } +} +``` + +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 specifiy `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/). For [create-react-app](https://create-react-app.dev/), it's possible to use [this script](https://gist.github.com/int128/e0cdec598c5b3db728ff35758abdbafd) to achieve a similar result. + +## Go Module + +The default Wails templates generate a `go.mod` file that contains the module name "changeme". You should change this to something more appropriate after project generation. diff --git a/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/bleeding-edge.mdx b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/bleeding-edge.mdx new file mode 100644 index 000000000..b81cc79dc --- /dev/null +++ b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/bleeding-edge.mdx @@ -0,0 +1,55 @@ +# Bleeding Edge + +## Overview + +Wails is in constant development and new releases are regularly "tagged". This usually happens when all the newer code on `master` has been tested and confirmed working. If you need a bugfix or feature that has not yet made it to a release, it's possible to use the latest "bleeding edge" version using the following steps: + +- `git clone https://github.com/wailsapp/wails` +- `cd wails/v2/cmd/wails` +- `go install` + +NOTE: The directory that you cloned the project into will now be called "clonedir". + +The Wails CLI will now be at the very latest version. + +### 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 => ` + +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. diff --git a/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/dynamic-assets.mdx b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/dynamic-assets.mdx new file mode 100644 index 000000000..4b68aef22 --- /dev/null +++ b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/dynamic-assets.mdx @@ -0,0 +1,126 @@ +# 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: 255}, + 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: + +

+ +

+ +However, if we request `go.mod`, we will see the following output: + +

+ +

+ +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 + +``` + +with: + +```html + +``` + +Then we would see the following: + +

+ +

+ +:::warning +Exposing your filesystem in this way is a security risk. It is recommended that you properly manage access +to your filesystem. +::: diff --git a/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/frameless.mdx b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/frameless.mdx new file mode 100644 index 000000000..4ae507f03 --- /dev/null +++ b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/frameless.mdx @@ -0,0 +1,84 @@ +# 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 + + + + + + + +
+ + +
+
+ + + + +``` + +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" +) + +//go:embed 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, + Assets: assets, + Frameless: true, + CSSDragProperty: "widows", + CSSDragValue: "1", + Bind: []interface{}{ + app, + }, + }) + + if err != nil { + println("Error:", err) + } +} +``` + +```html title=index.html + + + + + + alwaysontop + + +
+ + + + +``` + +:::info Fullscreen +If you allow your application to go fullscreen, this drag functionality will be disabled. +::: diff --git a/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/frontend.mdx b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/frontend.mdx new file mode 100644 index 000000000..ac087ee45 --- /dev/null +++ b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/frontend.mdx @@ -0,0 +1,72 @@ +# Frontend + +## Script Injection + +When Wails serves your `index.html`, by default, it will inject 2 script entries into the `` 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 + + + injection example + + + + + + + +
Please enter your name below 👇
+
+ + +
+ + + + +``` + +### Overriding Default Script Injection + +To provide more flexibility to developers, there is a meta tag that may be used to customise this behaviour: + +```html + +``` + +The options are as follows: + +| Value | Description | +| ------------------- | ------------------------------------------------ | +| noautoinjectruntime | Disable the autoinjection of `/wails/runtime.js` | +| noautoinjectipc | Disable the autoinjection of `/wails/ipc.js` | +| noautoinject | Disable all autoinjection of scripts | + +Multiple options may be used provided they are comma seperated. + +This code is perfectly valid and operates the same as the autoinjection version: + +```html + + + injection example + + + + + + +
Please enter your name below 👇
+
+ + +
+ + + + + + +``` diff --git a/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/ides.mdx b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/ides.mdx new file mode 100644 index 000000000..5423ea495 --- /dev/null +++ b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/ides.mdx @@ -0,0 +1,125 @@ +# IDEs + +Wails aims to provide a great development experience. To that aim, we now support generating IDE specific configuration to provide smoother project setup. + +Currently, we support [Visual Studio Code](https://code.visualstudio.com/) but aim to support other IDEs such as Goland. + +## Visual Studio Code + +

+ +

+ +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. + +::: diff --git a/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/linux-distro-support.mdx b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/linux-distro-support.mdx new file mode 100644 index 000000000..28a224a26 --- /dev/null +++ b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/linux-distro-support.mdx @@ -0,0 +1,101 @@ +# 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 `.go`, where `` 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! +::: diff --git a/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/linux.mdx b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/linux.mdx new file mode 100644 index 000000000..229c282bf --- /dev/null +++ b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/linux.mdx @@ -0,0 +1,18 @@ +# 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) diff --git a/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/manual-builds.mdx b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/manual-builds.mdx new file mode 100644 index 000000000..dcf192d33 --- /dev/null +++ b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/manual-builds.mdx @@ -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/.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. diff --git a/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/migrating.mdx b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/migrating.mdx new file mode 100644 index 000000000..a2f0c4a04 --- /dev/null +++ b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/migrating.mdx @@ -0,0 +1,187 @@ +# 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, + 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 the 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 frontend/dist +var assets embed.FS + +func main() { + err := wails.Run(&options.App{ + /* Other Options */ + Assets: assets, + }) +} +``` + +Of course, bundlers can be used if you wish to. The only requirement is to pass the final application assets directory to Wails using an `embed.FS` in the `Assets` key of the [application options](../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: + +

+ +| 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/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/mouse-buttons.mdx b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/mouse-buttons.mdx new file mode 100644 index 000000000..4a3de2a61 --- /dev/null +++ b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/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/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/overscroll.mdx b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/overscroll.mdx new file mode 100644 index 000000000..dca7e83a3 --- /dev/null +++ b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/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/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/routing.mdx b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/routing.mdx new file mode 100644 index 000000000..c35cc1c8a --- /dev/null +++ b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/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( + + {/* The rest of your app goes here */} + + } exact /> + } /> + } /> + {/* more... */} + + , + root +); +``` diff --git a/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/signing.mdx b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/signing.mdx new file mode 100644 index 000000000..e615269dd --- /dev/null +++ b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/signing.mdx @@ -0,0 +1,379 @@ +# 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. + +- 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/* + jobs: + package: + strategy: + matrix: + platform: [windows-latest, macos-latest] + go-version: [1.18] + runs-on: ${{ matrix.platform }} + steps: + - uses: actions/checkout@v2 + - 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. +``` + +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. Now you need to make two action secrets on GitHub. It should start with _-----BEGIN CERTIFICATE-----_ and end with _-----END CERTIFICATE-----_. 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 /t /f certificate\certificate.pfx /p '${{ secrets.WIN_SIGNING_CERT_PASSWORD }}' + +``` + +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@v2 + - 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@v2 + - 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. + jobs: + package: + strategy: + matrix: + platform: [windows-latest, macos-latest] + go-version: [1.18] + runs-on: ${{ matrix.platform }} + steps: + - uses: actions/checkout@v2 + - 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. +``` + +For code signing on macOS, [gon](https://github.com/mitchellh/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 mitchellh/gon/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": "@env:APPLE_PASSWORD" + }, + "sign": { + "application_identity": "Developer ID Application: My Name" + } +} +``` + +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 +``` + +2. entitlements.plist: + +```plist + + + + + com.apple.security.app-sandbox + + com.apple.security.network.client + + com.apple.security.network.server + + com.apple.security.files.user-selected.read-write + + com.apple.security.files.downloads.read-write + + + +``` + +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 + + + CFBundlePackageTypeAPPL + CFBundleNameMyApp + CFBundleExecutableapp + CFBundleIdentifierapp.myapp + CFBundleVersion0.1.0 + CFBundleGetInfoStringMy app is cool and nice and chill and + CFBundleShortVersionString0.1.0 + CFBundleIconFileiconfile + LSMinimumSystemVersion10.13.0 + NSHighResolutionCapabletrue + LSApplicationCategoryTypepublic.app-category.utilities + NSHumanReadableCopyright© Me + +``` + +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@v2 + - 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. + jobs: + package: + strategy: + matrix: + platform: [windows-latest, macos-latest] + go-version: [1.18] + runs-on: ${{ matrix.platform }} + steps: + - uses: actions/checkout@v2 + - 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 mitchellh/gon/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. +``` + +# 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). diff --git a/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/templates.mdx b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/templates.mdx new file mode 100644 index 000000000..df75cbbc7 --- /dev/null +++ b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/templates.mdx @@ -0,0 +1,95 @@ +# Templates + +Wails generates projects from pre-created templates. In v1, this was a difficult to maintain set of projects that were subject to going out of date. In v2, to empower the community, a couple of new features have been added for templates: + +- Ability to generate projects from [Remote Templates](../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: + +
+ +
+ +## 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 diff --git a/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/troubleshooting.mdx b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/troubleshooting.mdx new file mode 100644 index 000000000..4de561c08 --- /dev/null +++ b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/troubleshooting.mdx @@ -0,0 +1,142 @@ +# 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 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 +NSAppTransportSecurity + + NSAllowsLocalNetworking + + +``` + +Reference: https://github.com/wailsapp/wails/issues/1504#issuecomment-1174317433 + +## Mac application not valid + +If your built application looks like this in finder: + +

+ +

+ +it's likely that your application's `info.plist` is invalid. Update the file in `build/.app/Contents/info.plist` and check if the data is valid, EG check the binary name is correct. To persist the changes, copy the file back to the `build/darwin` directory. + +## Cannot call backend method from frontend with variadic arguments + +If you have a backend method defined with variadic parameters, eg: + +```go +func (a *App) TestFunc(msg string, args ...interface{}) error { + // Code +} +``` + +calling this method from the frontend like this will fail: + +```js +var msg = "Hello: "; +var args = ["Go", "JS"]; +window.go.main.App.TestFunc(msg, ...args) + .then((result) => { + //do things here + }) + .catch((error) => { + //handle error + }); +``` + +Workaround: + +```js +var msg = "Hello "; +var args = ["Go", "JS"]; +window.go.main.App.TestFunc(msg, args) + .then((result) => { + //without the 3 dots + //do things here + }) + .catch((error) => { + //handle error + }); +``` + +Credit: https://github.com/wailsapp/wails/issues/1186 + +## I'm having getting proxy errors when trying to install Wails + +If you are getting errors like this: + +``` +"https://proxy.golang.org/github.com/wailsapp/wails/cmd/wails/@v/list": dial tcp 172.217.163.49:443: connectex: A connection attempt failed because the connected party did not properly respond after a period of time, or established connection failed because connected host has failed to respond. +``` + +it's probably because the official Go Proxy is being blocked (Users in China have reported this). The solution is to set up the proxy manually, eg: + +``` +go env -w GO111MODULE=on +go env -w GOPROXY=https://goproxy.cn,direct +``` + +Source: https://github.com/wailsapp/wails/issues/1233 + +## 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 `` section of any new page you navigate to: + +```html + + + + +``` + +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. + +Source: https://github.com/wailsapp/wails/issues/1806 \ No newline at end of file diff --git a/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/vscode.mdx b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/vscode.mdx new file mode 100644 index 000000000..ed258656d --- /dev/null +++ b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/vscode.mdx @@ -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. diff --git a/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/windows-installer.mdx b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/windows-installer.mdx new file mode 100644 index 000000000..21de9a408 --- /dev/null +++ b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/windows-installer.mdx @@ -0,0 +1,56 @@ +# NSIS installer + +

+ +
+

+ +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. + +If you use the chocolatey package manager, run the following script: + +``` +choco install nsis +``` + +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. diff --git a/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/windows.mdx b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/windows.mdx new file mode 100644 index 000000000..821808c0b --- /dev/null +++ b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/windows.mdx @@ -0,0 +1,61 @@ +# 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. + +## 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). diff --git a/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/howdoesitwork.mdx b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/howdoesitwork.mdx new file mode 100644 index 000000000..f59873eca --- /dev/null +++ b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/howdoesitwork.mdx @@ -0,0 +1,355 @@ +--- +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. + +
+ +
+ +## The Main Application + +### Overview + +The main application consists of a single call to `wails.Run()`. It accepts the application configuration which describes the size of the application window, the window title, what assets to use, etc. A basic application might look like this: + +```go title="main.go" +package main + +import ( + "embed" + "log" + + "github.com/wailsapp/wails/v2" + "github.com/wailsapp/wails/v2/pkg/options" +) + +//go:embed frontend/dist +var assets embed.FS + +func main() { + + app := &App{} + + err := wails.Run(&options.App{ + Title: "Basic Demo", + Width: 1024, + Height: 768, + Assets: &assets, + OnStartup: app.startup, + OnShutdown: app.shutdown, + Bind: []interface{}{ + app, + }, + }) + if err != nil { + log.Fatal(err) + } +} + + +type App struct { + ctx context.Context +} + +func (b *App) startup(ctx context.Context) { + b.ctx = ctx +} + +func (b *App) shutdown(ctx context.Context) {} + +func (b *App) Greet(name string) string { + return fmt.Sprintf("Hello %s!", name) +} +``` + +### Options rundown + +This example has the following options set: + +- `Title` - The text that should appear in the window's title bar +- `Width` & `Height` - The dimensions of the window +- `Assets` - The application's frontend assets +- `OnStartup` - A callback for when the window is created and is about to start loading the frontend assets +- `OnShutdown` - A callback for when the application is about to quit +- `Bind` - A slice of struct instances that we wish to expose to the frontend + +A full list of application options can be found in the [Options Reference](reference/options). + +#### Assets + +The `Assets` option is mandatory as you can't have a Wails application without frontend assets. Those assets can be any files you would expect to find in a web application - html, js, css, svg, png, etc. **There is no requirement to generate asset bundles** - plain files will do. When the application starts, it will attempt to load `index.html` from your assets and the frontend will essentially work as a browser from that point on. It is worth noting that there is no requirement on where in the `embed.FS` the files live. It is likely that the embed path uses a nested directory relative to your main application code, such as `frontend/dist`: + +```go title="main.go" +//go:embed frontend/dist +var assets embed.FS +``` + +At startup, Wails will iterate the embedded files looking for the directory containing `index.html`. All other assets will be loaded relative to this directory. + +As production binaries use the files contained in `embed.FS`, there are no external files required to be shipped with the application. + +When running in development mode using the `wails dev` command, the assets are loaded off disk, and any changes result in a "live reload". The location of the assets will be inferred from the `embed.FS`. + +More details can be found in the [Application Development Guide](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 {16,24} title="main.go" +package main + +import ( + "embed" + "log" + + "github.com/wailsapp/wails/v2" + "github.com/wailsapp/wails/v2/pkg/options" +) + +//go:embed frontend/dist +var assets embed.FS + +func main() { + + app := &App{} + + err := wails.Run(&options.App{ + Title: "Basic Demo", + Width: 1024, + Height: 768, + Assets: &assets, + 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 {8-10} + //... + err := wails.Run(&options.App{ + Title: "Basic Demo", + Width: 1024, + Height: 768, + Assets: &assets, + Bind: []interface{}{ + app, + &mystruct1{}, + &mystruct2{}, + }, + }) + +``` + +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; +``` + +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. Note: If you wish to use structs, you **must** define `json` struct tags for your fields! + +:::info Note +Anonymous nested structs are not supported at this time. +::: + +It is 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; +``` + +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) { + 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). + +[^1]: There is a very small subset of libraries that use features unsupported in WebViews. There are often alternatives and workarounds for such cases. diff --git a/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/introduction.mdx b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/introduction.mdx new file mode 100644 index 000000000..4e65f932e --- /dev/null +++ b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/introduction.mdx @@ -0,0 +1,71 @@ +--- +sidebar_position: 1 +--- + +# 소개 + +Wails는 Go 및 웹 기술을 사용하여 데스크톱 앱을 작성할 수 있는 프로젝트입니다. + +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. + +### 기능 + +- 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://vite.net/) +- Powerful CLI to easily Create, Build and Package applications +- A rich [runtime library](/docs/next/reference/runtime) +- Applications built with Wails are Apple & Microsoft Store compliant + + +[varly](https://varly.app)는 Wails를 사용하여 작성된 MacOS & Windows용 데스크톱 애플리케이션입니다. 보기 좋을 뿐만 아니라 최신 네이티브 앱에서 바라는 기본 메뉴 구성과 반투명도를 사용합니다. + +

+ + + +

+ +### 빠른 시작 템플릿 + +Wails에는 애플리케이션을 빠르게 구성하고 실행할 수 있도록 미리 구성된 여러 템플릿이 함께 제공됩니다. Svelte, React, Vue, Preact, Lit, Vanilla와 같은 프레임워크 템플릿들이 있으며, 각 템플릿에는 Javascript와 Typescript 버전이 있습니다. + +### Native Elements + +Wails uses a purpose built library for handling native elements such as Window, Menus, Dialogs, etc, so you can build good-looking, feature rich desktop applications. + +**It does not embed a browser**, so it is resource efficient. Instead, it uses the native rendering engine for the platform. On Windows, this is the new Microsoft Webview2 library, built on Chromium. + +### Go & Javascript Interoperability + +Wails automatically makes your Go methods available to Javascript, so you can call them by name from your frontend! It even generates Typescript 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! diff --git a/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/_category_.json b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/_category_.json new file mode 100644 index 000000000..ebb337b83 --- /dev/null +++ b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/_category_.json @@ -0,0 +1,4 @@ +{ + "label": "Reference", + "position": 40 +} diff --git a/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/cli.mdx b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/cli.mdx new file mode 100644 index 000000000..5a00db158 --- /dev/null +++ b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/cli.mdx @@ -0,0 +1,221 @@ +--- +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 ` + +## init + +`wails init` is used for generating projects. + +| Flag | Description | Default | +|:------------------ |:----------------------------------------------------------------------------------------------------------------------- |:-------------------:| +| -n "project name" | Name of the project. **Mandatory**. | | +| -d "project dir" | Project directory to create | Name of the project | +| -g | Initialise git repository | | +| -l | List available project templates | | +| -q | Suppress output to console | | +| -t "template name" | The project template to use. This can be the name of a default template or a URL to a remote template hosted on github. | vanilla | +| -ide | Generate IDE project files | | +| -f | Force build application | false | + +Example: `wails init -n test -d mytestproject -g -ide vscode -q` + +This will generate a a project called "test" in the "mytestproject" directory, initialise git, generate vscode project files and do so silently. + +More information on using IDEs with Wails can be found [here](../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 | +|:-------------------- |:--------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |:--------------------------------------------------------------------------------------------------------------------------------------------------- | +| -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`.
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 | 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" | | +| -upxflags | Flags to pass to upx | | +| -v int | Verbosity level (0 - silent, 1 - default, 2 - verbose) | 1 | +| -webview2 | WebView2 installer strategy: download,embed,browser,error | download | +| -u | Updates your project's `go.mod` to use the same version of Wails as the CLI | | +| -debug | Retains debug information in the application. 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. + +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 UPX on Apple Silicon + +There are [issues](https://github.com/upx/upx/issues/446) with using UPX with Apple Silicon. + +::: + +:::info UPX on Windows + +Some Antivirus vendors false positively mark `upx` compressed binaries as virus, see [issue](https://github.com/upx/upx/issues/437). + +::: + +### Platforms + +Supported platforms are: + +| Platform | Description | +|:---------------- |:--------------------------------------------- | +| darwin | MacOS + architecture of build machine | +| darwin/amd64 | MacOS 10.13+ AMD64 | +| darwin/arm64 | MacOS 11.0+ ARM64 | +| darwin/universal | MacOS AMD64+ARM64 universal application | +| windows | Windows 10/11 + architecture of build machine | +| windows/amd64 | Windows 10/11 AMD64 | +| windows/arm64 | Windows 10/11 ARM64 | +| linux | Linux + architecture of build machine | +| linux/amd64 | Linux AMD64 | +| linux/arm64 | Linux ARM64 | + +## doctor + +`wails doctor` will run diagnostics to ensure that your system is ready for development. + +Example: + +``` +Wails CLI v2.0.0-beta + +Scanning system - Please wait (this may take a long time)...Done. + +System +------ +OS: Windows 10 Pro +Version: 2009 (Build: 19043) +ID: 21H1 +Go Version: go1.17 +Platform: windows +Architecture: amd64 + +Dependency Package Name Status Version +---------- ------------ ------ ------- +WebView2 N/A Installed 93.0.961.52 +npm N/A Installed 6.14.15 +*upx N/A Installed upx 3.96 + +* - Optional Dependency + +Diagnosis +--------- +Your system is ready for Wails development! + +``` + +## dev + +`wails dev` is used to run your application in a "live development" mode. This means: + +- The application's `go.mod` will be updated to use the same version of Wails as the CLI +- The application is compiled and run automatically +- A watcher is started and will trigger a rebuild of your dev app if it detects changes to your go files +- A webserver is started on `http://localhost:34115` which serves your application (not just frontend) over http. This allows you to use your favourite browser development extensions +- All application assets are loaded from disk. If they are changed, the application will automatically reload (not rebuild). All connected browsers will also reload +- A JS module is generated that provides the following: + - Javascript wrappers of your Go methods with autogenerated JSDoc, providing code hinting + - TypeScript versions of your Go structs, that can be constructed and passed to your go methods +- A second JS module is generated that provides a wrapper + TS declaration for the runtime + +| Flag | Description | Default | +|:---------------------------- |:----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |:--------------------- | +| -assetdir "./path/to/assets" | Serve assets from the given directory instead of using the provided asset FS | Value in `wails.json` | +| -browser | Opens a browser to `http://localhost:34115` on startup | | +| -compiler "compiler" | Use a different go compiler to build, eg go1.15beta1 | go | +| -e | Extensions to trigger rebuilds (comma separated) | go | +| -reloaddirs | Additional directories to trigger reloads (comma separated) | Value in `wails.json` | +| -ldflags "flags" | Additional ldflags to pass to the compiler | | +| -tags "extra tags" | Build tags to pass to compiler (quoted and space separated) | | +| -loglevel "loglevel" | Loglevel to use - Trace, Debug, Info, Warning, Error | Debug | +| -noreload | Disable automatic reload when assets change | | +| -nogen | Disable generate module | | +| -v | Verbosity level (0 - silent, 1 - standard, 2 - verbose) | 1 | +| -wailsjsdir | The directory to generate the generated Wails JS modules | Value in `wails.json` | +| -debounce | The time to wait for reload after an asset change is detected | 100 (milliseconds) | +| -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 | | +| -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: + +`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. + +## 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. diff --git a/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/menus.mdx b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/menus.mdx new file mode 100644 index 000000000..1f849f853 --- /dev/null +++ b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/menus.mdx @@ -0,0 +1,261 @@ +--- +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 + AppMenu := menu.NewMenu() + FileMenu := AppMenu.AddSubmenu("File") + FileMenu.AddText("&Open", keys.CmdOrCtrl("o"), openFile) + FileMenu.AddSeparator() + FileMenu.AddText("Quit", keys.CmdOrCtrl("q"), func(_ *menu.CallbackData) { + runtime.Quit() + }) + + if runtime.GOOS == "darwin" { + AppMenu.Append(menu.EditMenu()) // on macos platform, we should append EditMenu to enable Cmd+C,Cmd+V,Cmd+Z... shortcut + } + + err := wails.Run(&options.App{ + Title: "Menus Demo", + Width: 800, + Height: 600, + Menu: AppMenu, + 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` +- `tab` +- `return` +- `enter` +- `escape` +- `left` +- `right` +- `up` +- `down` +- `space` +- `delete` +- `home` +- `end` +- `page up` +- `page down` +- `f1` +- `f2` +- `f3` +- `f4` +- `f5` +- `f6` +- `f7` +- `f8` +- `f9` +- `f10` +- `f11` +- `f12` +- `f13` +- `f14` +- `f15` +- `f16` +- `f17` +- `f18` +- `f19` +- `f20` +- `f21` +- `f22` +- `f23` +- `f24` +- `f25` +- `f26` +- `f27` +- `f28` +- `f29` +- `f30` +- `f31` +- `f32` +- `f33` +- `f34` +- `f35` +- `numlock` + +Wails also supports parsing accelerators using the same syntax as Electron. This is useful for storing accelerators in config files. + +Example: + +```go title="Package: github.com/wailsapp/wails/v2/pkg/menu/keys" + // Defines cmd+o on Mac and ctrl-o on Window/Linux + myShortcut, err := keys.Parse("Ctrl+Option+A") +``` + +#### Modifier + +The following modifiers are keys that may be used in combination with the accelerator key: + +```go title="Package: github.com/wailsapp/wails/v2/pkg/menu/keys" +const ( + // CmdOrCtrlKey represents Command on Mac and Control on other platforms + CmdOrCtrlKey Modifier = "cmdorctrl" + // OptionOrAltKey represents Option on Mac and Alt on other platforms + OptionOrAltKey Modifier = "optionoralt" + // ShiftKey represents the shift key on all systems + ShiftKey Modifier = "shift" + // ControlKey represents the control key on all systems + ControlKey Modifier = "ctrl" +) +``` + +A number of helper methods are available to create Accelerators using modifiers: + +```go title="Package: github.com/wailsapp/wails/v2/pkg/menu/keys" +func CmdOrCtrl(key string) *Accelerator +func OptionOrAlt(key string) *Accelerator +func Shift(key string) *Accelerator +func Control(key string) *Accelerator +``` + +Modifiers can be combined using `keys.Combo(key string, modifier1 Modifier, modifier2 Modifier, rest ...Modifier)`: + +```go title="Package: github.com/wailsapp/wails/v2/pkg/menu/keys" + // Defines "Ctrl+Option+A" on Mac and "Ctrl+Alt+A" on Window/Linux + myShortcut := keys.Combo("a", ControlKey, OptionOrAltKey) +``` + +### Type + +Each menu item must have a type and there are 5 types available: + +```go title="Package: github.com/wailsapp/wails/v2/pkg/menu" +const ( + TextType Type = "Text" + SeparatorType Type = "Separator" + SubmenuType Type = "Submenu" + CheckboxType Type = "Checkbox" + RadioType Type = "Radio" +) +``` + +For convenience, helper methods are provided to quickly create a menu item: + +```go title="Package: github.com/wailsapp/wails/v2/pkg/menu" +func Text(label string, accelerator *keys.Accelerator, click Callback) *MenuItem +func Separator() *MenuItem +func Radio(label string, selected bool, accelerator *keys.Accelerator, click Callback) *MenuItem +func Checkbox(label string, checked bool, accelerator *keys.Accelerator, click Callback) *MenuItem +func SubMenu(label string, menu *Menu) *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()` | diff --git a/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/options.mdx b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/options.mdx new file mode 100644 index 000000000..7bafbc0fa --- /dev/null +++ b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/options.mdx @@ -0,0 +1,633 @@ +--- +sidebar_position: 3 +--- + +# Options + +## Application Options + +The `Options.App` struct contains the application configuration. It is passed to the `wails.Run()` method: + +```go title="Example" +import "github.com/wailsapp/wails/v2/pkg/options" + +func main() { + + err := wails.Run(&options.App{ + Title: "Menus Demo", + Width: 800, + Height: 600, + DisableResize: false, + Fullscreen: false, + Frameless: true, + MinWidth: 400, + MinHeight: 400, + MaxWidth: 1280, + MaxHeight: 1024, + StartHidden: false, + HideWindowOnClose: false, + BackgroundColour: &options.RGBA{R: 0, G: 0, B: 0, A: 255}, + AlwaysOnTop: false, + Assets: assets, + AssetsHandler: assetsHandler, + Menu: app.applicationMenu(), + Logger: nil, + LogLevel: logger.DEBUG, + LogLevelProduction: logger.ERROR, + OnStartup: app.startup, + OnDomReady: app.domready, + OnShutdown: app.shutdown, + OnBeforeClose: app.beforeClose, + WindowStartState: options.Maximised, + CSSDragProperty: "--wails-draggable", + CSSDragValue: "drag", + Bind: []interface{}{ + app, + }, + Windows: &windows.Options{ + WebviewIsTransparent: false, + WindowIsTranslucent: 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), + }, + // User messages that can be customised + Messages *windows.Messages + }, + Mac: &mac.Options{ + TitleBar: &mac.TitleBar{ + TitlebarAppearsTransparent: true, + HideTitle: false, + HideTitleBar: false, + FullSizeContent: false, + UseToolbar: false, + HideToolbarSeparator: true, + }, + Appearance: mac.NSAppearanceNameDarkAqua, + WebviewIsTransparent: true, + WindowIsTranslucent: false, + About: &mac.AboutInfo{ + Title: "My Application", + Message: "© 2021 Me", + Icon: icon, + }, + }, + Linux: &linux.Options{ + Icon: icon, + }, + }) + if err != nil { + log.Fatal(err) + } +} + +``` + +### Title + +The text shown in the window's title bar. + +Type: `string` + +### Width + +The initial width of the window. + +Type: `int`
Default: 1024. + +### Height + +The initial height of the window. + +Type: `int`
Default: 768 + +### DisableResize + +By default, the main window is resizable. Setting this to `true` will keep it a fixed size. + +Type: `bool` + +### Fullscreen + +Setting this to `true` will make the window fullscreen at startup. + +Type: `bool` + +### Frameless + +When set to `true`, the window will have no borders or title bar. Also see [Frameless Windows](../guides/frameless.mdx). + +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. + +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. + +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. + +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. + +Type: `int` + +### StartHidden + +When set to `true`, the application will be hidden until [WindowShow](../reference/runtime/window.mdx#windowshow) is called. + +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. + +Type: `bool` + +### BackgroundColour + +This value is the default background colour of the window. Example: options.NewRGBA(255,0,0,128) - Red at 50% transparency + +Type: `*options.RGBA`
Default: white + +### AlwaysOnTop + +Indicates that the window should stay above other windows when losing focus. + +Type: `bool` + +### Assets + +The frontend assets to be used by the application. Requires an `index.html` file. + +Type: `embed.FS` + +### AssetsHandler + + + +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. + +| Value | 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. + +Type: `http.Handler` + +### 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. +::: + +Type: `*menu.Menu` + +### Logger + +The logger to be used by the application. More details about logging in the [Log Reference](../reference/runtime/log.mdx). + +Type: `logger.Logger`
Default: Logs to Stdout + +### LogLevel + +The default log level. More details about logging in the [Log Reference](../reference/runtime/log.mdx). + +Type: `logger.LogLevel`
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). + +Type: `logger.LogLevel`
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. + +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. + +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. + +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{ + Title: "Quit?", + Message: "Are you sure you want to quit?", + + Type: ` runtime`.QuestionDialog, + + }) + + if err != nil { + return false + } + return dialog != "Yes" +} +``` + +Type: `func(ctx context.Context) bool` + +### WindowStartState + +Defines how the window should present itself at startup. + +| Value | Win | Mac | Lin | +| ---------- | --- | --- | --- | +| Fullscreen | ✅ | ✅ | ✅ | +| Maximised | ✅ | ✅ | ✅ | +| Minimised | ✅ | ❌ | ✅ | + +Type: `options.WindowStartState` + +### CSSDragProperty + +Indicates the CSS property to use to identify which elements can be used to drag the window. Default: `--wails-draggable`. + +Type: `string` + +### CSSDragValue + +Indicates what value the `CSSDragProperty` style should have to drag the window. Default: `drag`. + +Type: `string` + +### Bind + +A slice of struct instances defining methods that need to be bound to the frontend. + +Type: `[]interface{}` + +### Windows + +This defines [Windows specific options](#windows-specific-options). + +Type: `*windows.Options` + +### Mac + +This defines [Mac specific options](#mac-specific-options). + +Type: `*mac.Options` + +### Linux + +This defines [Linux specific options](#linux-specific-options). + +Type: `*linux.Options` + +## Windows Specific 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. + +Type: `bool` + +### WindowIsTranslucent + +Setting this to `true` will make the window background translucent. Often combined with [WebviewIsTransparent](#WebviewIsTransparent) to make frosty-looking applications. + +Type: `bool` + +### DisableWindowIcon + +Setting this to `true` will remove the icon in the top left corner of the title bar. + +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. + +Type: `bool` + +### WebviewUserDataPath + +This defines the path where the WebView2 stores the user data. If empty `%APPDATA%\[BinaryName.exe]` will be used. + +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) + +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 | + +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. + +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. + +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. + +Type: `uint16` + +### OnSuspend + +If set, this function will be called when windows initiates a switch to low power mode (suspend/hibernate) + +Type: `func()` + +### OnResume + +If set, this function will be called when windows resumes from low power mode (suspend/hibernate) + +Type: `func()` + +## Mac Specific Options + +### TitleBar + +The TitleBar struct provides the ability to configure the look and feel of the title bar. + +Type: [`*mac.TitleBar`](#titlebar-struct) + + +### 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. + +Type: [`AppearanceType`](#appearance-type) + +### 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. + +Type: `bool` + +### WindowIsTranslucent + +Setting this to `true` will make the window background translucent. Often combined with [WebviewIsTransparent](#WebviewIsTransparent) to make frosty-looking applications. + +Type: `bool` + +### 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. + +Type: [`About`](#about-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 type + +You can specify the application's [appearance](https://developer.apple.com/documentation/appkit/nsappearance?language=objc). + +| Value | Description | +| ----------------------------------------------------- | --------------------------------------------------------------- | +| DefaultAppearance | DefaultAppearance uses the default system value | +| NSAppearanceNameAqua | The standard light system appearance | +| NSAppearanceNameDarkAqua | The standard dark system appearance | +| NSAppearanceNameVibrantLight | The light vibrant appearance | +| NSAppearanceNameAccessibilityHighContrastAqua | A high-contrast version of the standard light system appearance | +| NSAppearanceNameAccessibilityHighContrastDarkAqua | A high-contrast version of the standard dark system appearance | +| NSAppearanceNameAccessibilityHighContrastVibrantLight | A high-contrast version of the light vibrant appearance | +| NSAppearanceNameAccessibilityHighContrastVibrantDark | A high-contrast version of the dark vibrant appearance | + +Example: + +```go +Mac: &mac.Options{ + Appearance: mac.NSAppearanceNameDarkAqua, +} +``` + +#### About struct + +```go +type AboutInfo struct { + Title string + Message string + Icon []byte +} +``` + +If these settings are provided, an "About" menu item will appear in the app menu (when using the `AppMenu` role). Given this configuration: + +```go +//go:embed build/appicon.png +var icon []byte + +func main() { + err := wails.Run(&options.App{ + ... + Mac: &mac.Options{ + About: &mac.AboutInfo{ + Title: "My Application", + Message: "© 2021 Me", + Icon: icon, + }, + }, + }) +``` + +The "About" menu item will appear in the app menu: + +
+ +
+ +
+ +When clicked, that will open an about message box: + +
+ +
+ +
+ +## Linux Specific Options + +### Icon + +Sets up the icon representing the window. This icon is used when the window is minimized (also known as iconified). + +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. diff --git a/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/project-config.mdx b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/project-config.mdx new file mode 100644 index 000000000..3dc1cf002 --- /dev/null +++ b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/project-config.mdx @@ -0,0 +1,51 @@ +--- +sidebar_position: 5 +--- + +# Project Config + +The project config resides in the `wails.json` file in the project directory. The structure of the config is: + +```json +{ + "name": "[The project name]", + "assetdir": "[Relative path to the directory containing the compiled assets, this is normally inferred and could be left empty]", + "reloaddirs": "[Additional directories to trigger reloads (comma separated), this is only used for some advanced asset configurations]", + "frontend:install": "[The command to install node dependencies, run in the frontend directory - often `npm install`]", + "frontend:build": "[The command to build the assets, run in the frontend directory - often `npm run build`]", + "frontend:dev": "[This command has been replaced by frontend:dev:build. If frontend:dev:build is not specified will falls back to this command. If this command is also not specified will falls back to frontend:build]", + "frontend:dev:build": "[This command is the dev equivalent of frontend:build. If not specified falls back to frontend:dev]", + "frontend:dev:install": "[This command is the dev equivalent of frontend:install. If not specified falls back to frontend:install]", + "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. 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]", + "debounceMS": 100, // The default time the dev server waits to reload when it detects a change in assets + "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.]", + "*/*": "[The command that will be executed after every build: ${platform} is replaced with the "GOOS/GOARCH" and ${bin} with the path to the compiled binary.]" + }, + "info": { // Data used to populate manifests and version info. + "companyName": "[The company name. Default: [The project name]]", + "productName": "[The product name. Default: [The project name]]", + "productVersion": "[The version of the product. Default: '1.0.0']", + "copyright": "[The copyright of the product. Default: 'Copyright.........']", + "comments": "[A short comment of the app. Default: 'Built using Wails (https://wails.app)']" + }, + "nsisType": "['multiple': One installer per architecture. 'single': Single universal installer for all architectures being built. Default: 'multiple']" +} +``` + +This file is read by the Wails CLI when running `wails build` or `wails dev`. + +The `assetdir`, `reloaddirs`, `wailsjsdir`, `debounceMS`, `devserver` and `frontenddevserverurl` flags in `wails build/dev` will update the project config and thus become defaults for subsequent runs. diff --git a/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/_category_.json b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/_category_.json new file mode 100644 index 000000000..ac6d55488 --- /dev/null +++ b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/_category_.json @@ -0,0 +1,4 @@ +{ + "label": "Runtime", + "position": 1 +} diff --git a/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/browser.mdx b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/browser.mdx new file mode 100644 index 000000000..976ca1d80 --- /dev/null +++ b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/browser.mdx @@ -0,0 +1,14 @@ +--- +sidebar_position: 7 +--- + +# Browser + +These methods are related to the system browser. + +### BrowserOpenURL + +Opens the given URL in the system browser. + +Go: `BrowserOpenURL(ctx context.Context, url string)`
JS: `BrowserOpenURL(url string)` + diff --git a/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/dialog.mdx b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/dialog.mdx new file mode 100644 index 000000000..ad65257ee --- /dev/null +++ b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/dialog.mdx @@ -0,0 +1,283 @@ +--- +sidebar_position: 5 +--- + +# Dialog + +This part of the runtime provides access to native dialogs, such as File Selectors and Message boxes. + +:::info Javascript +Dialog is currently unsupported in the JS runtime. +::: + +### OpenDirectoryDialog + +Opens a dialog that prompts the user to select a directory. Can be customised using [OpenDialogOptions](#opendialogoptions). + +Go: `OpenDirectoryDialog(ctx context.Context, dialogOptions OpenDialogOptions) (string, error)` + +Returns: Selected directory (blank if the user cancelled) or an error + +### OpenFileDialog + +Opens a dialog that prompts the user to select a file. Can be customised using [OpenDialogOptions](#opendialogoptions). + +Go: `OpenFileDialog(ctx context.Context, dialogOptions OpenDialogOptions) (string, error)` + +Returns: Selected file (blank if the user cancelled) or an error + +### OpenMultipleFilesDialog + +Opens a dialog that prompts the user to select multiple files. Can be customised using [OpenDialogOptions](#opendialogoptions). + +Go: `OpenMultipleFilesDialog(ctx context.Context, dialogOptions OpenDialogOptions) ([]string, error)` + +Returns: Selected files (nil if the user cancelled) or an error + +### SaveFileDialog + +Opens a dialog that prompts the user to select a filename for the purposes of saving. Can be customised using [SaveDialogOptions](#savedialogoptions). + +Go: `SaveFileDialog(ctx context.Context, dialogOptions SaveDialogOptions) (string, error)` + +Returns: The selected file (blank if the user cancelled) or an error + +### MessageDialog + +Displays a message using a message dialog. Can be customised using [MessageDialogOptions](#messagedialogoptions). + +Go: `MessageDialog(ctx context.Context, dialogOptions MessageDialogOptions) (string, error)` + +Returns: The text of the selected button or an error + +## Options + +### OpenDialogOptions + +```go +type OpenDialogOptions struct { + DefaultDirectory string + DefaultFilename string + Title string + Filters []FileFilter + ShowHiddenFiles bool + CanCreateDirectories bool + ResolvesAliases bool + TreatPackagesAsDirectories bool +} +``` + +| Field | Description | Win | Mac | Lin | +| -------------------------- | ---------------------------------------------- | --- | --- | --- | +| DefaultDirectory | The directory the dialog will show when opened | ✅ | ✅ | ✅ | +| DefaultFilename | The default filename | ✅ | ✅ | ✅ | +| Title | Title for the dialog | ✅ | ✅ | ✅ | +| [Filters](#filefilter) | A list of file filters | ✅ | ✅ | ✅ | +| ShowHiddenFiles | Show files hidden by the system | | ✅ | ✅ | +| CanCreateDirectories | Allow user to create directories | | ✅ | | +| ResolvesAliases | If true, returns the file not the alias | | ✅ | | +| TreatPackagesAsDirectories | Allow navigating into packages | | ✅ | | + +### SaveDialogOptions + +```go +type SaveDialogOptions struct { + DefaultDirectory string + DefaultFilename string + Title string + Filters []FileFilter + ShowHiddenFiles bool + CanCreateDirectories bool + TreatPackagesAsDirectories bool +} +``` + +| Field | Description | Win | Mac | Lin | +| -------------------------- | ---------------------------------------------- | --- | --- | --- | +| DefaultDirectory | The directory the dialog will show when opened | ✅ | ✅ | ✅ | +| DefaultFilename | The default filename | ✅ | ✅ | ✅ | +| Title | Title for the dialog | ✅ | ✅ | ✅ | +| [Filters](#filefilter) | A list of file filters | ✅ | ✅ | ✅ | +| ShowHiddenFiles | Show files hidden by the system | | ✅ | ✅ | +| CanCreateDirectories | Allow user to create directories | | ✅ | | +| TreatPackagesAsDirectories | Allow navigating into packages | | ✅ | | + +### MessageDialogOptions + +```go +type MessageDialogOptions struct { + Type DialogType + Title string + Message string + Buttons []string + DefaultButton string + CancelButton string +} +``` + +| Field | Description | Win | Mac | Lin | +| ------------- | ------------------------------------------------------------------------- | --- | --- | --- | +| Type | The type of message dialog, eg question, info... | ✅ | ✅ | ✅ | +| Title | Title for the dialog | ✅ | ✅ | ✅ | +| Message | The message to show the user | ✅ | ✅ | ✅ | +| Buttons | A list of button titles | | ✅ | | +| DefaultButton | The button with this text should be treated as default. Bound to `return` | | ✅ | | +| CancelButton | The button with this text should be treated as cancel. Bound to `escape` | | ✅ | | + +#### Windows + +Windows has standard dialog types in which the buttons are not customisable. The value returned will be one of: "Ok", "Cancel", "Abort", "Retry", "Ignore", "Yes", "No", "Try Again" or "Continue" + +#### Linux + +Linux has standard dialog types in which the buttons are not customisable. The value returned will be one of: "Ok", "Cancel", "Yes", "No" + +#### Mac + +A message dialog on Mac may specify up to 4 buttons. If no `DefaultButton` or `CancelButton` is given, the first button is considered default and is bound to the `return` key. + +For the following code: + +```go +selection, err := runtime.MessageDialog(b.ctx, runtime.MessageDialogOptions{ + Title: "It's your turn!", + Message: "Select a number", + Buttons: []string{"one", "two", "three", "four"}, +}) +``` + +the first button is shown as default: + +
+ +
+ +
+ +And if we specify `DefaultButton` to be "two": + +```go +selection, err := runtime.MessageDialog(b.ctx, runtime.MessageDialogOptions{ + Title: "It's your turn!", + Message: "Select a number", + Buttons: []string{"one", "two", "three", "four"}, + DefaultButton: "two", +}) +``` + +the second button is shown as default. When `return` is pressed, the value "two" is returned. + +
+ +
+ +
+ +If we now specify `CancelButton` to be "three": + +```go +selection, err := runtime.MessageDialog(b.ctx, runtime.MessageDialogOptions{ + Title: "It's your turn!", + Message: "Select a number", + Buttons: []string{"one", "two", "three", "four"}, + DefaultButton: "two", + CancelButton: "three", +}) +``` + +the button with "three" is shown at the bottom of the dialog. When `escape` is pressed, the value "three" is returned: + +
+ +
+ +
+
+
+ +#### DialogType + +```go +const ( + InfoDialog DialogType = "info" + WarningDialog DialogType = "warning" + ErrorDialog DialogType = "error" + QuestionDialog DialogType = "question" + ) +``` + +### FileFilter + +```go +type FileFilter struct { + DisplayName string // Filter information EG: "Image Files (*.jpg, *.png)" + Pattern string // semi-colon separated list of extensions, EG: "*.jpg;*.png" +} +``` + +#### Windows + +Windows allows you to use multiple file filters in dialog boxes. Each FileFilter will show up as a separate entry in the dialog: + +
+ +
+ +
+
+
+ +#### Linux + +Linux allows you to use multiple file filters in dialog boxes. Each FileFilter will show up as a separate entry in the dialog: + +
+ +
+ +
+
+
+ +#### Mac + +Mac dialogs only have the concept of a single set of patterns to filter files. If multiple FileFilters are provided, Wails will use all the Patterns defined. + +Example: + +```go + selection, err := runtime.OpenFileDialog(b.ctx, runtime.OpenDialogOptions{ + Title: "Select File", + Filters: []runtime.FileFilter{ + { + DisplayName: "Images (*.png;*.jpg)", + Pattern: "*.png;*.jpg", + }, { + DisplayName: "Videos (*.mov;*.mp4)", + Pattern: "*.mov;*.mp4", + }, + }, + }) +``` + +This will result in the Open File dialog using `*.png,*.jpg,*.mov,*.mp4` as a filter. diff --git a/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/events.mdx b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/events.mdx new file mode 100644 index 000000000..75e8b0a50 --- /dev/null +++ b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/events.mdx @@ -0,0 +1,38 @@ +--- +sidebar_position: 2 +--- + +# Events + +The Wails runtime provides a unified events system, where events can be emitted or received by either Go or Javascript. Optionally, data may be passed with the events. Listeners will receive the data in the local data types. + +### EventsOn + +This method sets up a listener for the given event name. When an event of type `eventName` is [emitted](#EventsEmit), the callback is triggered. Any additional data sent with the emitted event will be passed to the callback. + +Go: `EventsOn(ctx context.Context, eventName string, callback func(optionalData ...interface{}))`
JS: `EventsOn(eventName string, callback function(optionalData?: any))` + +### EventsOff + +This method unregisters the listener for the given event name, optionally multiple listeneres can be unregistered via `additionalEventNames`. + +Go: `EventsOff(ctx context.Context, eventName string, additionalEventNames ...string)`
JS: `EventsOff(eventName string, ...additionalEventNames)` + +### EventsOnce + +This method sets up a listener for the given event name, but will only trigger once. + +Go: `EventsOnce(ctx context.Context, eventName string, callback func(optionalData ...interface{}))`
JS: `EventsOnce(eventName string, callback function(optionalData?: any))` + +### EventsOnMultiple + +This method sets up a listener for the given event name, but will only trigger a maximum of `counter` times. + +Go: `EventsOnMultiple(ctx context.Context, eventName string, callback func(optionalData ...interface{}), counter int)`
JS: `EventsOnMultiple(eventName string, callback function(optionalData?: any), counter int)` + +### EventsEmit + +This method emits the given event. Optional data may be passed with the event. This will trigger any event listeners. + +Go: `EventsEmit(ctx context.Context, eventName string, optionalData ...interface{})`
JS: `EventsEmit(ctx context, optionalData function(optionalData?: any))` + diff --git a/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/intro.mdx b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/intro.mdx new file mode 100644 index 000000000..6c02c71cd --- /dev/null +++ b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/intro.mdx @@ -0,0 +1,73 @@ +--- +sidebar_position: 1 +--- + +# Introduction + +The runtime is a library that provides utility methods for your application. There is both a Go and Javascript runtime and the aim is to try and keep them at parity where possible. + +It has utility methods for: + +- [Window](window.mdx) +- [Menu](menu.mdx) +- [Dialog](dialog.mdx) +- [Events](events.mdx) +- [Browser](browser.mdx) +- [Log](log.mdx) + +The Go Runtime is available through importing `github.com/wailsapp/wails/v2/pkg/runtime`. All methods in this package take a context as the first parameter. This context should be obtained from the [OnStartup](../options.mdx#onstartup) or [OnDomReady](../options.mdx#ondomready) hooks. + +:::info Note + +Whilst the context will be provided to the [OnStartup](../options.mdx#onstartup) method, there's no guarantee the runtime will work in this method as the window is initialising in a different thread. If you wish to call runtime methods at startup, use [OnDomReady](../options.mdx#ondomready). + +::: + +The Javascript library is available to the frontend via the `window.runtime` map. There is a runtime package generated when using `dev` mode that provides Typescript declarations for the runtime. This should be located in the `wailsjs` directory in your frontend directory. + +### Hide + +Go: `Hide(ctx context.Context)`
JS: `Hide()` + +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 + +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`. ::: + +Go: `Show(ctx context.Context)`
JS: `Show()` + +### Quit + +Quits the application. + +Go: `Quit(ctx context.Context)`
JS: `Quit()` + +### Environment + +Returns details of the current environment. + +Go: `Environment(ctx context.Context) EnvironmentInfo`
JS: `Environment(): Promise` + +#### EnvironmentInfo + +Go: +```go +type EnvironmentInfo struct { + BuildType string + Platform string + Arch string +} +``` +JS: +```ts +interface EnvironmentInfo { + buildType: string; + platform: string; + arch: string; +} +``` diff --git a/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/log.mdx b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/log.mdx new file mode 100644 index 000000000..e5e6ea7ac --- /dev/null +++ b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/log.mdx @@ -0,0 +1,130 @@ +--- +sidebar_position: 3 +--- + +# Log + +The Wails runtime provides a logging mechanism that may be called from Go or Javascript. Like most loggers, there are a number of log levels: + +- Trace +- Debug +- Info +- Warning +- Error +- Fatal + +The logger will output any log message at the current, or higher, log level. Example: The `Debug` log level will output all messages except `Trace` messages. + +### LogPrint + +Logs the given message as a raw message. + +Go: `LogPrint(ctx context.Context, message string)`
JS: `LogPrint(message: string)` + +### LogPrintf + +Logs the given message as a raw message. + +Go: `LogPrintf(ctx context.Context, format string, args ...interface{})`
+ +### LogTrace + +Logs the given message at the `Trace` log level. + +Go: `LogTrace(ctx context.Context, message string)`
JS: `LogTrace(message: string)` + +### LogTracef + +Logs the given message at the `Trace` log level. + +Go: `LogTracef(ctx context.Context, format string, args ...interface{})`
+ +### LogDebug + +Logs the given message at the `Debug` log level. + +Go: `LogDebug(ctx context.Context, message string)`
JS: `LogDebug(message: string)` + +### LogDebugf + +Logs the given message at the `Debug` log level. + +Go: `LogDebugf(ctx context.Context, format string, args ...interface{})`
+ +### LogInfo + +Logs the given message at the `Info` log level. + +Go: `LogInfo(ctx context.Context, message string)`
JS: `LogInfo(message: string)` + +### LogInfof + +Logs the given message at the `Info` log level. + +Go: `LogInfof(ctx context.Context, format string, args ...interface{})`
+ +### LogWarning + +Logs the given message at the `Warning` log level. + +Go: `LogWarning(ctx context.Context, message string)`
JS: `LogWarning(message: string)` + +### LogWarningf + +Logs the given message at the `Warning` log level. + +Go: `LogWarningf(ctx context.Context, format string, args ...interface{})`
+ +### LogError + +Logs the given message at the `Error` log level. + +Go: `LogError(ctx context.Context, message string)`
JS: `LogError(message: string)` + +### LogErrorf + +Logs the given message at the `Error` log level. + +Go: `LogErrorf(ctx context.Context, format string, args ...interface{})`
+ +### LogFatal + +Logs the given message at the `Fatal` log level. + +Go: `LogFatal(ctx context.Context, message string)`
JS: `LogFatal(message: string)` + +### LogFatalf + +Logs the given message at the `Fatal` log level. + +Go: `LogFatalf(ctx context.Context, format string, args ...interface{})`
+ +### LogSetLogLevel + +Sets the log level. In Javascript, the number relates to the following log levels: + +| Value | Log Level | +| ----- | --------- | +| 1 | Trace | +| 2 | Debug | +| 3 | Info | +| 4 | Warning | +| 5 | Error | + +Go: `LogSetLogLevel(ctx context.Context, level logger.LogLevel)`
JS: `LogSetLogLevel(level: number)` + +## Using a Custom Logger + +A custom logger may be used by providing it using the [Logger](../options.mdx#logger) application option. The only requirement is that the logger implements the `logger.Logger` interface defined in `github.com/wailsapp/wails/v2/pkg/logger`: + +```go title="logger.go" +type Logger interface { + Print(message string) + Trace(message string) + Debug(message string) + Info(message string) + Warning(message string) + Error(message string) + Fatal(message string) +} +``` diff --git a/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/menu.mdx b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/menu.mdx new file mode 100644 index 000000000..6a7e06cf9 --- /dev/null +++ b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/menu.mdx @@ -0,0 +1,23 @@ +--- +sidebar_position: 6 +--- + +# Menu + +These methods are related to the application menu. + +:::info Javascript +Menu is currently unsupported in the JS runtime. +::: + +### MenuSetApplicationMenu + +Sets the application menu to the given [menu](../menus.mdx). + +Go: `MenuSetApplicationMenu(ctx context.Context, menu *menu.Menu)` + +### MenuUpdateApplicationMenu + +Updates the application menu, picking up any changes to the menu passed to `MenuSetApplicationMenu`. + +Go: `MenuUpdateApplicationMenu(ctx context.Context)` diff --git a/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/window.mdx b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/window.mdx new file mode 100644 index 000000000..d03143161 --- /dev/null +++ b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/window.mdx @@ -0,0 +1,211 @@ +--- +sidebar_position: 4 +--- + +# Window + +These methods give control of the application window. + +### WindowSetTitle + +Sets the text in the window title bar. + +Go: `WindowSetTitle(ctx context.Context, title string)`
JS: `WindowSetTitle(title: string)` + +### WindowFullscreen + +Makes the window full screen. + +Go: `WindowFullscreen(ctx context.Context)`
JS: `WindowFullscreen()` + +### WindowUnfullscreen + +Restores the previous window dimensions and position prior to full screen. + +Go: `WindowUnfullscreen(ctx context.Context)`
JS: `WindowUnfullscreen()` + +### WindowIsFullscreen + +Returns true if the window is full screen. + +Go: `WindowCenter(ctx context.Context)`
JS: `WindowCenter()` + +### WindowCenter + +Centers the window on the monitor the window is currently on. + +Go: `WindowReload(ctx context.Context)`
JS: `WindowReload()` + +### WindowReload + +Performs a "reload" (Reloads current page). + +Go: `WindowReloadApp(ctx context.Context)`
JS: `WindowReloadApp()` + +### WindowReloadApp + +Reloads the application frontend. + +Go: `WindowSetSystemDefaultTheme(ctx context.Context)`
JS: `WindowSetSystemDefaultTheme()` + +### WindowSetSystemDefaultTheme + +Windows only. + +Go: `WindowSetDarkTheme(ctx context.Context)`
JS: `WindowSetDarkTheme()` + +Sets window theme to system default (dark/light). + +### WindowSetLightTheme + +Windows only. + +Go: `WindowSetLightTheme(ctx context.Context)`
JS: `WindowSetLightTheme()` + +Sets window theme to light. + +### WindowSetDarkTheme + +Windows only. + +Go: `WindowShow(ctx context.Context)`
JS: `WindowShow()` + +Sets window theme to dark. + +### WindowShow + +Shows the window, if it is currently hidden. + +Go: `WindowHide(ctx context.Context)`
JS: `WindowHide()` + +### WindowHide + +Hides the window, if it is currently visible. + +Go: `WindowSetSize(ctx context.Context, width int, height int)`
JS: `WindowSetSize(size: Size)` + +### WindowIsNormal + +Returns true if the window not minimised, maximised or fullscreen. + +Go: `WindowGetSize(ctx context.Context) (width int, height int)`
JS: `WindowGetSize() : Size` + +### WindowSetSize + +Sets the width and height of the window. + +Go: `WindowSetMaxSize(ctx context.Context, width int, height int)`
JS: `WindowSetMaxSize(size: Size)` + +### WindowGetSize + +Gets the width and height of the window. + +Go: `WindowSetMinSize(ctx context.Context, width int, height int)`
JS: `WindowSetMinSize(size: Size)` + +### WindowSetMinSize + +Sets the minimum window size. Will resize the window if the window is currently smaller than the given dimensions. + +Setting a size of `0,0` will disable this constraint. + +Go: `WindowSetAlwaysOnTop(ctx context.Context, b bool)`
JS: `WindowSetAlwaysOnTop(b: Boolen)` + +### WindowSetMaxSize + +Sets the maximum window size. Will resize the window if the window is currently larger than the given dimensions. + +Setting a size of `0,0` will disable this constraint. + +Go: `WindowSetPosition(ctx context.Context, x int, y int)`
JS: `WindowSetPosition(position: Position)` + +### WindowSetAlwaysOnTop + +Sets the window AlwaysOnTop or not on top. + +Go: `WindowGetPosition(ctx context.Context) (x int, y int)`
JS: `WindowGetPosition() : Position` + +### WindowSetPosition + +Sets the window position relative to the monitor the window is currently on. + +Go: `WindowMaximise(ctx context.Context)`
JS: `WindowMaximise()` + +### WindowGetPosition + +Gets the window position relative to the monitor the window is currently on. + +Go: `WindowUnmaximise(ctx context.Context)`
JS: `WindowUnmaximise()` + +### WindowMaximise + +Maximises the window to fill the screen. + +Go: `WindowToggleMaximise(ctx context.Context)`
JS: `WindowToggleMaximise()` + +### WindowUnmaximise + +Restores the window to the dimensions and position prior to maximising. + +Go: `WindowMinimise(ctx context.Context)`
JS: `WindowMinimise()` + +### WindowIsMaximised + +Returns true if the window is maximised. + +Go: `WindowUnminimise(ctx context.Context)`
JS: `WindowUnminimise()` + +### WindowToggleMaximise + +Toggles between Maximised and UnMaximised. + +Go: `WindowToggleMaximise(ctx context.Context)`
JS: `WindowToggleMaximise()` + +### WindowMinimise + +Minimises the window. + +Go: `WindowSetBackgroundColour(ctx context.Context, R, G, B, A uint8)`
JS: `WindowSetBackgroundColour(R, G, B, A)` + +### WindowUnminimise + +Restores the window to the dimensions and position prior to minimising. + +Go: `WindowUnminimise(ctx context.Context)`
JS: `WindowUnminimise()` + +### WindowIsMinimised + +Returns true if the window is minimised. + +Go: `WindowIsMinimised(ctx context.Context) bool` JS: `WindowIsMinimised() bool` + +### WindowSetBackgroundColour + +Sets the background colour of the window to the given RGBA colour definition. This colour will show through for all transparent pixels. + +Valid values for R, G, B and A are 0-255. + +Any value that is not 0 will be considered 255. :::info Windows +On Windows, only alpha values of 0 or 255 are supported. +::: + +Go: `WindowSetBackgroundColour(ctx context.Context, R, G, B, A uint8)`
JS: `WindowSetBackgroundColour(R, G, B, A)` + +## Typescript Object Definitions + +### Position + +```ts +interface Position { + x: number; + y: number; +} +``` + +### Size + +```ts +interface Size { + w: number; + h: number; +} +``` diff --git a/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/tutorials/_category_.json b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/tutorials/_category_.json new file mode 100644 index 000000000..dfac1d175 --- /dev/null +++ b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/tutorials/_category_.json @@ -0,0 +1,4 @@ +{ + "label": "Tutorials", + "position": 70 +} diff --git a/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/tutorials/dogsapi.mdx b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/tutorials/dogsapi.mdx new file mode 100644 index 000000000..f4845fdbe --- /dev/null +++ b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/tutorials/dogsapi.mdx @@ -0,0 +1,243 @@ +--- +sidebar_position: 20 +--- + +# Dogs API + +
+ +
+ +
+ +:::note This tutorial has been kindly provided by [@tatadan](https://twitter.com/tatadan) and forms part of their [Wails Examples Repository](https://github.com/tataDan/wails-v2-examples). ::: + +In this tutorial we are going to develop an application that retrieves photos of dogs from the web and then displays them. + +### Create the project + +Let's create the application. From a terminal enter: `wails init -n dogs-api -t svelte` + +Note: We could optionally add `-ide vscode` or `-ide goland` to the end of this command if you wanted to add IDE support. + +Now let's `cd dogs-api` and start editing the project files. + +### Remove unused code + +We will start by removing some elements that we know we will not use: + +- Open `app.go` and remove the following lines: + +```go +// Greet returns a greeting for the given name +func (a *App) Greet(name string) string { + return fmt.Sprintf("Hello %s, It's show time!", name) +} +``` + +- Open `frontend/src/App.svelte` and delete all lines. +- Delete the `frontend/src/assets/images/logo-universal.png` file + +### Creating our application + +Now let's add our new Go code. + +Add the following struct declarations to `app.go` before the function definitions: + +```go +type RandomImage struct { + Message string + Status string +} + +type AllBreeds struct { + Message map[string]map[string][]string + Status string +} + +type ImagesByBreed struct { + Message []string + Status string +} +``` + +Add the following functions to `app.go` (perhaps after the existing function definitions): + +```go +func (a *App) GetRandomImageUrl() string { + response, err := http.Get("https://dog.ceo/api/breeds/image/random") + if err != nil { + log.Fatal(err) + } + + responseData, err := ioutil.ReadAll(response.Body) + if err != nil { + log.Fatal(err) + } + + var data RandomImage + json.Unmarshal(responseData, &data) + + return data.Message +} + +func (a *App) GetBreedList() []string { + var breeds []string + + response, err := http.Get("https://dog.ceo/api/breeds/list/all") + if err != nil { + log.Fatal(err) + } + + responseData, err := ioutil.ReadAll(response.Body) + if err != nil { + log.Fatal(err) + } + + var data AllBreeds + json.Unmarshal(responseData, &data) + + for k := range data.Message { + breeds = append(breeds, k) + } + + sort.Strings(breeds) + + return breeds +} + +func (a *App) GetImageUrlsByBreed(breed string) []string { + + url := fmt.Sprintf("%s%s%s%s", "https://dog.ceo/api/", "breed/", breed, "/images") + response, err := http.Get(url) + if err != nil { + log.Fatal(err) + } + + responseData, err := ioutil.ReadAll(response.Body) + if err != nil { + log.Fatal(err) + } + + var data ImagesByBreed + json.Unmarshal(responseData, &data) + + return data.Message +} +``` + +Modify the `import` section of `app.go` to look like this: + +```go +import ( + "context" + "fmt" + "encoding/json" + "io/ioutil" + "log" + "net/http" + "sort" +) +``` + +Add the following lines to `frontend/src/App.svelte`: + +```html + + +

Dogs API

+
+ + Click on down arrow to select a breed + + +
+
+{#if showRandomPhoto} + No dog found +{/if} +{#if showBreedPhotos} + {#each photos as photo} + No dog found + {/each} +{/if} + + +``` + +### Testing the application + +To generate the bindings and test the application, run `wails dev`. + +### Compiling the application + +To compile the application to a single, production grade binary, run `wails build`. + + + + + diff --git a/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/tutorials/helloworld.mdx b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/tutorials/helloworld.mdx new file mode 100644 index 000000000..d1b8e9f98 --- /dev/null +++ b/website/i18n/ko/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/tutorials/helloworld.mdx @@ -0,0 +1,118 @@ +--- +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: + +
+ +
+ +
+ +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: + +
+ +
+
diff --git a/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-beta.44.json b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-beta.44.json new file mode 100644 index 000000000..b6f38500b --- /dev/null +++ b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-beta.44.json @@ -0,0 +1,38 @@ +{ + "version.label": { + "message": "v2.0.0-beta.44", + "description": "The label for version v2.0.0-beta.44" + }, + "sidebar.tutorialSidebar.category.Getting Started": { + "message": "Getting Started", + "description": "The label for category Getting Started in sidebar tutorialSidebar" + }, + "sidebar.tutorialSidebar.category.Reference": { + "message": "Reference", + "description": "The label for category Reference in sidebar tutorialSidebar" + }, + "sidebar.tutorialSidebar.category.Runtime": { + "message": "Runtime", + "description": "The label for category Runtime in sidebar tutorialSidebar" + }, + "sidebar.tutorialSidebar.category.Community": { + "message": "Community", + "description": "The label for category Community in sidebar tutorialSidebar" + }, + "sidebar.tutorialSidebar.category.Showcase": { + "message": "Showcase", + "description": "The label for category Showcase in sidebar tutorialSidebar" + }, + "sidebar.tutorialSidebar.category.Guides": { + "message": "Guides", + "description": "The label for category Guides in sidebar tutorialSidebar" + }, + "sidebar.tutorialSidebar.category.Tutorials": { + "message": "Tutorials", + "description": "The label for category Tutorials in sidebar tutorialSidebar" + }, + "sidebar.tutorialSidebar.category.Contributing": { + "message": "Contributing", + "description": "The label for category Contributing in sidebar tutorialSidebar" + } +} diff --git a/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1.json b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1.json new file mode 100644 index 000000000..49cf4687e --- /dev/null +++ b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1.json @@ -0,0 +1,38 @@ +{ + "version.label": { + "message": "v2.0.0-rc.1", + "description": "The label for version v2.0.0-rc.1" + }, + "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" + } +} diff --git a/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/appendix/_category_.json b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/appendix/_category_.json new file mode 100644 index 000000000..83af4ca28 --- /dev/null +++ b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/appendix/_category_.json @@ -0,0 +1,4 @@ +{ + "label": "Appendix", + "position": 70 +} diff --git a/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/_category_.json b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/_category_.json new file mode 100644 index 000000000..524986e1e --- /dev/null +++ b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/_category_.json @@ -0,0 +1,4 @@ +{ + "label": "Community", + "position": 50 +} diff --git a/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/links.mdx b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/links.mdx new file mode 100644 index 000000000..4a3a89e87 --- /dev/null +++ b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/links.mdx @@ -0,0 +1,23 @@ +--- +sidebar_position: 2 +--- + +# Links + +This page serves as a list for community related links. Please submit a PR (click `Edit this page` at the bottom) to submit links. + +## Awesome Wails + +The [definitive list](https://github.com/wailsapp/awesome-wails) of links related to Wails. + +## Support Channels + +- [Gophers Slack Channel](https://gophers.slack.com/messages/CJ4P9F7MZ/) +- [Gophers Slack Channel Invite](https://invite.slack.golangbridge.org/) +- [Github Issues](https://github.com/wailsapp/wails/issues) +- [v2 Beta Discussion Board](https://github.com/wailsapp/wails/discussions/828) + +## Social Media + +- [Twitter](https://twitter.com/wailsapp) +- [Wails Chinese Community QQ Group](https://qm.qq.com/cgi-bin/qm/qr?k=PmIURne5hFGNd7QWzW5qd6FV-INEjNJv&jump_from=webapi) - Group number: 1067173054 diff --git a/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/_category_.json b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/_category_.json new file mode 100644 index 000000000..276e283b7 --- /dev/null +++ b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/_category_.json @@ -0,0 +1,4 @@ +{ + "label": "Showcase", + "position": 1 +} diff --git a/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/emailit.mdx b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/emailit.mdx new file mode 100644 index 000000000..4a1ebe835 --- /dev/null +++ b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/emailit.mdx @@ -0,0 +1,8 @@ +# EmailIt + +

+ +
+

+ +[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 builtin [Node-Red](https://nodered.org/) server, scripts terminal, and the [ScriptBar](https://github.com/raguay/ScriptBarApp) program for displaying results from Node-Red or a script on your system. Documentation is very scarce, but the programs works. It’s built using Wails2 and Svelte, and the download is a universal macOS application. diff --git a/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/encrypteasy.mdx b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/encrypteasy.mdx new file mode 100644 index 000000000..13c2d8345 --- /dev/null +++ b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/encrypteasy.mdx @@ -0,0 +1,10 @@ +# EncryptEasy + +

+ +
+

+ +**[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. diff --git a/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/filehound.mdx b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/filehound.mdx new file mode 100644 index 000000000..78cbfca86 --- /dev/null +++ b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/filehound.mdx @@ -0,0 +1,14 @@ +# FileHound Export Utility + +

+ +
+

+ +[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 diff --git a/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/minecraftupdater.mdx b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/minecraftupdater.mdx new file mode 100644 index 000000000..11247339d --- /dev/null +++ b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/minecraftupdater.mdx @@ -0,0 +1,10 @@ +# Minecraft Updater + +

+ +
+

+ +[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. diff --git a/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/modalfilemanager.mdx b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/modalfilemanager.mdx new file mode 100644 index 000000000..a7ae8c492 --- /dev/null +++ b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/modalfilemanager.mdx @@ -0,0 +1,12 @@ +# Modal File Manager + +

+ +
+

+ +[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. 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. diff --git a/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/mollywallet.mdx b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/mollywallet.mdx new file mode 100644 index 000000000..534b097ca --- /dev/null +++ b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/mollywallet.mdx @@ -0,0 +1,8 @@ +# Molley Wallet + +

+ +
+

+ +[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. diff --git a/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/october.mdx b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/october.mdx new file mode 100644 index 000000000..889d2dd9e --- /dev/null +++ b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/october.mdx @@ -0,0 +1,12 @@ +# October + +

+ +
+

+ +[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. diff --git a/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/optimus.mdx b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/optimus.mdx new file mode 100644 index 000000000..c3eb79507 --- /dev/null +++ b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/optimus.mdx @@ -0,0 +1,8 @@ +# Optimus + +

+ +
+

+ +[Optimus](https://github.com/splode/optimus) is a desktop image optimization application. It supports conversion and compression between WebP, JPEG, and PNG image formats. diff --git a/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/portfall.mdx b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/portfall.mdx new file mode 100644 index 000000000..4cc2c63c9 --- /dev/null +++ b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/portfall.mdx @@ -0,0 +1,8 @@ +# Portfall + +

+ +
+

+ +[Portfall](https://github.com/rekon-oss/portfall) - A desktop k8s port-forwarding portal for easy access to all your cluster UIs diff --git a/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/restic-browser.mdx b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/restic-browser.mdx new file mode 100644 index 000000000..1505ce07a --- /dev/null +++ b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/restic-browser.mdx @@ -0,0 +1,10 @@ +# Restic Browser + +

+ +
+

+ +[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. diff --git a/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/riftshare.mdx b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/riftshare.mdx new file mode 100644 index 000000000..5223e88cf --- /dev/null +++ b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/riftshare.mdx @@ -0,0 +1,19 @@ +# RiftShare + +

+ +
+

+ +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! diff --git a/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/scriptbar.mdx b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/scriptbar.mdx new file mode 100644 index 000000000..aaa556f92 --- /dev/null +++ b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/scriptbar.mdx @@ -0,0 +1,8 @@ +# ScriptBar + +

+ +
+

+ +[ScriptBar](https://GitHub.com/raguay/ScriptBarApp) is a program to show the output of the embedded [Node-Red](https://nodered.org) server in the [EmailIt](https://GitHub.com/raguay/EmailIt) application. 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. diff --git a/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/surge.mdx b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/surge.mdx new file mode 100644 index 000000000..2d895dc29 --- /dev/null +++ b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/surge.mdx @@ -0,0 +1,8 @@ +# Surge + +

+ +
+

+ +[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. diff --git a/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/wally.mdx b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/wally.mdx new file mode 100644 index 000000000..2a2498f40 --- /dev/null +++ b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/wally.mdx @@ -0,0 +1,8 @@ +# Wally + +

+ +
+

+ +[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. diff --git a/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/wombat.mdx b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/wombat.mdx new file mode 100644 index 000000000..54cedacea --- /dev/null +++ b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/wombat.mdx @@ -0,0 +1,8 @@ +# Wombat + +

+ +
+

+ +[Wombat](https://github.com/rogchap/wombat) is a cross platform gRPC client. diff --git a/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/ytd.mdx b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/ytd.mdx new file mode 100644 index 000000000..178ff0529 --- /dev/null +++ b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/ytd.mdx @@ -0,0 +1,8 @@ +# Ytd + +

+ +
+

+ +[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. diff --git a/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/templates.mdx b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/templates.mdx new file mode 100644 index 000000000..d9a29a6fa --- /dev/null +++ b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/templates.mdx @@ -0,0 +1,52 @@ +--- +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) - A template using Vite,Vue and Vue-Router(Support both JavaScript and TypeScript) +- [wails-vite-vue-ts](https://github.com/codydbentley/wails-vite-vue-ts) - Vue 3 TypeScript with Vite (and instructions to add features) +- [wails-vite-vue-the-works](https://github.com/codydbentley/wails-vite-vue-the-works) - Vue 3 TypeScript with Vite, Vuex, Vue Router, Sass, and ESLint + Prettier + +## Angular + +- [wails-angular-template](https://github.com/TAINCER/wails-angular-template) - Angular with TypeScript, Sass, Hot-Reload, Code-Splitting and i18n + +## React + +- [wails-react-template](https://github.com/AlienRecall/wails-react-template) - A template using reactjs +- [wails-react-template](https://github.com/flin7/wails-react-template) - A minimal template for React that supports live development +- [wails-template-nextjs](https://github.com/LGiki/wails-template-nextjs) - A template using Next.js and TypeScript + +## Svelte + +- [wails-svelte-template](https://github.com/raitonoberu/wails-svelte-template) - A template using Svelte +- [wails-vite-svelte-template](https://github.com/BillBuilt/wails-vite-svelte-template) - A template using Svelte and Vite +- [wails-vite-svelte-tailwind-template](https://github.com/BillBuilt/wails-vite-svelte-tailwind-template) - A template using Svelte and Vite with TailwindCSS v3 +- [wails-sveltekit-template](https://github.com/h8gi/wails-sveltekit-template) - A template using SvelteKit + +## 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: + +## 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 \ No newline at end of file diff --git a/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/gettingstarted/_category_.json b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/gettingstarted/_category_.json new file mode 100644 index 000000000..597b920df --- /dev/null +++ b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/gettingstarted/_category_.json @@ -0,0 +1,4 @@ +{ + "label": "Getting Started", + "position": 10 +} diff --git a/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/gettingstarted/building.mdx b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/gettingstarted/building.mdx new file mode 100644 index 000000000..3e0df3b68 --- /dev/null +++ b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/gettingstarted/building.mdx @@ -0,0 +1,21 @@ +--- +sidebar_position: 6 +--- + +# Compiling your Project + +From the project directory, run `wails build`. This will compile your project and save the production-ready binary in the `build/bin` directory. + +If you run the binary, you should see the default application: + +
+ +
+ +
+ +For more details on compilation options, please refer to the [CLI Reference](../reference/cli.mdx#build). diff --git a/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/gettingstarted/development.mdx b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/gettingstarted/development.mdx new file mode 100644 index 000000000..54dda5faa --- /dev/null +++ b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/gettingstarted/development.mdx @@ -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 diff --git a/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/gettingstarted/firstproject.mdx b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/gettingstarted/firstproject.mdx new file mode 100644 index 000000000..94e330c47 --- /dev/null +++ b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/gettingstarted/firstproject.mdx @@ -0,0 +1,130 @@ +--- +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: + + + +import Tabs from "@theme/Tabs"; +import TabItem from "@theme/TabItem"; + + + + Generate a Svelte project using Javascript with:

+ + wails init -n myproject -t svelte +If you would rather use Typescript:
+ + wails init -n myproject -t svelte-ts + + + + Generate a React project using Javascript with:

+ + wails init -n myproject -t react +If you would rather use Typescript:
+ + wails init -n myproject -t react-ts + + + + Generate a Vue project using Javascript with:

+ + wails init -n myproject -t vue + +If you would rather use Typescript:
+ + wails init -n myproject -t vue-ts + + + + Generate a Preact project using Javascript with:

+ + wails init -n myproject -t preact + +If you would rather use Typescript:
+ + wails init -n myproject -t preact-ts + + + + Generate a Lit project using Javascript with:

+ + wails init -n myproject -t lit + +If you would rather use Typescript:
+ + wails init -n myproject -t lit-ts + + + + Generate a Vanilla project using Javascript with:

+ + wails init -n myproject -t vanilla + +If you would rather use Typescript:
+ + wails init -n myproject -t vanilla-ts + + + + + + +
+ +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. + +The default module name in `go.mod` is "changeme". You should change this to something more appropriate. diff --git a/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/gettingstarted/installation.mdx b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/gettingstarted/installation.mdx new file mode 100644 index 000000000..5c37d84ff --- /dev/null +++ b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/gettingstarted/installation.mdx @@ -0,0 +1,90 @@ +--- +sidebar_position: 1 +--- + +# Installation + +## Supported Platforms + +- Windows 10/11 AMD64/ARM64 +- MacOS 10.13+ AMD64 +- MacOS 11.0+ ARM64 +- Linux AMD64/ARM64 + +## Dependencies + +Wails has a number of common dependencies that are required before installation: + +- Go 1.17+ +- NPM (Node 15+) + +### Go + +Download Go from the [Go Downloads Page](https://go.dev/doc/install). + +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: + + + +import Tabs from "@theme/Tabs"; +import TabItem from "@theme/TabItem"; + + + + Wails requires that the xcode command line tools are installed. This can be done by running:
+ xcode-select --install + + + Wails requires that the WebView2{" "} + runtime is installed. Some Windows installations will already have this installed. You can check using + the{" "} + wails doctor command (see below). + + + 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. + + + + + +## Optional Dependencies + +- [UPX](https://upx.github.io/) for compressing your applications. + +## Installing Wails + +Run `go install github.com/wailsapp/wails/v2/cmd/wails@latest` to install the Wails CLI. + +## System Check + +Running `wails doctor` will check if you have the correct dependencies installed. If not, it will advise on what is missing and help on how to rectify any problems. + +## 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. diff --git a/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/_category_.json b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/_category_.json new file mode 100644 index 000000000..5935dad93 --- /dev/null +++ b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/_category_.json @@ -0,0 +1,4 @@ +{ + "label": "Guides", + "position": 50 +} diff --git a/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/application-development.mdx b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/application-development.mdx new file mode 100644 index 000000000..a618076f1 --- /dev/null +++ b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/application-development.mdx @@ -0,0 +1,194 @@ +# 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) + } +} +``` + +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 specifiy `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/). For [create-react-app](https://create-react-app.dev/), it's possible to use [this script](https://gist.github.com/int128/e0cdec598c5b3db728ff35758abdbafd) to achieve a similar result. + +## Go Module + +The default Wails templates generate a `go.mod` file that contains the module name "changeme". You should change this to something more appropriate after project generation. diff --git a/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/bleeding-edge.mdx b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/bleeding-edge.mdx new file mode 100644 index 000000000..b81cc79dc --- /dev/null +++ b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/bleeding-edge.mdx @@ -0,0 +1,55 @@ +# Bleeding Edge + +## Overview + +Wails is in constant development and new releases are regularly "tagged". This usually happens when all the newer code on `master` has been tested and confirmed working. If you need a bugfix or feature that has not yet made it to a release, it's possible to use the latest "bleeding edge" version using the following steps: + +- `git clone https://github.com/wailsapp/wails` +- `cd wails/v2/cmd/wails` +- `go install` + +NOTE: The directory that you cloned the project into will now be called "clonedir". + +The Wails CLI will now be at the very latest version. + +### 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 => ` + +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. diff --git a/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/dynamic-assets.mdx b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/dynamic-assets.mdx new file mode 100644 index 000000000..77ad6d09e --- /dev/null +++ b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/dynamic-assets.mdx @@ -0,0 +1,126 @@ +# 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: 255}, + 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: + +

+ +

+ +However, if we request `go.mod`, we will see the following output: + +

+ +

+ +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 + +``` + +with: + +```html + +``` + +Then we would see the following: + +

+ +

+ +:::warning +Exposing your filesystem in this way is a security risk. It is recommended that you properly manage access +to your filesystem. +::: diff --git a/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/frameless.mdx b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/frameless.mdx new file mode 100644 index 000000000..c7ca5f6c3 --- /dev/null +++ b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/frameless.mdx @@ -0,0 +1,84 @@ +# 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 + + + + + + + +
+ + +
+
+ + + + +``` + +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" +) + +//go:embed 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, + Assets: assets, + Frameless: true, + CSSDragProperty: "widows", + CSSDragValue: "1", + Bind: []interface{}{ + app, + }, + }) + + if err != nil { + println("Error:", err) + } +} +``` + +```html title=index.html + + + + + + alwaysontop + + +
+ + + + +``` + +:::info Fullscreen + If you allow your application to go fullscreen, this drag functionality will be disabled. +::: diff --git a/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/frontend.mdx b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/frontend.mdx new file mode 100644 index 000000000..4b192c557 --- /dev/null +++ b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/frontend.mdx @@ -0,0 +1,75 @@ +# Frontend + +## Script Injection + +When Wails serves your `index.html`, by default, it will inject 2 script entries into the `` 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 + + + injection example + + + + + + + +
Please enter your name below 👇
+
+ + +
+ + + + + +``` + +### Overriding Default Script Injection + +To provide more flexibility to developers, there is a meta tag that may be used to customise this behaviour: + +```html + +``` + +The options are as follows: + +| Value | Description | +| ------------------- | ------------------------------------------------ | +| noautoinjectruntime | Disable the autoinjection of `/wails/runtime.js` | +| noautoinjectipc | Disable the autoinjection of `/wails/ipc.js` | +| noautoinject | Disable all autoinjection of scripts | + +Multiple options may be used provided they are comma seperated. + +This code is perfectly valid and operates the same as the autoinjection version: + +```html + + + + injection example + + + + + + +
Please enter your name below 👇
+
+ + +
+ + + + + + + +``` diff --git a/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/ides.mdx b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/ides.mdx new file mode 100644 index 000000000..a20ae4131 --- /dev/null +++ b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/ides.mdx @@ -0,0 +1,113 @@ +# IDEs + +Wails aims to provide a great development experience. To that aim, we now support generating IDE specific configuration to provide smoother project setup. + +Currently, we support [Visual Studio Code](https://code.visualstudio.com/) but aim to support other IDEs such as Goland. + +## Visual Studio Code + +

+ +

+ +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. + +::: diff --git a/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/linux-distro-support.mdx b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/linux-distro-support.mdx new file mode 100644 index 000000000..28a224a26 --- /dev/null +++ b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/linux-distro-support.mdx @@ -0,0 +1,101 @@ +# 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 `.go`, where `` 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! +::: diff --git a/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/linux.mdx b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/linux.mdx new file mode 100644 index 000000000..229c282bf --- /dev/null +++ b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/linux.mdx @@ -0,0 +1,18 @@ +# 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) diff --git a/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/manual-builds.mdx b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/manual-builds.mdx new file mode 100644 index 000000000..dcf192d33 --- /dev/null +++ b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/manual-builds.mdx @@ -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/.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. diff --git a/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/migrating.mdx b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/migrating.mdx new file mode 100644 index 000000000..2dff1a91b --- /dev/null +++ b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/migrating.mdx @@ -0,0 +1,189 @@ +# 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, + 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 the 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 frontend/dist +var assets embed.FS + +func main() { + err := wails.Run(&options.App{ + /* Other Options */ + Assets: assets, + }) +} +``` + +Of course, bundlers can be used if you wish to. The only requirement is to pass the final application assets directory to Wails using an `embed.FS` in the `Assets` key of the [application options](../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: + +

+ +| 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/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/mouse-buttons.mdx b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/mouse-buttons.mdx new file mode 100644 index 000000000..49e9cd69c --- /dev/null +++ b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/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/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/overscroll.mdx b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/overscroll.mdx new file mode 100644 index 000000000..dca7e83a3 --- /dev/null +++ b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/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/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/routing.mdx b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/routing.mdx new file mode 100644 index 000000000..5a47814cc --- /dev/null +++ b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/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( + + {/* The rest of your app goes here */} + + } exact /> + } /> + } /> + {/* more... */} + + , + root +); +``` diff --git a/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/signing.mdx b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/signing.mdx new file mode 100644 index 000000000..5f2807a82 --- /dev/null +++ b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/signing.mdx @@ -0,0 +1,377 @@ +# 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. + +- 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/* + jobs: + package: + strategy: + matrix: + platform: [ windows-latest, macos-latest ] + go-version: [1.18] + runs-on: ${{ matrix.platform }} + steps: + - uses: actions/checkout@v2 + - 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. +``` + +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. Now you need to make two action secrets on GitHub. It should start with *-----BEGIN CERTIFICATE-----* and end with *-----END CERTIFICATE-----*. 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 /t /f certificate\certificate.pfx /p '${{ secrets.WIN_SIGNING_CERT_PASSWORD }}' + +``` + +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@v2 + - 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@v2 + - 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. + jobs: + package: + strategy: + matrix: + platform: [ windows-latest, macos-latest ] + go-version: [1.18] + runs-on: ${{ matrix.platform }} + steps: + - uses: actions/checkout@v2 + - 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. +``` + +For code signing on macOS, [gon](https://github.com/mitchellh/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 mitchellh/gon/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": "@env:APPLE_PASSWORD" + }, + "sign" :{ + "application_identity" : "Developer ID Application: My Name" + } + } +``` + +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 +``` + +2. entitlements.plist: + +```plist + + + + + com.apple.security.app-sandbox + + com.apple.security.network.client + + com.apple.security.network.server + + com.apple.security.files.user-selected.read-write + + com.apple.security.files.downloads.read-write + + + +``` + +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 + + + CFBundlePackageTypeAPPL + CFBundleNameMyApp + CFBundleExecutableapp + CFBundleIdentifierapp.myapp + CFBundleVersion0.1.0 + CFBundleGetInfoStringMy app is cool and nice and chill and + CFBundleShortVersionString0.1.0 + CFBundleIconFileiconfile + LSMinimumSystemVersion10.13.0 + NSHighResolutionCapabletrue + LSApplicationCategoryTypepublic.app-category.utilities + NSHumanReadableCopyright© Me + +``` + +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@v2 + - 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 mitchellh/gon/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. + - 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 mitchellh/gon/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. +``` + +# 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). diff --git a/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/templates.mdx b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/templates.mdx new file mode 100644 index 000000000..df75cbbc7 --- /dev/null +++ b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/templates.mdx @@ -0,0 +1,95 @@ +# Templates + +Wails generates projects from pre-created templates. In v1, this was a difficult to maintain set of projects that were subject to going out of date. In v2, to empower the community, a couple of new features have been added for templates: + +- Ability to generate projects from [Remote Templates](../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: + +
+ +
+ +## 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 diff --git a/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/troubleshooting.mdx b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/troubleshooting.mdx new file mode 100644 index 000000000..b6a73efa5 --- /dev/null +++ b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/troubleshooting.mdx @@ -0,0 +1,137 @@ +# 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 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 +NSAppTransportSecurity + + NSAllowsLocalNetworking + + +``` + +Reference: https://github.com/wailsapp/wails/issues/1504#issuecomment-1174317433 + +## Mac application not valid + +If your built application looks like this in finder: + +

+ +

+ +it's likely that your application's `info.plist` is invalid. Update the file in `build/.app/Contents/info.plist` and check if the data is valid, EG check the binary name is correct. To persist the changes, copy the file back to the `build/darwin` directory. + +## Cannot call backend method from frontend with variadic arguments + +If you have a backend method defined with variadic parameters, eg: + +```go +func (a *App) TestFunc(msg string, args ...interface{}) error { + // Code +} +``` + +calling this method from the frontend like this will fail: + +```js +var msg = "Hello: " +var args = ["Go", "JS"] +window.go.main.App.TestFunc(msg, ...args).then((result) => { + //do things here +}).catch((error) => { + //handle error +}); +``` + +Workaround: + +```js +var msg = "Hello " +var args = ["Go", "JS"] +window.go.main.App.TestFunc(msg, args).then((result) => { //without the 3 dots + //do things here +}).catch((error) => { + //handle error +}); +``` + +Credit: https://github.com/wailsapp/wails/issues/1186 + +## I'm having getting proxy errors when trying to install Wails + +If you are getting errors like this: + +``` +"https://proxy.golang.org/github.com/wailsapp/wails/cmd/wails/@v/list": dial tcp 172.217.163.49:443: connectex: A connection attempt failed because the connected party did not properly respond after a period of time, or established connection failed because connected host has failed to respond. +``` + +it's probably because the official Go Proxy is being blocked (Users in China have reported this). The solution is to set up the proxy manually, eg: + +``` +go env -w GO111MODULE=on +go env -w GOPROXY=https://goproxy.cn,direct +``` + +Source: https://github.com/wailsapp/wails/issues/1233 + +## 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 `` section of any new page you navigate to: + +```html + + + + +``` + +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. + +Source: https://github.com/wailsapp/wails/issues/1806 \ No newline at end of file diff --git a/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/vscode.mdx b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/vscode.mdx new file mode 100644 index 000000000..ed258656d --- /dev/null +++ b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/vscode.mdx @@ -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. diff --git a/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/windows-installer.mdx b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/windows-installer.mdx new file mode 100644 index 000000000..249ec5527 --- /dev/null +++ b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/windows-installer.mdx @@ -0,0 +1,56 @@ +# NSIS installer + +

+ +
+

+ +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. + +If you use the chocolatey package manager, run the following script: + +``` +choco install nsis +``` + +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. diff --git a/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/windows.mdx b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/windows.mdx new file mode 100644 index 000000000..821808c0b --- /dev/null +++ b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/windows.mdx @@ -0,0 +1,61 @@ +# 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. + +## 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). diff --git a/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/howdoesitwork.mdx b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/howdoesitwork.mdx new file mode 100644 index 000000000..0063b47a6 --- /dev/null +++ b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/howdoesitwork.mdx @@ -0,0 +1,356 @@ +--- +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. + +
+ +
+ +## The Main Application + +### Overview + +The main application consists of a single call to `wails.Run()`. It accepts the application configuration which describes the size of the application window, the window title, what assets to use, etc. A basic application might look like this: + +```go title="main.go" +package main + +import ( + "embed" + "log" + + "github.com/wailsapp/wails/v2" + "github.com/wailsapp/wails/v2/pkg/options" +) + +//go:embed frontend/dist +var assets embed.FS + +func main() { + + app := &App{} + + err := wails.Run(&options.App{ + Title: "Basic Demo", + Width: 1024, + Height: 768, + Assets: &assets, + OnStartup: app.startup, + OnShutdown: app.shutdown, + Bind: []interface{}{ + app, + }, + }) + if err != nil { + log.Fatal(err) + } +} + + +type App struct { + ctx context.Context +} + +func (b *App) startup(ctx context.Context) { + b.ctx = ctx +} + +func (b *App) shutdown(ctx context.Context) {} + +func (b *App) Greet(name string) string { + return fmt.Sprintf("Hello %s!", name) +} +``` + +### Options rundown + +This example has the following options set: + +- `Title` - The text that should appear in the window's title bar +- `Width` & `Height` - The dimensions of the window +- `Assets` - The application's frontend assets +- `OnStartup` - A callback for when the window is created and is about to start loading the frontend assets +- `OnShutdown` - A callback for when the application is about to quit +- `Bind` - A slice of struct instances that we wish to expose to the frontend + +A full list of application options can be found in the [Options Reference](reference/options). + +#### Assets + +The `Assets` option is mandatory as you can't have a Wails application without frontend assets. Those assets can be any files you would expect to find in a web application - html, js, css, svg, png, etc. **There is no requirement to generate asset bundles** - plain files will do. When the application starts, it will attempt to load `index.html` from your assets and the frontend will essentially work as a browser from that point on. It is worth noting that there is no requirement on where in the `embed.FS` the files live. It is likely that the embed path uses a nested directory relative to your main application code, such as `frontend/dist`: + +```go title="main.go" +//go:embed frontend/dist +var assets embed.FS +``` + +At startup, Wails will iterate the embedded files looking for the directory containing `index.html`. All other assets will be loaded relative to this directory. + +As production binaries use the files contained in `embed.FS`, there are no external files required to be shipped with the application. + +When running in development mode using the `wails dev` command, the assets are loaded off disk, and any changes result in a "live reload". The location of the assets will be inferred from the `embed.FS`. + +More details can be found in the [Application Development Guide](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 {16,24} title="main.go" +package main + +import ( + "embed" + "log" + + "github.com/wailsapp/wails/v2" + "github.com/wailsapp/wails/v2/pkg/options" +) + +//go:embed frontend/dist +var assets embed.FS + +func main() { + + app := &App{} + + err := wails.Run(&options.App{ + Title: "Basic Demo", + Width: 1024, + Height: 768, + Assets: &assets, + 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 {8-10} + //... + err := wails.Run(&options.App{ + Title: "Basic Demo", + Width: 1024, + Height: 768, + Assets: &assets, + Bind: []interface{}{ + app, + &mystruct1{}, + &mystruct2{}, + }, + }) + +``` + +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; +``` + +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. Note: If you wish to use structs, you **must** define `json` struct tags for your fields! + +:::info Note +Anonymous nested structs are not supported at this time. +::: + +It is 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; +``` + +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) { + 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). + +[^1]: There is a very small subset of libraries that use features unsupported in WebViews. There are often alternatives and workarounds for such cases. diff --git a/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/introduction.mdx b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/introduction.mdx new file mode 100644 index 000000000..5a832a69e --- /dev/null +++ b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/introduction.mdx @@ -0,0 +1,71 @@ +--- +sidebar_position: 1 +--- + +# Введение + +Wails - это проект, позволяющий писать настольные приложения с использованием Go и web технологий. + +Считайте, что это легкая и быстрая альтернатива Electron для Go. Вы можете легко создавать приложения с гибкостью и мощностью Go, в сочетании с богатым современным фронтендом. + +### 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://vite.net/) +- Powerful CLI to easily Create, Build and Package applications +- A rich [runtime library](/docs/next/reference/runtime) +- Applications built with Wails are Apple & Microsoft Store compliant + + +Например, [varly](https://varly.app) - настольное приложение для MacOS & Windows, написанное с помощью Wails. Оно не только великолепно выглядит, но и использует системные меню и полупрозрачность - все, что можно ожидать от современного нативного приложения. + +

+ + + +

+ +### Шаблоны для быстрого начала + +Wails поставляется с рядом предварительно настроенных шаблонов, которые позволяют вам быстро создать и запустить ваше приложение. Есть шаблоны для следующих фреймворков: Svelte, React, Vue, Preact, Lit и Vanilla. Для каждого шаблона есть и Javascript и Typescript версия. + +### Системные элементы + +Wails использует специально созданную библиотеку для обработки системных элементов, таких как окна, меню, диалоги и так далее, чтобы вы могли создавать хорошо выглядящие, богатые функционалом приложения. + +**It does not embed a browser**, so it is resource efficient. Вместо этого он использует нативный движок отрисовки для необходимой платформы. На Windows это новая библиотека Microsoft Webview2, основанная на Chromium. + +### Взаимодействие Go & Javascript + +Wails автоматически делает ваши методы на Go доступными в Javascript, чтобы вы могли вызывать их по имени! 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. + +### Библиотека среды выполнения + +Wails предоставляет библиотеку среды выполнения для Go и Javascript, которая справляется со многими вещями, нужными для современный приложений, например, работа с событими, логирование, диалоги и так далее. + +### Опыт разработки в реальном времени + +#### Автоматическая пересборка + +Когда вы запускаете ваше приложение в режиме разработки, Wails будет собирать его, но читать ресурсы с диска. Он будет отслеживать любые изменения в вашем коде на Go и автоматически пересобирать и перезапускать приложение. + +#### Автоматическая перезагрузка + +When changes to your application assets are detected, your running application will "reload", reflecting your changes almost immediately. + +#### Разрабатывайте приложение в браузере + +Если вы предпочитаете отладку и разработку в браузере, то Wails это умеет. Запущенное приложение также имеет веб-сервер который будет запускать ваше приложение в любом браузере который к нему прилоединится. Он будет перезапускаться когда ресурсы на вашем диске изменятся. + +### Бинарные файлы, готовые к выпуску + +Когда вы готовы сделать финальную сборку вашего приложения, CLI соберет всё в один исполняемый файл со всеми ресурсами внутри. На Windows и MacOS есть возможность создать нативный установочный пакет для распространения. 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. + +### Инструментарий + +Wails CLI предоставляет легкий способ генерировать, собирать и упаковывать ваши приложения. Оно создаст иконки, соберет ваше приложение с оптимальными параметрами и создаст готовый для распространения исполняемый файл. Выберите из нескольких стартовых шаблонов для быстрого старта! diff --git a/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/_category_.json b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/_category_.json new file mode 100644 index 000000000..ebb337b83 --- /dev/null +++ b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/_category_.json @@ -0,0 +1,4 @@ +{ + "label": "Reference", + "position": 40 +} diff --git a/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/cli.mdx b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/cli.mdx new file mode 100644 index 000000000..5a00db158 --- /dev/null +++ b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/cli.mdx @@ -0,0 +1,221 @@ +--- +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 ` + +## init + +`wails init` is used for generating projects. + +| Flag | Description | Default | +|:------------------ |:----------------------------------------------------------------------------------------------------------------------- |:-------------------:| +| -n "project name" | Name of the project. **Mandatory**. | | +| -d "project dir" | Project directory to create | Name of the project | +| -g | Initialise git repository | | +| -l | List available project templates | | +| -q | Suppress output to console | | +| -t "template name" | The project template to use. This can be the name of a default template or a URL to a remote template hosted on github. | vanilla | +| -ide | Generate IDE project files | | +| -f | Force build application | false | + +Example: `wails init -n test -d mytestproject -g -ide vscode -q` + +This will generate a a project called "test" in the "mytestproject" directory, initialise git, generate vscode project files and do so silently. + +More information on using IDEs with Wails can be found [here](../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 | +|:-------------------- |:--------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |:--------------------------------------------------------------------------------------------------------------------------------------------------- | +| -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`.
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 | 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" | | +| -upxflags | Flags to pass to upx | | +| -v int | Verbosity level (0 - silent, 1 - default, 2 - verbose) | 1 | +| -webview2 | WebView2 installer strategy: download,embed,browser,error | download | +| -u | Updates your project's `go.mod` to use the same version of Wails as the CLI | | +| -debug | Retains debug information in the application. 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. + +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 UPX on Apple Silicon + +There are [issues](https://github.com/upx/upx/issues/446) with using UPX with Apple Silicon. + +::: + +:::info UPX on Windows + +Some Antivirus vendors false positively mark `upx` compressed binaries as virus, see [issue](https://github.com/upx/upx/issues/437). + +::: + +### Platforms + +Supported platforms are: + +| Platform | Description | +|:---------------- |:--------------------------------------------- | +| darwin | MacOS + architecture of build machine | +| darwin/amd64 | MacOS 10.13+ AMD64 | +| darwin/arm64 | MacOS 11.0+ ARM64 | +| darwin/universal | MacOS AMD64+ARM64 universal application | +| windows | Windows 10/11 + architecture of build machine | +| windows/amd64 | Windows 10/11 AMD64 | +| windows/arm64 | Windows 10/11 ARM64 | +| linux | Linux + architecture of build machine | +| linux/amd64 | Linux AMD64 | +| linux/arm64 | Linux ARM64 | + +## doctor + +`wails doctor` will run diagnostics to ensure that your system is ready for development. + +Example: + +``` +Wails CLI v2.0.0-beta + +Scanning system - Please wait (this may take a long time)...Done. + +System +------ +OS: Windows 10 Pro +Version: 2009 (Build: 19043) +ID: 21H1 +Go Version: go1.17 +Platform: windows +Architecture: amd64 + +Dependency Package Name Status Version +---------- ------------ ------ ------- +WebView2 N/A Installed 93.0.961.52 +npm N/A Installed 6.14.15 +*upx N/A Installed upx 3.96 + +* - Optional Dependency + +Diagnosis +--------- +Your system is ready for Wails development! + +``` + +## dev + +`wails dev` is used to run your application in a "live development" mode. This means: + +- The application's `go.mod` will be updated to use the same version of Wails as the CLI +- The application is compiled and run automatically +- A watcher is started and will trigger a rebuild of your dev app if it detects changes to your go files +- A webserver is started on `http://localhost:34115` which serves your application (not just frontend) over http. This allows you to use your favourite browser development extensions +- All application assets are loaded from disk. If they are changed, the application will automatically reload (not rebuild). All connected browsers will also reload +- A JS module is generated that provides the following: + - Javascript wrappers of your Go methods with autogenerated JSDoc, providing code hinting + - TypeScript versions of your Go structs, that can be constructed and passed to your go methods +- A second JS module is generated that provides a wrapper + TS declaration for the runtime + +| Flag | Description | Default | +|:---------------------------- |:----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |:--------------------- | +| -assetdir "./path/to/assets" | Serve assets from the given directory instead of using the provided asset FS | Value in `wails.json` | +| -browser | Opens a browser to `http://localhost:34115` on startup | | +| -compiler "compiler" | Use a different go compiler to build, eg go1.15beta1 | go | +| -e | Extensions to trigger rebuilds (comma separated) | go | +| -reloaddirs | Additional directories to trigger reloads (comma separated) | Value in `wails.json` | +| -ldflags "flags" | Additional ldflags to pass to the compiler | | +| -tags "extra tags" | Build tags to pass to compiler (quoted and space separated) | | +| -loglevel "loglevel" | Loglevel to use - Trace, Debug, Info, Warning, Error | Debug | +| -noreload | Disable automatic reload when assets change | | +| -nogen | Disable generate module | | +| -v | Verbosity level (0 - silent, 1 - standard, 2 - verbose) | 1 | +| -wailsjsdir | The directory to generate the generated Wails JS modules | Value in `wails.json` | +| -debounce | The time to wait for reload after an asset change is detected | 100 (milliseconds) | +| -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 | | +| -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: + +`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. + +## 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. diff --git a/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/menus.mdx b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/menus.mdx new file mode 100644 index 000000000..565c8cb48 --- /dev/null +++ b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/menus.mdx @@ -0,0 +1,266 @@ +--- +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 + AppMenu := menu.NewMenu() + FileMenu := AppMenu.AddSubmenu("File") + FileMenu.AddText("&Open", keys.CmdOrCtrl("o"), openFile) + FileMenu.AddSeparator() + FileMenu.AddText("Quit", keys.CmdOrCtrl("q"), func(_ *menu.CallbackData) { + runtime.Quit() + }) + + if runtime.GOOS == "darwin" { + AppMenu.Append(menu.EditMenu()) // on macos platform, we should append EditMenu to enable Cmd+C,Cmd+V,Cmd+Z... shortcut + } + + err := wails.Run(&options.App{ + Title: "Menus Demo", + Width: 800, + Height: 600, + Menu: AppMenu, + 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" +## Menu + +A Menu is a collection of MenuItems: + +```go title="Package: github.com/wailsapp/wails/v2/pkg/menu" +type Menu struct { + Items []*MenuItem +} +``` + +For the Application menu, each MenuItem represents a single menu such as "Edit". + +A simple helper method is provided for building menus: + +```go title="Package: github.com/wailsapp/wails/v2/pkg/menu" +func NewMenuFromItems(first *MenuItem, rest ...*MenuItem) *Menu +``` + +This makes the layout of the code more like that of a menu without the need to add the menu items manually after creating them. Alternatively, you can just create the menu items and add them to the menu manually. + +## MenuItem + +A MenuItem represents an item within a Menu. + +```go title="Package: github.com/wailsapp/wails/v2/pkg/menu" +// MenuItem represents a menu item contained in a menu +type MenuItem struct { + Label string + Role Role + Accelerator *keys.Accelerator + Type Type + Disabled bool + Hidden bool + Checked bool + SubMenu *Menu + Click Callback +} +``` + +| Field | Type | Notes | +| ----------- | ------------------------------------ | ------------------------------------------------------------- | +| Label | string | The menu text | +| Accelerator | [\*keys.Accelerator](#accelerator) | Key binding for this menu item | +| Type | [Type](#type) | Type of MenuItem | +| Disabled | bool | Disables the menu item | +| Hidden | bool | Hides this menu item | +| Checked | bool | Adds check to item (Checkbox & Radio types) | +| SubMenu | [\*Menu](#menu) | Sets the submenu | +| Click | [Callback](#callback) | Callback function when menu clicked | +| Role | string | Defines a [role](#role) for this menu item. Mac only for now. | + +### Accelerator + +Accelerators (sometimes called keyboard shortcuts) define a binding between a keystroke and a menu item. Wails defines an Accelerator as a combination or key + [Modifier](#modifier). They are available in the `"github.com/wailsapp/wails/v2/pkg/menu/keys"` package. + +Example: + +```go title="Package: github.com/wailsapp/wails/v2/pkg/menu/keys" + // Defines cmd+o on Mac and ctrl-o on Window/Linux + myShortcut := keys.CmdOrCtrl("o") +``` + +Keys are any single character on a keyboard with the exception of `+`, which is defined as `plus`. Some keys cannot be represented as characters so there are a set of named characters that may be used: + +- `backspace` +- `tab` +- `return` +- `enter` +- `escape` +- `left` +- `right` +- `up` +- `down` +- `space` +- `delete` +- `home` +- `end` +- `page up` +- `page down` +- `f1` +- `f2` +- `f3` +- `f4` +- `f5` +- `f6` +- `f7` +- `f8` +- `f9` +- `f10` +- `f11` +- `f12` +- `f13` +- `f14` +- `f15` +- `f16` +- `f17` +- `f18` +- `f19` +- `f20` +- `f21` +- `f22` +- `f23` +- `f24` +- `f25` +- `f26` +- `f27` +- `f28` +- `f29` +- `f30` +- `f31` +- `f32` +- `f33` +- `f34` +- `f35` +- `numlock` + +Wails also supports parsing accelerators using the same syntax as Electron. This is useful for storing accelerators in config files. + +Example: + +```go title="Package: github.com/wailsapp/wails/v2/pkg/menu/keys" + // Defines cmd+o on Mac and ctrl-o on Window/Linux + myShortcut, err := keys.Parse("Ctrl+Option+A") +``` + +#### Modifier + +The following modifiers are keys that may be used in combination with the accelerator key: + +```go title="Package: github.com/wailsapp/wails/v2/pkg/menu/keys" +const ( + // CmdOrCtrlKey represents Command on Mac and Control on other platforms + CmdOrCtrlKey Modifier = "cmdorctrl" + // OptionOrAltKey represents Option on Mac and Alt on other platforms + OptionOrAltKey Modifier = "optionoralt" + // ShiftKey represents the shift key on all systems + ShiftKey Modifier = "shift" + // ControlKey represents the control key on all systems + ControlKey Modifier = "ctrl" +) +``` + +A number of helper methods are available to create Accelerators using modifiers: + +```go title="Package: github.com/wailsapp/wails/v2/pkg/menu/keys" +func CmdOrCtrl(key string) *Accelerator +func OptionOrAlt(key string) *Accelerator +func Shift(key string) *Accelerator +func Control(key string) *Accelerator +``` + +Modifiers can be combined using `keys.Combo(key string, modifier1 Modifier, modifier2 Modifier, rest ...Modifier)`: + +```go title="Package: github.com/wailsapp/wails/v2/pkg/menu/keys" + // Defines "Ctrl+Option+A" on Mac and "Ctrl+Alt+A" on Window/Linux + myShortcut := keys.Combo("a", ControlKey, OptionOrAltKey) +``` + +### Type + +Each menu item must have a type and there are 5 types available: + +```go title="Package: github.com/wailsapp/wails/v2/pkg/menu" +const ( + TextType Type = "Text" + SeparatorType Type = "Separator" + SubmenuType Type = "Submenu" + CheckboxType Type = "Checkbox" + RadioType Type = "Radio" +) +``` + +For convenience, helper methods are provided to quickly create a menu item: + +```go title="Package: github.com/wailsapp/wails/v2/pkg/menu" +func Text(label string, accelerator *keys.Accelerator, click Callback) *MenuItem +func Separator() *MenuItem +func Radio(label string, selected bool, accelerator *keys.Accelerator, click Callback) *MenuItem +func Checkbox(label string, checked bool, accelerator *keys.Accelerator, click Callback) *MenuItem +func SubMenu(label string, menu *Menu) *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()` | diff --git a/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/options.mdx b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/options.mdx new file mode 100644 index 000000000..90620aa77 --- /dev/null +++ b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/options.mdx @@ -0,0 +1,627 @@ +--- +sidebar_position: 3 +--- + +# Options + +## Application Options + +The `Options.App` struct contains the application configuration. It is passed to the `wails.Run()` method: + +```go title="Example" +import "github.com/wailsapp/wails/v2/pkg/options" + +func main() { + + err := wails.Run(&options.App{ + Title: "Menus Demo", + Width: 800, + Height: 600, + DisableResize: false, + Fullscreen: false, + Frameless: true, + MinWidth: 400, + MinHeight: 400, + MaxWidth: 1280, + MaxHeight: 1024, + StartHidden: false, + HideWindowOnClose: false, + BackgroundColour: &options.RGBA{R: 0, G: 0, B: 0, A: 255}, + AlwaysOnTop: false, + Assets: assets, + AssetsHandler: assetsHandler, + Menu: app.applicationMenu(), + Logger: nil, + LogLevel: logger.DEBUG, + LogLevelProduction: logger.ERROR, + OnStartup: app.startup, + OnDomReady: app.domready, + OnShutdown: app.shutdown, + OnBeforeClose: app.beforeClose, + WindowStartState: options.Maximised, + CSSDragProperty: "--wails-draggable", + CSSDragValue: "drag", + Bind: []interface{}{ + app, + }, + Windows: &windows.Options{ + WebviewIsTransparent: false, + WindowIsTranslucent: 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), + }, + // User messages that can be customised + Messages *windows.Messages + }, + Mac: &mac.Options{ + TitleBar: &mac.TitleBar{ + TitlebarAppearsTransparent: true, + HideTitle: false, + HideTitleBar: false, + FullSizeContent: false, + UseToolbar: false, + HideToolbarSeparator: true, + }, + Appearance: mac.NSAppearanceNameDarkAqua, + WebviewIsTransparent: true, + WindowIsTranslucent: false, + About: &mac.AboutInfo{ + Title: "My Application", + Message: "© 2021 Me", + Icon: icon, + }, + }, + Linux: &linux.Options{ + Icon: icon, + }, + }) + if err != nil { + log.Fatal(err) + } +} + +``` + +### Title + +The text shown in the window's title bar. + +Type: string + +### Width + +The initial width of the window. + +Name: Width + +### Height + +Type: int + +Type: [AppearanceType](#appearance-type) + +### DisableResize + +By default, the main window is resizable. Setting this to `true` will keep it a fixed size. + +Type: int + +### Fullscreen + +Setting this to `true` will make the window fullscreen at startup. + +Type: int + +### Frameless + +When set to `true`, the window will have no borders or title bar. Also see [Frameless Windows](../guides/frameless.mdx). + +Type: int + +### 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. + +Type: bool + +### 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. + +Type: bool + +### 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. + +Type: bool + +### 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. + +Type: bool + +### StartHidden + +When set to `true`, the application will be hidden until [WindowShow](../reference/runtime/window.mdx#windowshow) is called. + +Type: int +### HideWindowOnClose + +By default, closing the window will close the application. Setting this to `true` means closing the window will hide the window instead. + +hide the window instead. + +Type: int + +### BackgroundColour + +This value is the default background colour of the window. Default: white + +Type: *options.RGBA Example: options.NewRGBA(255,0,0,128) - Red at 50% transparency + +### AlwaysOnTop + +Indicates that the window should stay above other windows when losing focus. + +Type: int + +### Assets + +The frontend assets to be used by the application. Requires an `index.html` file. + +Name: StartHidden + +### AssetsHandler + + + +When set to `true`, the application will be hidden until [WindowShow](../reference/runtime/window.mdx#windowshow) is called. + +| Value | 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. + +Type: http.Handler + +### 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. ::: + +Type: \*menu.Menu + +### Logger + +The logger to be used by the application. More details about logging in the [Log Reference](../reference/runtime/log.mdx). + +Type: bool + +### LogLevel + +The default log level. More details about logging in the [Log Reference](../reference/runtime/log.mdx). + +Name: Assets + +### LogLevelProduction + +The default log level for production builds. More details about logging in the [Log Reference](../reference/runtime/log.mdx). + +Type: logger.LogLevel + +### 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: AssetsHandler + +### OnDomReady + +This callback is called after the frontend has loaded `index.html` and its resources. It is given the application context. + +Name: AssetsHandler + +### OnShutdown + +This callback is called after the frontend has been destroyed, just before the application terminates. It is given the application context. + +Name: AssetsHandler + +### 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" +} +``` + +Type: func(ctx context.Context) bool + +### WindowStartState + +Defines how the window should present itself at startup. + +| Value | Win | Mac | Lin | +| ---------- | --- | --- | --- | +| Fullscreen | ✅ | ✅ | ✅ | +| Maximised | ✅ | ✅ | ✅ | +| Minimised | ✅ | ❌ | ✅ | + +Name: Logger + +### CSSDragProperty + +Indicates the CSS property to use to identify which elements can be used to drag the window. Default: `--wails-draggable`. + +Type: string + +### CSSDragValue + +Indicates what value the `CSSDragProperty` style should have to drag the window. Default: `drag`. + +Type: string + +### Bind + +A slice of struct instances defining methods that need to be bound to the frontend. + +Default: Logger to Stdout + +### Windows + +This defines [Windows specific options](#windows-specific-options). + +Name: LogLevel + +### Mac + +This defines [Mac specific options](#mac-specific-options). + +Default: `Info` in dev mode, `Error` in production mode + +### Linux + +This defines [Linux specific options](#linux-specific-options). + +Name: LogLevelProduction + +## Windows Specific 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. + +Type: int + +### WindowIsTranslucent + +Setting this to `true` will make the window background translucent. Often combined with [WebviewIsTransparent](#WebviewIsTransparent) to make frosty-looking applications. + +Type: int + +### DisableWindowIcon + +Setting this to `true` will remove the icon in the top left corner of the title bar. + +Type: int + +### 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. + +Type: int + +### WebviewUserDataPath + +This defines the path where the WebView2 stores the user data. If empty `%APPDATA%\[BinaryName.exe]` will be used. + +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) + +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 | + +Type: `windows.Theme` + +### CustomTheme + +Name: WindowStartState + +Type: options.WindowStartState + +Type: `windows.CustomTheme` + +#### Name: CustomTheme + +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 + +Name: Windows + +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. + +Type: \*mac.Options + +### OnSuspend + +If set, this function will be called when windows initiates a switch to low power mode (suspend/hibernate) + +Name: Linux + +### OnResume + +If set, this function will be called when windows resumes from low power mode (suspend/hibernate) + +Name: Linux + +## Mac Specific Options + +### TitleBar + +The TitleBar struct provides the ability to configure the look and feel of the title bar. + +Type: bool + + +### 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: WindowIsTranslucent + +### 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. + +Type: int + +### WindowIsTranslucent + +Setting this to `true` will make the window background translucent. Often combined with [WebviewIsTransparent](#WebviewIsTransparent) to make frosty-looking applications. + +Type: int + +### 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: DisableFramelessWindowDecorations + + +#### 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 type + +You can specify the application's [appearance](https://developer.apple.com/documentation/appkit/nsappearance?language=objc). + +| Value | Description | +| ----------------------------------------------------- | --------------------------------------------------------------- | +| DefaultAppearance | DefaultAppearance uses the default system value | +| NSAppearanceNameAqua | The standard light system appearance | +| NSAppearanceNameDarkAqua | The standard dark system appearance | +| NSAppearanceNameVibrantLight | The light vibrant appearance | +| NSAppearanceNameAccessibilityHighContrastAqua | A high-contrast version of the standard light system appearance | +| NSAppearanceNameAccessibilityHighContrastDarkAqua | A high-contrast version of the standard dark system appearance | +| NSAppearanceNameAccessibilityHighContrastVibrantLight | A high-contrast version of the light vibrant appearance | +| NSAppearanceNameAccessibilityHighContrastVibrantDark | A high-contrast version of the dark vibrant appearance | + +Example: + +```go +Mac: &mac.Options{ + Appearance: mac.NSAppearanceNameDarkAqua, +} +``` + +#### About struct + +```go +type AboutInfo struct { + Title string + Message string + Icon []byte +} +``` + +If these settings are provided, an "About" menu item will appear in the app menu (when using the `AppMenu` role). Given this configuration: + +```go +//go:embed build/appicon.png +var icon []byte + +func main() { + err := wails.Run(&options.App{ + ... + Mac: &mac.Options{ + About: &mac.AboutInfo{ + Title: "My Application", + Message: "© 2021 Me", + Icon: icon, + }, + }, + }) +``` + +The "About" menu item will appear in the app menu: + +
+ +
+ +
+ +When clicked, that will open an about message box: + +
+ +
+ +
+ +## Linux Specific Options + +### Icon + +Sets up the icon representing the window. This icon is used when the window is minimized (also known as iconified). + +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. diff --git a/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/project-config.mdx b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/project-config.mdx new file mode 100644 index 000000000..3dc1cf002 --- /dev/null +++ b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/project-config.mdx @@ -0,0 +1,51 @@ +--- +sidebar_position: 5 +--- + +# Project Config + +The project config resides in the `wails.json` file in the project directory. The structure of the config is: + +```json +{ + "name": "[The project name]", + "assetdir": "[Relative path to the directory containing the compiled assets, this is normally inferred and could be left empty]", + "reloaddirs": "[Additional directories to trigger reloads (comma separated), this is only used for some advanced asset configurations]", + "frontend:install": "[The command to install node dependencies, run in the frontend directory - often `npm install`]", + "frontend:build": "[The command to build the assets, run in the frontend directory - often `npm run build`]", + "frontend:dev": "[This command has been replaced by frontend:dev:build. If frontend:dev:build is not specified will falls back to this command. If this command is also not specified will falls back to frontend:build]", + "frontend:dev:build": "[This command is the dev equivalent of frontend:build. If not specified falls back to frontend:dev]", + "frontend:dev:install": "[This command is the dev equivalent of frontend:install. If not specified falls back to frontend:install]", + "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. 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]", + "debounceMS": 100, // The default time the dev server waits to reload when it detects a change in assets + "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.]", + "*/*": "[The command that will be executed after every build: ${platform} is replaced with the "GOOS/GOARCH" and ${bin} with the path to the compiled binary.]" + }, + "info": { // Data used to populate manifests and version info. + "companyName": "[The company name. Default: [The project name]]", + "productName": "[The product name. Default: [The project name]]", + "productVersion": "[The version of the product. Default: '1.0.0']", + "copyright": "[The copyright of the product. Default: 'Copyright.........']", + "comments": "[A short comment of the app. Default: 'Built using Wails (https://wails.app)']" + }, + "nsisType": "['multiple': One installer per architecture. 'single': Single universal installer for all architectures being built. Default: 'multiple']" +} +``` + +This file is read by the Wails CLI when running `wails build` or `wails dev`. + +The `assetdir`, `reloaddirs`, `wailsjsdir`, `debounceMS`, `devserver` and `frontenddevserverurl` flags in `wails build/dev` will update the project config and thus become defaults for subsequent runs. diff --git a/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/_category_.json b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/_category_.json new file mode 100644 index 000000000..ac6d55488 --- /dev/null +++ b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/_category_.json @@ -0,0 +1,4 @@ +{ + "label": "Runtime", + "position": 1 +} diff --git a/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/browser.mdx b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/browser.mdx new file mode 100644 index 000000000..976ca1d80 --- /dev/null +++ b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/browser.mdx @@ -0,0 +1,14 @@ +--- +sidebar_position: 7 +--- + +# Browser + +These methods are related to the system browser. + +### BrowserOpenURL + +Opens the given URL in the system browser. + +Go: `BrowserOpenURL(ctx context.Context, url string)`
JS: `BrowserOpenURL(url string)` + diff --git a/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/dialog.mdx b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/dialog.mdx new file mode 100644 index 000000000..bf1dd7246 --- /dev/null +++ b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/dialog.mdx @@ -0,0 +1,283 @@ +--- +sidebar_position: 5 +--- + +# Dialog + +This part of the runtime provides access to native dialogs, such as File Selectors and Message boxes. + +:::info Javascript + Dialog is currently unsupported in the JS runtime. +::: + +### OpenDirectoryDialog + +Opens a dialog that prompts the user to select a directory. Can be customised using [OpenDialogOptions](#opendialogoptions). + +Go: `OpenDirectoryDialog(ctx context.Context, dialogOptions OpenDialogOptions) (string, error)` + +Returns: Selected directory (blank if the user cancelled) or an error + +### OpenFileDialog + +Opens a dialog that prompts the user to select a file. Can be customised using [OpenDialogOptions](#opendialogoptions). + +Go: `OpenFileDialog(ctx context.Context, dialogOptions OpenDialogOptions) (string, error)` + +Returns: Selected file (blank if the user cancelled) or an error + +### OpenMultipleFilesDialog + +Opens a dialog that prompts the user to select multiple files. Can be customised using [OpenDialogOptions](#opendialogoptions). + +Go: `OpenMultipleFilesDialog(ctx context.Context, dialogOptions OpenDialogOptions) ([]string, error)` + +Returns: Selected files (nil if the user cancelled) or an error + +### SaveFileDialog + +Opens a dialog that prompts the user to select a filename for the purposes of saving. Can be customised using [SaveDialogOptions](#savedialogoptions). + +Go: `SaveFileDialog(ctx context.Context, dialogOptions SaveDialogOptions) (string, error)` + +Returns: The selected file (blank if the user cancelled) or an error + +### MessageDialog + +Displays a message using a message dialog. Can be customised using [MessageDialogOptions](#messagedialogoptions). + +Go: `MessageDialog(ctx context.Context, dialogOptions MessageDialogOptions) (string, error)` + +Returns: The text of the selected button or an error + +## Options + +### OpenDialogOptions + +```go +type OpenDialogOptions struct { + DefaultDirectory string + DefaultFilename string + Title string + Filters []FileFilter + ShowHiddenFiles bool + CanCreateDirectories bool + ResolvesAliases bool + TreatPackagesAsDirectories bool +} +``` + +| Field | Description | Win | Mac | Lin | +| -------------------------- | ---------------------------------------------- | --- | --- | --- | +| DefaultDirectory | The directory the dialog will show when opened | ✅ | ✅ | ✅ | +| DefaultFilename | The default filename | ✅ | ✅ | ✅ | +| Title | Title for the dialog | ✅ | ✅ | ✅ | +| [Filters](#filefilter) | A list of file filters | ✅ | ✅ | ✅ | +| ShowHiddenFiles | Show files hidden by the system | | ✅ | ✅ | +| CanCreateDirectories | Allow user to create directories | | ✅ | | +| ResolvesAliases | If true, returns the file not the alias | | ✅ | | +| TreatPackagesAsDirectories | Allow navigating into packages | | ✅ | | + +### SaveDialogOptions + +```go +type SaveDialogOptions struct { + DefaultDirectory string + DefaultFilename string + Title string + Filters []FileFilter + ShowHiddenFiles bool + CanCreateDirectories bool + TreatPackagesAsDirectories bool +} +``` + +| Field | Description | Win | Mac | Lin | +| -------------------------- | ---------------------------------------------- | --- | --- | --- | +| DefaultDirectory | The directory the dialog will show when opened | ✅ | ✅ | ✅ | +| DefaultFilename | The default filename | ✅ | ✅ | ✅ | +| Title | Title for the dialog | ✅ | ✅ | ✅ | +| [Filters](#filefilter) | A list of file filters | ✅ | ✅ | ✅ | +| ShowHiddenFiles | Show files hidden by the system | | ✅ | ✅ | +| CanCreateDirectories | Allow user to create directories | | ✅ | | +| TreatPackagesAsDirectories | Allow navigating into packages | | ✅ | | + +### MessageDialogOptions + +```go +type MessageDialogOptions struct { + Type DialogType + Title string + Message string + Buttons []string + DefaultButton string + CancelButton string +} +``` + +| Field | Description | Win | Mac | Lin | +| ------------- | ------------------------------------------------------------------------- | --- | --- | --- | +| Type | The type of message dialog, eg question, info... | ✅ | ✅ | ✅ | +| Title | Title for the dialog | ✅ | ✅ | ✅ | +| Message | The message to show the user | ✅ | ✅ | ✅ | +| Buttons | A list of button titles | | ✅ | | +| DefaultButton | The button with this text should be treated as default. Bound to `return` | | ✅ | | +| CancelButton | The button with this text should be treated as cancel. Bound to `escape` | | ✅ | | + +#### Windows + +Windows has standard dialog types in which the buttons are not customisable. The value returned will be one of: "Ok", "Cancel", "Abort", "Retry", "Ignore", "Yes", "No", "Try Again" or "Continue" + +#### Linux + +Linux has standard dialog types in which the buttons are not customisable. The value returned will be one of: "Ok", "Cancel", "Yes", "No" + +#### Mac + +A message dialog on Mac may specify up to 4 buttons. If no `DefaultButton` or `CancelButton` is given, the first button is considered default and is bound to the `return` key. + +For the following code: + +```go +selection, err := runtime.MessageDialog(b.ctx, runtime.MessageDialogOptions{ + Title: "It's your turn!", + Message: "Select a number", + Buttons: []string{"one", "two", "three", "four"}, +}) +``` + +the first button is shown as default: + +
+ +
+ +
+ +And if we specify `DefaultButton` to be "two": + +```go +selection, err := runtime.MessageDialog(b.ctx, runtime.MessageDialogOptions{ + Title: "It's your turn!", + Message: "Select a number", + Buttons: []string{"one", "two", "three", "four"}, + DefaultButton: "two", +}) +``` + +the second button is shown as default. When `return` is pressed, the value "two" is returned. + +
+ +
+ +
+ +If we now specify `CancelButton` to be "three": + +```go +selection, err := runtime.MessageDialog(b.ctx, runtime.MessageDialogOptions{ + Title: "It's your turn!", + Message: "Select a number", + Buttons: []string{"one", "two", "three", "four"}, + DefaultButton: "two", + CancelButton: "three", +}) +``` + +the button with "three" is shown at the bottom of the dialog. When `escape` is pressed, the value "three" is returned: + +
+ +
+ +
+
+
+ +#### DialogType + +```go +const ( + InfoDialog DialogType = "info" + WarningDialog DialogType = "warning" + ErrorDialog DialogType = "error" + QuestionDialog DialogType = "question" + ) +``` + +### FileFilter + +```go +type FileFilter struct { + DisplayName string // Filter information EG: "Image Files (*.jpg, *.png)" + Pattern string // semi-colon separated list of extensions, EG: "*.jpg;*.png" +} +``` + +#### Windows + +Windows allows you to use multiple file filters in dialog boxes. Each FileFilter will show up as a separate entry in the dialog: + +
+ +
+ +
+
+
+ +#### Linux + +Linux allows you to use multiple file filters in dialog boxes. Each FileFilter will show up as a separate entry in the dialog: + +
+ +
+ +
+
+
+ +#### Mac + +Mac dialogs only have the concept of a single set of patterns to filter files. If multiple FileFilters are provided, Wails will use all the Patterns defined. + +Example: + +```go + selection, err := runtime.OpenFileDialog(b.ctx, runtime.OpenDialogOptions{ + Title: "Select File", + Filters: []runtime.FileFilter{ + { + DisplayName: "Images (*.png;*.jpg)", + Pattern: "*.png;*.jpg", + }, { + DisplayName: "Videos (*.mov;*.mp4)", + Pattern: "*.mov;*.mp4", + }, + }, + }) +``` + +This will result in the Open File dialog using `*.png,*.jpg,*.mov,*.mp4` as a filter. diff --git a/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/events.mdx b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/events.mdx new file mode 100644 index 000000000..75e8b0a50 --- /dev/null +++ b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/events.mdx @@ -0,0 +1,38 @@ +--- +sidebar_position: 2 +--- + +# Events + +The Wails runtime provides a unified events system, where events can be emitted or received by either Go or Javascript. Optionally, data may be passed with the events. Listeners will receive the data in the local data types. + +### EventsOn + +This method sets up a listener for the given event name. When an event of type `eventName` is [emitted](#EventsEmit), the callback is triggered. Any additional data sent with the emitted event will be passed to the callback. + +Go: `EventsOn(ctx context.Context, eventName string, callback func(optionalData ...interface{}))`
JS: `EventsOn(eventName string, callback function(optionalData?: any))` + +### EventsOff + +This method unregisters the listener for the given event name, optionally multiple listeneres can be unregistered via `additionalEventNames`. + +Go: `EventsOff(ctx context.Context, eventName string, additionalEventNames ...string)`
JS: `EventsOff(eventName string, ...additionalEventNames)` + +### EventsOnce + +This method sets up a listener for the given event name, but will only trigger once. + +Go: `EventsOnce(ctx context.Context, eventName string, callback func(optionalData ...interface{}))`
JS: `EventsOnce(eventName string, callback function(optionalData?: any))` + +### EventsOnMultiple + +This method sets up a listener for the given event name, but will only trigger a maximum of `counter` times. + +Go: `EventsOnMultiple(ctx context.Context, eventName string, callback func(optionalData ...interface{}), counter int)`
JS: `EventsOnMultiple(eventName string, callback function(optionalData?: any), counter int)` + +### EventsEmit + +This method emits the given event. Optional data may be passed with the event. This will trigger any event listeners. + +Go: `EventsEmit(ctx context.Context, eventName string, optionalData ...interface{})`
JS: `EventsEmit(ctx context, optionalData function(optionalData?: any))` + diff --git a/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/intro.mdx b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/intro.mdx new file mode 100644 index 000000000..6c02c71cd --- /dev/null +++ b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/intro.mdx @@ -0,0 +1,73 @@ +--- +sidebar_position: 1 +--- + +# Introduction + +The runtime is a library that provides utility methods for your application. There is both a Go and Javascript runtime and the aim is to try and keep them at parity where possible. + +It has utility methods for: + +- [Window](window.mdx) +- [Menu](menu.mdx) +- [Dialog](dialog.mdx) +- [Events](events.mdx) +- [Browser](browser.mdx) +- [Log](log.mdx) + +The Go Runtime is available through importing `github.com/wailsapp/wails/v2/pkg/runtime`. All methods in this package take a context as the first parameter. This context should be obtained from the [OnStartup](../options.mdx#onstartup) or [OnDomReady](../options.mdx#ondomready) hooks. + +:::info Note + +Whilst the context will be provided to the [OnStartup](../options.mdx#onstartup) method, there's no guarantee the runtime will work in this method as the window is initialising in a different thread. If you wish to call runtime methods at startup, use [OnDomReady](../options.mdx#ondomready). + +::: + +The Javascript library is available to the frontend via the `window.runtime` map. There is a runtime package generated when using `dev` mode that provides Typescript declarations for the runtime. This should be located in the `wailsjs` directory in your frontend directory. + +### Hide + +Go: `Hide(ctx context.Context)`
JS: `Hide()` + +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 + +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`. ::: + +Go: `Show(ctx context.Context)`
JS: `Show()` + +### Quit + +Quits the application. + +Go: `Quit(ctx context.Context)`
JS: `Quit()` + +### Environment + +Returns details of the current environment. + +Go: `Environment(ctx context.Context) EnvironmentInfo`
JS: `Environment(): Promise` + +#### EnvironmentInfo + +Go: +```go +type EnvironmentInfo struct { + BuildType string + Platform string + Arch string +} +``` +JS: +```ts +interface EnvironmentInfo { + buildType: string; + platform: string; + arch: string; +} +``` diff --git a/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/log.mdx b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/log.mdx new file mode 100644 index 000000000..e5e6ea7ac --- /dev/null +++ b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/log.mdx @@ -0,0 +1,130 @@ +--- +sidebar_position: 3 +--- + +# Log + +The Wails runtime provides a logging mechanism that may be called from Go or Javascript. Like most loggers, there are a number of log levels: + +- Trace +- Debug +- Info +- Warning +- Error +- Fatal + +The logger will output any log message at the current, or higher, log level. Example: The `Debug` log level will output all messages except `Trace` messages. + +### LogPrint + +Logs the given message as a raw message. + +Go: `LogPrint(ctx context.Context, message string)`
JS: `LogPrint(message: string)` + +### LogPrintf + +Logs the given message as a raw message. + +Go: `LogPrintf(ctx context.Context, format string, args ...interface{})`
+ +### LogTrace + +Logs the given message at the `Trace` log level. + +Go: `LogTrace(ctx context.Context, message string)`
JS: `LogTrace(message: string)` + +### LogTracef + +Logs the given message at the `Trace` log level. + +Go: `LogTracef(ctx context.Context, format string, args ...interface{})`
+ +### LogDebug + +Logs the given message at the `Debug` log level. + +Go: `LogDebug(ctx context.Context, message string)`
JS: `LogDebug(message: string)` + +### LogDebugf + +Logs the given message at the `Debug` log level. + +Go: `LogDebugf(ctx context.Context, format string, args ...interface{})`
+ +### LogInfo + +Logs the given message at the `Info` log level. + +Go: `LogInfo(ctx context.Context, message string)`
JS: `LogInfo(message: string)` + +### LogInfof + +Logs the given message at the `Info` log level. + +Go: `LogInfof(ctx context.Context, format string, args ...interface{})`
+ +### LogWarning + +Logs the given message at the `Warning` log level. + +Go: `LogWarning(ctx context.Context, message string)`
JS: `LogWarning(message: string)` + +### LogWarningf + +Logs the given message at the `Warning` log level. + +Go: `LogWarningf(ctx context.Context, format string, args ...interface{})`
+ +### LogError + +Logs the given message at the `Error` log level. + +Go: `LogError(ctx context.Context, message string)`
JS: `LogError(message: string)` + +### LogErrorf + +Logs the given message at the `Error` log level. + +Go: `LogErrorf(ctx context.Context, format string, args ...interface{})`
+ +### LogFatal + +Logs the given message at the `Fatal` log level. + +Go: `LogFatal(ctx context.Context, message string)`
JS: `LogFatal(message: string)` + +### LogFatalf + +Logs the given message at the `Fatal` log level. + +Go: `LogFatalf(ctx context.Context, format string, args ...interface{})`
+ +### LogSetLogLevel + +Sets the log level. In Javascript, the number relates to the following log levels: + +| Value | Log Level | +| ----- | --------- | +| 1 | Trace | +| 2 | Debug | +| 3 | Info | +| 4 | Warning | +| 5 | Error | + +Go: `LogSetLogLevel(ctx context.Context, level logger.LogLevel)`
JS: `LogSetLogLevel(level: number)` + +## Using a Custom Logger + +A custom logger may be used by providing it using the [Logger](../options.mdx#logger) application option. The only requirement is that the logger implements the `logger.Logger` interface defined in `github.com/wailsapp/wails/v2/pkg/logger`: + +```go title="logger.go" +type Logger interface { + Print(message string) + Trace(message string) + Debug(message string) + Info(message string) + Warning(message string) + Error(message string) + Fatal(message string) +} +``` diff --git a/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/menu.mdx b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/menu.mdx new file mode 100644 index 000000000..226ff2c68 --- /dev/null +++ b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/menu.mdx @@ -0,0 +1,23 @@ +--- +sidebar_position: 6 +--- + +# Menu + +These methods are related to the application menu. + +:::info Javascript + Menu is currently unsupported in the JS runtime. +::: + +### MenuSetApplicationMenu + +Sets the application menu to the given [menu](../menus.mdx). + +Go: `MenuSetApplicationMenu(ctx context.Context, menu *menu.Menu)` + +### MenuUpdateApplicationMenu + +Updates the application menu, picking up any changes to the menu passed to `MenuSetApplicationMenu`. + +Go: `MenuUpdateApplicationMenu(ctx context.Context)` diff --git a/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/window.mdx b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/window.mdx new file mode 100644 index 000000000..3316a45f9 --- /dev/null +++ b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/window.mdx @@ -0,0 +1,211 @@ +--- +sidebar_position: 4 +--- + +# Window + +These methods give control of the application window. + +### WindowSetTitle + +Sets the text in the window title bar. + +Go: `WindowSetTitle(ctx context.Context, title string)`
JS: `WindowSetTitle(title: string)` + +### WindowFullscreen + +Makes the window full screen. + +Go: `WindowFullscreen(ctx context.Context)`
JS: `WindowFullscreen()` + +### WindowUnfullscreen + +Restores the previous window dimensions and position prior to full screen. + +Go: `WindowUnfullscreen(ctx context.Context)`
JS: `WindowUnfullscreen()` + +### WindowIsFullscreen + +Returns true if the window is full screen. + +Go: `WindowCenter(ctx context.Context)`
JS: `WindowCenter()` + +### WindowCenter + +Centers the window on the monitor the window is currently on. + +Go: `WindowReload(ctx context.Context)`
JS: `WindowReload()` + +### WindowReload + +Performs a "reload" (Reloads current page). + +Go: `WindowReloadApp(ctx context.Context)`
JS: `WindowReloadApp()` + +### WindowReloadApp + +Reloads the application frontend. + +Go: `WindowSetSystemDefaultTheme(ctx context.Context)`
JS: `WindowSetSystemDefaultTheme()` + +### WindowSetSystemDefaultTheme + +Windows only. + +Go: `WindowSetDarkTheme(ctx context.Context)`
JS: `WindowSetDarkTheme()` + +Sets window theme to system default (dark/light). + +### WindowSetLightTheme + +Windows only. + +Go: `WindowSetLightTheme(ctx context.Context)`
JS: `WindowSetLightTheme()` + +Sets window theme to light. + +### WindowSetDarkTheme + +Windows only. + +Go: `WindowShow(ctx context.Context)`
JS: `WindowShow()` + +Sets window theme to dark. + +### WindowShow + +Shows the window, if it is currently hidden. + +Go: `WindowHide(ctx context.Context)`
JS: `WindowHide()` + +### WindowHide + +Hides the window, if it is currently visible. + +Go: `WindowSetSize(ctx context.Context, width int, height int)`
JS: `WindowSetSize(size: Size)` + +### WindowIsNormal + +Returns true if the window not minimised, maximised or fullscreen. + +Go: `WindowGetSize(ctx context.Context) (width int, height int)`
JS: `WindowGetSize() : Size` + +### WindowSetSize + +Sets the width and height of the window. + +Go: `WindowSetMaxSize(ctx context.Context, width int, height int)`
JS: `WindowSetMaxSize(size: Size)` + +### WindowGetSize + +Gets the width and height of the window. + +Go: `WindowSetMinSize(ctx context.Context, width int, height int)`
JS: `WindowSetMinSize(size: Size)` + +### WindowSetMinSize + +Sets the minimum window size. Will resize the window if the window is currently smaller than the given dimensions. + +Setting a size of `0,0` will disable this constraint. + +Go: `WindowSetAlwaysOnTop(ctx context.Context, b bool)`
JS: `WindowSetAlwaysOnTop(b: Boolen)` + +### WindowSetMaxSize + +Sets the maximum window size. Will resize the window if the window is currently larger than the given dimensions. + +Setting a size of `0,0` will disable this constraint. + +Go: `WindowSetPosition(ctx context.Context, x int, y int)`
JS: `WindowSetPosition(position: Position)` + +### WindowSetAlwaysOnTop + +Sets the window AlwaysOnTop or not on top. + +Go: `WindowGetPosition(ctx context.Context) (x int, y int)`
JS: `WindowGetPosition() : Position` + +### WindowSetPosition + +Sets the window position relative to the monitor the window is currently on. + +Go: `WindowMaximise(ctx context.Context)`
JS: `WindowMaximise()` + +### WindowGetPosition + +Gets the window position relative to the monitor the window is currently on. + +Go: `WindowUnmaximise(ctx context.Context)`
JS: `WindowUnmaximise()` + +### WindowMaximise + +Maximises the window to fill the screen. + +Go: `WindowToggleMaximise(ctx context.Context)`
JS: `WindowToggleMaximise()` + +### WindowUnmaximise + +Restores the window to the dimensions and position prior to maximising. + +Go: `WindowMinimise(ctx context.Context)`
JS: `WindowMinimise()` + +### WindowIsMaximised + +Returns true if the window is maximised. + +Go: `WindowUnminimise(ctx context.Context)`
JS: `WindowUnminimise()` + +### WindowToggleMaximise + +Toggles between Maximised and UnMaximised. + +Go: `WindowToggleMaximise(ctx context.Context)`
JS: `WindowToggleMaximise()` + +### WindowMinimise + +Minimises the window. + +Go: `WindowSetBackgroundColour(ctx context.Context, R, G, B, A uint8)`
JS: `WindowSetBackgroundColour(R, G, B, A)` + +### WindowUnminimise + +Restores the window to the dimensions and position prior to minimising. + +Go: `WindowUnminimise(ctx context.Context)`
JS: `WindowUnminimise()` + +### WindowIsMinimised + +Returns true if the window is minimised. + +Go: `WindowIsMinimised(ctx context.Context) bool` JS: `WindowIsMinimised() bool` + +### WindowSetBackgroundColour + +Sets the background colour of the window to the given RGBA colour definition. This colour will show through for all transparent pixels. + +Valid values for R, G, B and A are 0-255. + +Any value that is not 0 will be considered 255. :::info Windows +On Windows, only alpha values of 0 or 255 are supported. +::: + +Go: `WindowSetBackgroundColour(ctx context.Context, R, G, B, A uint8)`
JS: `WindowSetBackgroundColour(R, G, B, A)` + +## Typescript Object Definitions + +### Position + +```ts +interface Position { + x: number; + y: number; +} +``` + +### Size + +```ts +interface Size { + w: number; + h: number; +} +``` diff --git a/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/tutorials/_category_.json b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/tutorials/_category_.json new file mode 100644 index 000000000..dfac1d175 --- /dev/null +++ b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/tutorials/_category_.json @@ -0,0 +1,4 @@ +{ + "label": "Tutorials", + "position": 70 +} diff --git a/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/tutorials/dogsapi.mdx b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/tutorials/dogsapi.mdx new file mode 100644 index 000000000..f4845fdbe --- /dev/null +++ b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/tutorials/dogsapi.mdx @@ -0,0 +1,243 @@ +--- +sidebar_position: 20 +--- + +# Dogs API + +
+ +
+ +
+ +:::note This tutorial has been kindly provided by [@tatadan](https://twitter.com/tatadan) and forms part of their [Wails Examples Repository](https://github.com/tataDan/wails-v2-examples). ::: + +In this tutorial we are going to develop an application that retrieves photos of dogs from the web and then displays them. + +### Create the project + +Let's create the application. From a terminal enter: `wails init -n dogs-api -t svelte` + +Note: We could optionally add `-ide vscode` or `-ide goland` to the end of this command if you wanted to add IDE support. + +Now let's `cd dogs-api` and start editing the project files. + +### Remove unused code + +We will start by removing some elements that we know we will not use: + +- Open `app.go` and remove the following lines: + +```go +// Greet returns a greeting for the given name +func (a *App) Greet(name string) string { + return fmt.Sprintf("Hello %s, It's show time!", name) +} +``` + +- Open `frontend/src/App.svelte` and delete all lines. +- Delete the `frontend/src/assets/images/logo-universal.png` file + +### Creating our application + +Now let's add our new Go code. + +Add the following struct declarations to `app.go` before the function definitions: + +```go +type RandomImage struct { + Message string + Status string +} + +type AllBreeds struct { + Message map[string]map[string][]string + Status string +} + +type ImagesByBreed struct { + Message []string + Status string +} +``` + +Add the following functions to `app.go` (perhaps after the existing function definitions): + +```go +func (a *App) GetRandomImageUrl() string { + response, err := http.Get("https://dog.ceo/api/breeds/image/random") + if err != nil { + log.Fatal(err) + } + + responseData, err := ioutil.ReadAll(response.Body) + if err != nil { + log.Fatal(err) + } + + var data RandomImage + json.Unmarshal(responseData, &data) + + return data.Message +} + +func (a *App) GetBreedList() []string { + var breeds []string + + response, err := http.Get("https://dog.ceo/api/breeds/list/all") + if err != nil { + log.Fatal(err) + } + + responseData, err := ioutil.ReadAll(response.Body) + if err != nil { + log.Fatal(err) + } + + var data AllBreeds + json.Unmarshal(responseData, &data) + + for k := range data.Message { + breeds = append(breeds, k) + } + + sort.Strings(breeds) + + return breeds +} + +func (a *App) GetImageUrlsByBreed(breed string) []string { + + url := fmt.Sprintf("%s%s%s%s", "https://dog.ceo/api/", "breed/", breed, "/images") + response, err := http.Get(url) + if err != nil { + log.Fatal(err) + } + + responseData, err := ioutil.ReadAll(response.Body) + if err != nil { + log.Fatal(err) + } + + var data ImagesByBreed + json.Unmarshal(responseData, &data) + + return data.Message +} +``` + +Modify the `import` section of `app.go` to look like this: + +```go +import ( + "context" + "fmt" + "encoding/json" + "io/ioutil" + "log" + "net/http" + "sort" +) +``` + +Add the following lines to `frontend/src/App.svelte`: + +```html + + +

Dogs API

+
+ + Click on down arrow to select a breed + + +
+
+{#if showRandomPhoto} + No dog found +{/if} +{#if showBreedPhotos} + {#each photos as photo} + No dog found + {/each} +{/if} + + +``` + +### Testing the application + +To generate the bindings and test the application, run `wails dev`. + +### Compiling the application + +To compile the application to a single, production grade binary, run `wails build`. + + + + + diff --git a/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/tutorials/helloworld.mdx b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/tutorials/helloworld.mdx new file mode 100644 index 000000000..ee2814292 --- /dev/null +++ b/website/i18n/ru/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/tutorials/helloworld.mdx @@ -0,0 +1,118 @@ +--- +sidebar_position: 10 +--- + +# Hello World + +Цель этого урока — запустить наиболее базовое приложение, использующее Wails. Вы сможете: + +- Создавать новое Wails приложение +- Собирать приложение +- Запускать приложение + +:::note +В этом уроке в качестве целевой платформы используется Windows. Вывод будет варьироваться в +зависимости от вашей операционной системы. +::: + +## Создавать новое Wails приложение + +Чтобы создать новое Wails приложение, использующее стандартный шаблон JS, вам нужно выполнить следующую команду: + +```bash +wails init -n helloworld +``` + +Вы должны увидеть что-то похожее на следующее: + +``` +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. +``` + +Это создаст новый каталог под названием `helloworld` в текущей директории. В этом каталоге вы найдете несколько файлов: + +``` +build/ - Содержит файлы сборки + собранное приложение +frontend/ - Содержит файлы интерфейса +app.go - Содержит код приложения +main.go - Основная программа с настройками приложения +wails.json - Файл настройки проекта +go.mod - Файл модуля Go +go.sum - Файл контрольной суммы модуля Go +``` + +## Собирать приложение + +Чтобы собрать приложение, перейдите в новую директорию `helloworld` и запустите следующую команду: + +```bash +wails build +``` + +Вы должны увидеть что-то похожее на следующее: + +``` +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. +``` + +Приложение собрано и сохранено в папке `build/bin`. + +## Запускать приложение + +Если мы откроем папку `build/bin` в Проводнике, то увидим исполняемый файл проекта: + +
+ +
+ +
+ +Мы можем запустить его, просто дважды щелкнув по файлу `helloworld.exe`. + +На Mac, Wails генерирует файл `helloworld.app` который может быть запущен двойным щелчком. + +На Linux вы можете запустить приложение с помощью файла `./helloworld` из папки `build/bin`. + +Вы должны видеть приложение, работающее так, как ожидалось: + +
+ +
+
diff --git a/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-beta.44.json b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-beta.44.json new file mode 100644 index 000000000..54beb8d1a --- /dev/null +++ b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-beta.44.json @@ -0,0 +1,38 @@ +{ + "version.label": { + "message": "v2.0.0-beta.44", + "description": "The label for version v2.0.0-beta.44" + }, + "sidebar.tutorialSidebar.category.Getting Started": { + "message": "快速入门", + "description": "The label for category Getting Started in sidebar tutorialSidebar" + }, + "sidebar.tutorialSidebar.category.Reference": { + "message": "参考", + "description": "The label for category Reference in sidebar tutorialSidebar" + }, + "sidebar.tutorialSidebar.category.Runtime": { + "message": "运行时", + "description": "The label for category Runtime in sidebar tutorialSidebar" + }, + "sidebar.tutorialSidebar.category.Community": { + "message": "社区", + "description": "The label for category Community in sidebar tutorialSidebar" + }, + "sidebar.tutorialSidebar.category.Showcase": { + "message": "案例展示", + "description": "The label for category Showcase in sidebar tutorialSidebar" + }, + "sidebar.tutorialSidebar.category.Guides": { + "message": "指南", + "description": "The label for category Guides in sidebar tutorialSidebar" + }, + "sidebar.tutorialSidebar.category.Tutorials": { + "message": "教程", + "description": "The label for category Tutorials in sidebar tutorialSidebar" + }, + "sidebar.tutorialSidebar.category.Contributing": { + "message": "参与贡献", + "description": "The label for category Contributing in sidebar tutorialSidebar" + } +} diff --git a/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1.json b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1.json new file mode 100644 index 000000000..9d6bd1b1a --- /dev/null +++ b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1.json @@ -0,0 +1,38 @@ +{ + "version.label": { + "message": "v2.0.0-rc.1", + "description": "The label for version v2.0.0-rc.1" + }, + "sidebar.docs.category.Getting Started": { + "message": "快速入门", + "description": "The label for category Getting Started in sidebar docs" + }, + "sidebar.docs.category.Reference": { + "message": "参考", + "description": "The label for category Reference in sidebar docs" + }, + "sidebar.docs.category.Runtime": { + "message": "运行时", + "description": "The label for category Runtime in sidebar docs" + }, + "sidebar.docs.category.Community": { + "message": "社区", + "description": "The label for category Community in sidebar docs" + }, + "sidebar.docs.category.Showcase": { + "message": "案例展示", + "description": "The label for category Showcase in sidebar docs" + }, + "sidebar.docs.category.Guides": { + "message": "指南", + "description": "The label for category Guides in sidebar docs" + }, + "sidebar.docs.category.Tutorials": { + "message": "教程", + "description": "The label for category Tutorials in sidebar docs" + }, + "sidebar.docs.link.Contributing": { + "message": "参与贡献", + "description": "The label for link Contributing in sidebar docs, linking to /community-guide#ways-of-contributing" + } +} diff --git a/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/appendix/_category_.json b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/appendix/_category_.json new file mode 100644 index 000000000..1374f0d55 --- /dev/null +++ b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/appendix/_category_.json @@ -0,0 +1,4 @@ +{ + "label": "Runtime", + "position": 70 +} diff --git a/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/_category_.json b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/_category_.json new file mode 100644 index 000000000..9827bf0c0 --- /dev/null +++ b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/_category_.json @@ -0,0 +1,4 @@ +{ + "label": "社区", + "position": 50 +} diff --git a/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/links.mdx b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/links.mdx new file mode 100644 index 000000000..90c365a3d --- /dev/null +++ b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/links.mdx @@ -0,0 +1,23 @@ +--- +sidebar_position: 2 +--- + +# 链接 + +此页面用于列出社区相关的链接。 请提交 PR（点击页面底部的`编辑此页`）增加链接。 + +## 了不起的 Wails + +Wails 相关的[优秀列表](https://github.com/wailsapp/awesome-wails)。 + +## 支持的通道 + +- [Gophers Slack Channel](https://gophers.slack.com/messages/CJ4P9F7MZ/) +- [Gophers Slack Channel Invite](https://invite.slack.golangbridge.org/) +- [Github Issues](https://github.com/wailsapp/wails/issues) +- [v2 测试版讨论板](https://github.com/wailsapp/wails/discussions/828) + +## 社交媒体 + +- [Twitter](https://twitter.com/wailsapp) +- [Wails 中文社区 QQ 群](https://qm.qq.com/cgi-bin/qm/qr?k=PmIURne5hFGNd7QWzW5qd6FV-INEjNJv&jump_from=webapi) - 群号：1067173054 diff --git a/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/_category_.json b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/_category_.json new file mode 100644 index 000000000..276e283b7 --- /dev/null +++ b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/_category_.json @@ -0,0 +1,4 @@ +{ + "label": "Showcase", + "position": 1 +} diff --git a/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/emailit.mdx b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/emailit.mdx new file mode 100644 index 000000000..4a1ebe835 --- /dev/null +++ b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/emailit.mdx @@ -0,0 +1,8 @@ +# EmailIt + +

+ +
+

+ +[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 builtin [Node-Red](https://nodered.org/) server, scripts terminal, and the [ScriptBar](https://github.com/raguay/ScriptBarApp) program for displaying results from Node-Red or a script on your system. Documentation is very scarce, but the programs works. It’s built using Wails2 and Svelte, and the download is a universal macOS application. diff --git a/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/encrypteasy.mdx b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/encrypteasy.mdx new file mode 100644 index 000000000..9b2e5f8ac --- /dev/null +++ b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/encrypteasy.mdx @@ -0,0 +1,10 @@ +# EncryptEasy + +

+ +
+

+ +**[cryptEasy](https://www.encrypteasy.app) 是一个管理您和您所有的联系人密钥的简单易用的 PGP 加密工具。 加密应该是简单的。 使用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. diff --git a/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/filehound.mdx b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/filehound.mdx new file mode 100644 index 000000000..78cbfca86 --- /dev/null +++ b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/filehound.mdx @@ -0,0 +1,14 @@ +# FileHound Export Utility + +

+ +
+

+ +[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 diff --git a/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/minecraftupdater.mdx b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/minecraftupdater.mdx new file mode 100644 index 000000000..11247339d --- /dev/null +++ b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/minecraftupdater.mdx @@ -0,0 +1,10 @@ +# Minecraft Updater + +

+ +
+

+ +[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. diff --git a/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/modalfilemanager.mdx b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/modalfilemanager.mdx new file mode 100644 index 000000000..a7ae8c492 --- /dev/null +++ b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/modalfilemanager.mdx @@ -0,0 +1,12 @@ +# Modal File Manager + +

+ +
+

+ +[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. 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. diff --git a/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/mollywallet.mdx b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/mollywallet.mdx new file mode 100644 index 000000000..534b097ca --- /dev/null +++ b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/mollywallet.mdx @@ -0,0 +1,8 @@ +# Molley Wallet + +

+ +
+

+ +[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. diff --git a/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/october.mdx b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/october.mdx new file mode 100644 index 000000000..889d2dd9e --- /dev/null +++ b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/october.mdx @@ -0,0 +1,12 @@ +# October + +

+ +
+

+ +[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. diff --git a/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/optimus.mdx b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/optimus.mdx new file mode 100644 index 000000000..c3eb79507 --- /dev/null +++ b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/optimus.mdx @@ -0,0 +1,8 @@ +# Optimus + +

+ +
+

+ +[Optimus](https://github.com/splode/optimus) is a desktop image optimization application. It supports conversion and compression between WebP, JPEG, and PNG image formats. diff --git a/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/portfall.mdx b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/portfall.mdx new file mode 100644 index 000000000..4cc2c63c9 --- /dev/null +++ b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/portfall.mdx @@ -0,0 +1,8 @@ +# Portfall + +

+ +
+

+ +[Portfall](https://github.com/rekon-oss/portfall) - A desktop k8s port-forwarding portal for easy access to all your cluster UIs diff --git a/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/restic-browser.mdx b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/restic-browser.mdx new file mode 100644 index 000000000..1505ce07a --- /dev/null +++ b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/restic-browser.mdx @@ -0,0 +1,10 @@ +# Restic Browser + +

+ +
+

+ +[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. diff --git a/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/riftshare.mdx b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/riftshare.mdx new file mode 100644 index 000000000..5223e88cf --- /dev/null +++ b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/riftshare.mdx @@ -0,0 +1,19 @@ +# RiftShare + +

+ +
+

+ +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! diff --git a/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/scriptbar.mdx b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/scriptbar.mdx new file mode 100644 index 000000000..aaa556f92 --- /dev/null +++ b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/scriptbar.mdx @@ -0,0 +1,8 @@ +# ScriptBar + +

+ +
+

+ +[ScriptBar](https://GitHub.com/raguay/ScriptBarApp) is a program to show the output of the embedded [Node-Red](https://nodered.org) server in the [EmailIt](https://GitHub.com/raguay/EmailIt) application. 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. diff --git a/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/surge.mdx b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/surge.mdx new file mode 100644 index 000000000..2d895dc29 --- /dev/null +++ b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/surge.mdx @@ -0,0 +1,8 @@ +# Surge + +

+ +
+

+ +[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. diff --git a/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/wally.mdx b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/wally.mdx new file mode 100644 index 000000000..2a2498f40 --- /dev/null +++ b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/wally.mdx @@ -0,0 +1,8 @@ +# Wally + +

+ +
+

+ +[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. diff --git a/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/wombat.mdx b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/wombat.mdx new file mode 100644 index 000000000..54cedacea --- /dev/null +++ b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/wombat.mdx @@ -0,0 +1,8 @@ +# Wombat + +

+ +
+

+ +[Wombat](https://github.com/rogchap/wombat) is a cross platform gRPC client. diff --git a/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/ytd.mdx b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/ytd.mdx new file mode 100644 index 000000000..178ff0529 --- /dev/null +++ b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/showcase/ytd.mdx @@ -0,0 +1,8 @@ +# Ytd + +

+ +
+

+ +[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. diff --git a/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/templates.mdx b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/templates.mdx new file mode 100644 index 000000000..8b98f7115 --- /dev/null +++ b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/community/templates.mdx @@ -0,0 +1,52 @@ +--- +sidebar_position: 1 +--- + +# 模板 + +此页面用作社区支持的模板列表。 请提交一个包含您的模板的 PR（点击页面底部的`编辑此页`）。 要构建您自己的模板，请参考[模板](../guides/templates)指南。 + +要使用这些模板，请运行 `wails init -n "您的项目名" -t [下面的链接[@版本]]` + +如果不带版本后缀，默认使用的是主分支代码模板，如果带有版本后缀，则使用该版本对应标签的代码模板。 If there is a version suffix, the code template corresponding to the tag of this version is used. + +示例：`wails init -n "Your Project Name" -t https://github.com/misitebao/wails-template-vue@v2.0.0-beta.3` + +:::warning 注意 + +**Wails 项目不维护也不对第 3 方模板负责** + +如果您不确定某个模板，请检查 `package.json`和`wails.json` 中安装的模块和运行的脚本。 + +::: + +## Vue + +- [wails-template-vue](https://github.com/misitebao/wails-template-vue) - 基于 Vite、Vue 和 Vue-Router 的 Wails 模板（同时支持 JavaScript 和 TypeScript） +- [wails-vite-vue-ts](https://github.com/codydbentley/wails-vite-vue-ts) - 使用 Vite 的 Vue 3 TypeScript(以及添加功能的说明) +- [wails-vite-vue-the-works](https://github.com/codydbentley/wails-vite-vue-the-works) - 使用 Vite, Vuex, Vue Router, Sass, 和 ESLint + Prettier 的 Vue 3 TypeScript + +## Angular + +- [wails-angular-template](https://github.com/TAINCER/wails-angular-template) - 带有 TypeScript, Sass, 热重载, 代码拆分和 i18n 的 Angular + +## React + +- [wails-react-template](https://github.com/AlienRecall/wails-react-template) - 基于 reactjs 的模板 +- [wails-react-template](https://github.com/flin7/wails-react-template) - 基于 React 并支持实时开发模式的轻量级模板 +- [wails-vite-react-ts](https://github.com/lontten/wails-vite-react-ts) - 基于 Vite + React + TypeScript 的模板 + +## Svelte + +- [wails-svelte-template](https://github.com/raitonoberu/wails-svelte-template) - 基于 Svelte 的模板 +- [wails-vite-svelte-template](https://github.com/BillBuilt/wails-vite-svelte-template) - 使用 Svelte 和 Vite 的模板 +- [wails-vite-svelte-tailwind-template](https://github.com/BillBuilt/wails-vite-svelte-tailwind-template) - 使用 Svelte 和 Vite 和 TailwindCSS v3 的模板 +- [wails-template-nextjs](https://github.com/LGiki/wails-template-nextjs) - 基于 Next.js + TypeScript 的模板 + +## 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: + +## 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 \ No newline at end of file diff --git a/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/contributing/developing-new-features.mdx b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/contributing/developing-new-features.mdx new file mode 100644 index 000000000..9fc9025bd --- /dev/null +++ b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/contributing/developing-new-features.mdx @@ -0,0 +1,34 @@ +--- +sidebar_position: 20 +--- + +# 开发新功能 + +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: The process for adding new features are as follows: 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: The process for adding new features are as follows: The process for adding new features are as follows: + +- Pick an enhancement ticket with the "TODO" label. Pick an enhancement ticket with the "TODO" label. 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 Sometimes placeholder tickets are created and require more details 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/_` +- 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. Once the feature is ready for testing, create a draft PR. 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 the feature is ready for testing, create a draft PR. 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 the feature is ready for testing, create a draft PR. 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. +::: Not all ideas will be selected so it's best to have discussion +on the ticket first. +::: 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. +::: ::: +::: diff --git a/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/contributing/documenting.mdx b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/contributing/documenting.mdx new file mode 100644 index 000000000..84e472903 --- /dev/null +++ b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/contributing/documenting.mdx @@ -0,0 +1,34 @@ +--- +sidebar_position: 40 +--- + +# 文档 + +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. 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. 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. Any changes made to the site text will be immediately reflected in the browser. 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. We also keep the last release documentation as well as the version before that. 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. Any updates should be made in the `website/docs` directory. Any updates should be made in the `website/docs` directory. + +## Languages + +The default documents of the Wails project are English documents. We use the "crowdin" tool to translate documents in other languages and synchronize them to the website. You can [join our project](https://crowdin.com/project/wails) and submit your translations to make contributions. + +### Add new language + +If you want to add a new language to the documentation, please follow the prompts to [fill in and submit an Issue](https://github.com/wailsapp/wails/issues/new?assignees=&labels=documentation&template=documentation.yml). After being confirmed by the maintainer, we will add the language to the "crowdin" and you will then be able to submit your translation. diff --git a/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/contributing/fixing-bugs.mdx b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/contributing/fixing-bugs.mdx new file mode 100644 index 000000000..01eceeccd --- /dev/null +++ b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/contributing/fixing-bugs.mdx @@ -0,0 +1,29 @@ +--- +sidebar_position: 30 +--- + +# 修复漏洞 + +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. The steps to reproduce. 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/_` +- Once the fix is ready for testing, create a draft PR. 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 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. +::: ::: +::: diff --git a/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/contributing/setting-up-a-dev-environment.mdx b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/contributing/setting-up-a-dev-environment.mdx new file mode 100644 index 000000000..1133e275d --- /dev/null +++ b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/contributing/setting-up-a-dev-environment.mdx @@ -0,0 +1,30 @@ +--- +sidebar_position: 10 +--- + +# 设置开发环境 + +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 => ` + +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` diff --git a/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/contributing/ways-of-contributing.mdx b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/contributing/ways-of-contributing.mdx new file mode 100644 index 000000000..3bbe9a889 --- /dev/null +++ b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/contributing/ways-of-contributing.mdx @@ -0,0 +1,18 @@ +--- +sidebar_position: 1 +--- + +# 贡献方式 + +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. 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. Guides for these have been created in their own sections. 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. diff --git a/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/gettingstarted/_category_.json b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/gettingstarted/_category_.json new file mode 100644 index 000000000..597b920df --- /dev/null +++ b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/gettingstarted/_category_.json @@ -0,0 +1,4 @@ +{ + "label": "Getting Started", + "position": 10 +} diff --git a/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/gettingstarted/building.mdx b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/gettingstarted/building.mdx new file mode 100644 index 000000000..38bf5d47d --- /dev/null +++ b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/gettingstarted/building.mdx @@ -0,0 +1,21 @@ +--- +sidebar_position: 6 +--- + +# 编译您的项目 + +从项目目录，运行`wails build`。 这将编译您的项目并将构建的可用于生产的二进制文件保存在 `build/bin` 目录中。 + +如果您运行二进制文件，您应该会看到默认应用程序： + +
+ +
+ +
+ +有关编译选项的更多详细信息，请参阅[构建命令](../reference/cli#构建)。 diff --git a/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/gettingstarted/development.mdx b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/gettingstarted/development.mdx new file mode 100644 index 000000000..a9e165543 --- /dev/null +++ b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/gettingstarted/development.mdx @@ -0,0 +1,16 @@ +--- +sidebar_position: 5 +--- + +# 开发您的应用程序 + +您可以通过运行`wails dev`从项目目录在开发模式下运行您的应用程序。 这将执行以下操作： + +- 构建您的应用程序并运行它 +- 监听 Go 文件中的修改并在更改时重新构建/重新运行 +- Using the power of [vite](https://vitejs.dev/), will watch for modifications in your Go files and rebuild/re-run on change +- 设置将通过浏览器为您的应用程序提供服务的[网络服务器](http://localhost:34115)。 这允许您使用您喜欢的浏览器扩展。 您甚至可以从控制台调用 Go 代码。 + +首先，在项目目录中运行`wails dev`。 可以在[此处](../reference/cli#开发)找到有关这方面的更多信息。 + +即将提供：教程 diff --git a/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/gettingstarted/firstproject.mdx b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/gettingstarted/firstproject.mdx new file mode 100644 index 000000000..e43d5f7d1 --- /dev/null +++ b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/gettingstarted/firstproject.mdx @@ -0,0 +1,132 @@ +--- +sidebar_position: 2 +--- + +# 创建项目 + +## 项目生成 + +现在 CLI 已安装，您可以使用`wails init`命令生成一个新项目。 + +选择您最喜欢的框架： + + + +import Tabs from "@theme/Tabs"; +import TabItem from "@theme/TabItem"; + + + + Generate a Svelte project using Javascript with:

+ + wails init -n myproject -t svelte +If you would rather use Typescript:
+ + wails init -n myproject -t svelte-ts + + + + Generate a React project using Javascript with:

+ + wails init -n myproject -t react +If you would rather use Typescript:
+ + wails init -n myproject -t react-ts + + + + Generate a Vue project using Javascript with:

+ + wails init -n myproject -t vue + +If you would rather use Typescript:
+ + wails init -n myproject -t vue-ts + + + + Generate a Preact project using Javascript with:

+ + wails init -n myproject -t preact + +If you would rather use Typescript:
+ + wails init -n myproject -t preact-ts + + + + Generate a Lit project using Javascript with:

+ + wails init -n myproject -t lit + +If you would rather use Typescript:
+ + wails init -n myproject -t lit-ts + + + + Generate a Vanilla project using Javascript with:

+ + wails init -n myproject -t vanilla + +If you would rather use Typescript:
+ + wails init -n myproject -t vanilla-ts + + + + + + +
+ +Wails 项目具有以下布局： + +要查看其他可用选项，您可以运行 `wails init -help`。 更多详细信息可以在 [初始化命令](../reference/cli#初始化)中找到。 + +## 项目布局 + +Wails 项目有以下布局： + +``` +. +. +. +├── build/ +│ ├── appicon.png +│ ├── darwin/ +│ └── windows/ +├── frontend/ +├── go.mod +├── go.sum +├── main.go +└── wails.json +``` + +### 项目结构概要 + +- `/main.go` - 主应用 +- `/frontend/` - 前端项目文件 +- `/build/` - 项目构建目录 +- `/wails.json` - 项目配置 +- `/go.mod` - Go mod 文件 +- `/go.sum` - Go mod 校验文件 +- `/build/windows/` - Windows 特定的项目文件 +- `/go.mod` - Go module file +- `/go.sum` - Go module checksum file + +`frontend`目录没有特定于 Wails 的内容，可以是您选择的任何前端项目。 + +`build`目录在构建过程中使用。 这些文件可以修改以自定义您的构建。 如果文件从构建目录中删除，将重新生成默认版本。 + +`go.mod`中的默认模块名称是“changeme”。 您应该将其更改为更合适的内容。 diff --git a/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/gettingstarted/installation.mdx b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/gettingstarted/installation.mdx new file mode 100644 index 000000000..bbef43c3c --- /dev/null +++ b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/gettingstarted/installation.mdx @@ -0,0 +1,109 @@ +--- +sidebar_position: 1 +--- + +# 安装 + +## 支持的平台 + +- Windows 10/11 AMD64/ARM64 +- MacOS 10.13+ AMD64 +- MacOS 11.0+ ARM64 +- Linux AMD64/ARM64 + +## 依赖 + +Wails 有许多安装前需要的常见依赖项： + +- Go 1.17+ +- NPM (Node 15+) + +### Go + +从[Go 下载页面](https://golang.org/dl/)下载 Go。 + +确保您遵守官方的[Go 安装说明](https://golang.org/doc/install#install)。 您还需要确保您的 `PATH` 环境变量包含您的 `~/go/bin` 目录路径。 重启终端并执行以下命令检查： + +- 检查 Go 是否安装正确： `go version` +- 检查 "~/go/bin" 是否在您的 PATH 变量中： `echo $PATH | grep go/bin` + +### NPM + +从[Node 下载页面](https://nodejs.org/en/download/)下载 NPM。 最好使用最新版本，因为这是我们通常会测试的版本。 + +运行 `npm --version` 进行验证。 + +## 平台指定依赖关系 + +您还需要安装指定平台的依赖项： + + + +import Tabs from "@theme/Tabs"; +import TabItem from "@theme/TabItem"; + + + + Wails 需要安装 xcode 命令行工具。 This can be + done by running:
+ xcode-select --install + + + Wails requires that the WebView2{" "} + runtime is installed. Some Windows installations will already have this installed. You can check using + the{" "} + wails doctor command (see below). Some Windows installations will already have this installed. You can check using + the{" "} + wails doctor command (see below). Some Windows installations will already have this + installed. You can check using the wails doctor command (see + below). + + + 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. + 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. 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. + + + + + +## 可选依赖 + +- [UPX](https://upx.github.io/) 用于压缩您的应用程序。 + +## 安装 Wails + +运行 `go install github.com/wailsapp/wails/v2/cmd/wails@latest` 安装 Wails CLI。 + +## 系统检查 + +运行 `wails doctor` 将检查您是否安装了正确的依赖项。 如果没有，它会就缺少的内容提供建议以帮助纠正问题。 + +## 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. diff --git a/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/_category_.json b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/_category_.json new file mode 100644 index 000000000..5935dad93 --- /dev/null +++ b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/_category_.json @@ -0,0 +1,4 @@ +{ + "label": "Guides", + "position": 50 +} diff --git a/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/application-development.mdx b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/application-development.mdx new file mode 100644 index 000000000..76e93b17a --- /dev/null +++ b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/application-development.mdx @@ -0,0 +1,194 @@ +# 应用开发 + +使用 Wails 开发应用程序没有硬性规定，但有一些基本准则。 + +## 应用程序设置 + +默认模板使用 `main.go` 配置和运行应用程序, 同时`app.go`用于定义应用程序逻辑. + +`app.go`文件将定义一个结构体，该结构体有 2 个方法作为主应用程序的回调： + +```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) { +} +``` + +- `startup`方法会在 Wails 分配它需要的资源后立即调用，这是创建资源、设置事件侦听器以及应用程序在启动时需要的任何其他内容的好地方。 它提供了一个`context.Context`， 通常保存在结构字段中。 调用[运行时](../reference/runtime/intro)需要此`context.Context`。 如果此方法返回错误，则应用程序将终止。 在开发模式下，错误会输出到控制台。 + +- 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. This is a good place to deallocate memory and perform any shutdown tasks. + +`main.go`文件通常由对`wails.Run()`的单个调用组成，它接受应用程序配置。 模板使用的模式是，在调用`wails.Run()`之前， 我们创建并保存一个在`app.go`中定义的结构体的实例在名`app`的变量中。 这个配置是我们添加回调的地方： + +```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) + } +} + +``` + +可以在[此处](../howdoesitwork#应用程序生命周期回调)找到有关应用程序生命周期回调的更多信息。 + +## 绑定方法 + +您可能希望从前端调用 Go 方法。 这通常是通过向`app.go`中已经定义的结构体中添加公共方法来实现的： + +```go {16-18} title="app.go" +type App struct { + ctx context.Context +} + +func NewApp() *App { + return &App{} +} + +func (a *App) startup(ctx context.Context) { + a.ctx = ctx +} + +func (a *App) shutdown(ctx context.Context) { +} + +func (a *App) Greet(name string) string { + return fmt.Printf("Hello %s!", name) +} +``` + +在主应用程序中，`Bind`字段告诉我们 Wails 想要绑定什么： + +```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) + } +} + +``` + +这将绑定`App`结构中的所有公共方法(它永远不会绑定 startup 和 shutdown 方法)。 + +### Dealing with context when binding multiple structs + +可以在[此处](../howdoesitwork#方法绑定)找到有关绑定的更多信息。 + +```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). + +## 应用程序菜单 + +Wails 支持向您的应用程序添加菜单。 这是通过将 [菜单](../reference/menus#菜单) 结构体传递给应用程序配置来完成的。 常见做法是使用一个返回菜单的方法，更常见的是用作生命周期回调的 `App` 结构体上的方法。 + +```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) + } +} + +``` + +## 资源 + +Wails v2 处理资源的方式的伟大之处在于它没有！ 您唯一需要给 Wails 的是一个 `embed.FS`， 如何做到这一点完全取决于您。 How you get to that is entirely up to you. 您可以像 vanilla 模板一样使用 vanilla html/css/js 文件。 您可能有一些复杂的构建系统，但这并不影响。 + +当运行`wails build`时，它会检查项目根目录的`wails.json`文件。 文件中有 2 个字段会被读取： + +- "frontend:install" +- "frontend:build" + +第一个，如果有给定，将在`frontend`目录中执行以安装 node 模块。 第二个，如果有给定，将在`frontend`目录中执行以构建前端项目。 + +如果没有给出这两个字段，那么 Wails 不会对前端做任何操作。 它仅仅被用作`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 specifiy `nil` as the `Assets` option. 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. + +## 内置开发服务器 + +运行`wails dev`将启动内置的开发服务器，它将在您的项目目录中启动一个文件监听器。 默认情况下，如果有任何文件更改，wails 会检查它是否是应用程序文件（默认：.go，可使用`-e`标志配置）。 如果是，那么它将重新构建您的应用程序并重新启动它。 如果更改的文件在`assetdir`目录中，它会在很短的时间后重新加载。 + +开发服务器使用一种称为“防抖”的技术，这意味着它不会立即重新加载，因为可能会在短时间内更改多个文件。 当触发发生时，它会在发出重新加载之前等待一定的时间。 如果发生另一个触发，它会再次重置为等待时间。 默认情况下，此值为 100ms。 如果此值不适用于您的项目，则可以使用`-debounce`标志进行配置。 如果使用，此值将保存到您的项目配置中并成为默认值。 + +## 外部开发服务器 + +一些框架带有自己的实时重新加载服务器，但是它们将无法利用 Wails Go 绑定。 在这种情况下，最好运行一个监听脚本，将项目重新构建到构建目录中，Wails 将监视该目录。 有关示例，请参阅使用[rollup](https://rollupjs.org/guide/en/)的默认 svelte 模板。 对于[create-react-app](https://create-react-app.dev/)，可以使用[此脚本](https://gist.github.com/int128/e0cdec598c5b3db728ff35758abdbafd)来实现类似的结果。 + +## Go 模块 + +默认的 Wails 模板会生成一个包含模块名称“changeme”的`go.mod`文件。 您应该在项目生成后将其更改为更合适的内容。 diff --git a/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/bleeding-edge.mdx b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/bleeding-edge.mdx new file mode 100644 index 000000000..8fad99fde --- /dev/null +++ b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/bleeding-edge.mdx @@ -0,0 +1,55 @@ +# 前沿风险技术 + +## 概述 + +Wails 一直在开发中，新版本会定期“标记”。 这通常发生在`master`分支上所有较新的代码都经过测试并确认有效时。 如果您需要尚未发布的错误修复或功能，可以通过以下步骤使用最新的“前沿风险”版本： + +- `git clone https://github.com/wailsapp/wails` +- `cd wails/v2/cmd/wails` +- `go install` + +注意：您将项目克隆到的目录现在将被称为“clonedir”。 + +Wails CLI 现在将是最新版本。 + +### 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 => ` + +示例： + +在 Windows 上： `replace github.com/wailsapp/wails/v2 => C:\Users\leaan\Documents\wails-v2-beta\wails\v2` + +在'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` + +## 测试一个分支 + +如果要测试一个分支，请按照上面的说明进行操作，但请确保在安装之前切换要测试的分支： + +- `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: 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: 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. diff --git a/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/dynamic-assets.mdx b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/dynamic-assets.mdx new file mode 100644 index 000000000..c28d70e9d --- /dev/null +++ b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/dynamic-assets.mdx @@ -0,0 +1,130 @@ +# 动态资源 + +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. 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. 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: 255}, + 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. This will generate an error in the devtools. This will generate an error in the devtools. We can see that the error is what we expect, returned by our custom assets handler: + +

+ +

+ +However, if we request `go.mod`, we will see the following output: + +

+ +

+ +This technique can be used to load images directly into the page. This technique can be used to load images directly into the page. If we updated our default vanilla template and replaced the logo image: This technique can be used to load images directly into the page. This technique can be used to load images directly into the page. If we updated our default vanilla template and replaced the logo image: 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 + +``` + +with: + +```html + +``` + +Then we would see the following: + +

+ +

+ +:::warning +Exposing your filesystem in this way is a security risk. It is recommended that you properly manage access +to your filesystem. +::: It is recommended that you properly manage access +to your filesystem. +::: It is recommended that you properly manage access +to your filesystem. +::: diff --git a/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/frameless.mdx b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/frameless.mdx new file mode 100644 index 000000000..126a36c38 --- /dev/null +++ b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/frameless.mdx @@ -0,0 +1,84 @@ +# 无边框应用 + +Wails supports application that have no frames. 这可以通过使用[应用程序参数选项](../reference/options#应用程序参数选项)中的[无边框](../reference/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 + + + + + + + +
+ + +
+
+ + + + +``` + +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" +) + +//go:embed 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, + Assets: assets, + Frameless: true, + CSSDragProperty: "widows", + CSSDragValue: "1", + Bind: []interface{}{ + app, + }, + }) + + if err != nil { + println("Error:", err) + } +} +``` + +```html title=index.html + + + + + + alwaysontop + + +
+ + + + +``` + +:::info 全屏 +如果您允许应用程序全屏显示，则此拖动功能将被禁用。 +::: diff --git a/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/frontend.mdx b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/frontend.mdx new file mode 100644 index 000000000..789e834b8 --- /dev/null +++ b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/frontend.mdx @@ -0,0 +1,72 @@ +# 前端 + +## 脚本注入 + +当 Wails 为您的`index.html`提供服务时，默认情况下，它会将 2 个脚本注入``标签以加载`/wails/ipc.js`和`/wails/runtime.js`。 这些文件分别安装绑定和运行时。 + +下面的代码显示了这些默认注入的位置： + +```html + + + injection example + + + + + + + +
Please enter your name below 👇
+
+ + +
+ + + + +``` + +### 覆盖默认脚本注入 + +为了给开发人员提供更大的灵活性，有一个`meta`标签可用于自定义此行为： + +```html + +``` + +选项如下： + +| 值 | 描述 | +| ------------------- | -------------------------- | +| noautoinjectruntime | 禁用自动注入 `/wails/runtime.js` | +| noautoinjectipc | 禁用自动注入 `/wails/ipc.js` | +| noautoinject | 禁用所有脚本自动注入 | + +可以使用多个选项，前提是它们以逗号分隔。 + +此代码完全有效并且与自动注入版本的操作相同： + +```html + + + injection example + + + + + + +
Please enter your name below 👇
+
+ + +
+ + + + + + +``` diff --git a/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/ides.mdx b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/ides.mdx new file mode 100644 index 000000000..0ae681f0f --- /dev/null +++ b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/ides.mdx @@ -0,0 +1,110 @@ +# 集成开发环境 + +Wails 旨在提供出色的开发体验。 为此，我们现在支持生成 IDE 特定配置以提供更顺畅的项目设置。 + +目前，我们支持[Visual Studio Code](https://code.visualstudio.com/)，但我们希望尽快支持其他 IDE，例如 Goland。 + +## Visual Studio Code + +

+ +

+ +使用`-ide vscode`标志生成项目时，IDE 文件将与其他项目文件一起创建。 这些文件放置在`.vscode`目录中，并为调试应用程序提供正确的配置。 + +生成的 2 个文件是`tasks.json`和`launch.json`. 以下是为默认 vanilla 项目生成的文件： 生成的 2 个文件是`tasks.json`和`launch.json`. 以下是为默认 vanilla 项目生成的文件： Below are the files generated for the default vanilla project: 生成的 2 个文件是`tasks.json`和`launch.json`. 以下是为默认 vanilla 项目生成的文件： Below are the files generated for the default vanilla project: 生成的 2 个文件是`tasks.json`和`launch.json`. 以下是为默认 vanilla 项目生成的文件： Below are the files generated for the default vanilla project: 生成的 2 个文件是`tasks.json`和`launch.json`. 以下是为默认 vanilla 项目生成的文件： 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": {}, + "args": ["-assetdir", "frontend/src"] + } + ] +} +``` + +### 配置安装和构建步骤 + +`tasks.json`文件对于默认项目很简单，因为不需要`npm install`或`npm run build`的步骤。 对于具有前端构建步骤的项目，例如 svelte 模板，我们需要编辑`tasks.json`以添加安装和构建步骤： + +```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 功能改善 + +在未来，我们希望生成一个自动包含安装和构建步骤的`tasks.json`。 + +::: diff --git a/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/linux-distro-support.mdx b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/linux-distro-support.mdx new file mode 100644 index 000000000..2ee209e03 --- /dev/null +++ b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/linux-distro-support.mdx @@ -0,0 +1,101 @@ +# Linux 发行版支持 + +## 概述 + +Wails 提供 Linux 支持，但为所有可用发行版提供安装说明是一项不可能完成的任务。 相反，Wails 会尝试确定您开发应用程序所需的包是否可以通过系统的包管理器获得。 目前，我们支持以下包管理器： + +- apt +- dnf +- emerge +- eopkg +- nixpkgs +- pacman +- zypper + +## 添加包名 + +在某些情况下，您的发行版使用受支持的包管理器之一，但包名称不同。 例如，您可能使用 Ubuntu 衍生产品，但 gtk 的包名称可能不同。 Wails 尝试通过遍历包名称列表来找到正确的包。 包列表存储在`v2/internal/system/packagemanager` 目录中的包管理器特定文件中。 在我们的示例中，将是`v2/internal/system/packagemanager/apt.go`。 + +在此文件中，包列表由以下`Packages()`方法定义： + +```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}, + }, + } +} +``` + +假设在我们的 linux 发行版中，libgtk-3 以 lib-gtk3-dev 的名称打包。 我们可以通过添加以下行来添加对此的支持： + +```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}, + }, + } +} +``` + +## 添加新的包管理器 + +要添加新的包管理器，请执行以下步骤： + +- 在`v2/internal/system/packagemanager`中创建一个名为`.go`的新文件，其中``是包管理器的名称。 +- 定义一个符合`pm.go`中定义的包管理器接口的结构体。 + +```go +type PackageManager interface { + Name() string + Packages() packagemap + PackageInstalled(*Package) (bool, error) + PackageAvailable(*Package) (bool, error) + InstallCommand(*Package) string +} +``` + +- `Name()` 应该返回包管理器的名称 +- `Packages()` 应该返回一个`packagemap`，它为依赖项提供候选文件名 +- `PackageInstalled()` 如果安装了指定的包，应该返回`true` +- `PackageAvailable()` 如果指定的软件包未安装但可以安装，则应返回`true` +- `InstallCommand()` 应该返回确切的命令来安装指定的包名 + +查看其他包管理器代码以了解其工作原理。 + +:::info 记住 +如果您添加了对新包管理器的支持，请不要忘记更新此页面！ +::: diff --git a/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/linux.mdx b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/linux.mdx new file mode 100644 index 000000000..073e207b2 --- /dev/null +++ b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/linux.mdx @@ -0,0 +1,18 @@ +# 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: 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) diff --git a/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/manual-builds.mdx b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/manual-builds.mdx new file mode 100644 index 000000000..3472cb91a --- /dev/null +++ b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/manual-builds.mdx @@ -0,0 +1,95 @@ +# 手动构建 + +Wails CLI 为项目做了很多繁重的工作，但有时需要手动构建项目。 本文档将讨论 CLI 执行的不同操作以及如何以不同方式实现这一点。 + +## 构建过程 + +当使用`wails build`或`wails dev`时，Wails CLI 会执行一个通用的构建过程： + + - 安装前端依赖 + - 构建前端项目 + - 生成构建资源 + - 编译应用程序 + - [可选]压缩应用程序 + +### 安装前端依赖 + +#### 命令行步骤 + +- 如果给出了`-s`标志，则跳过此步骤 +- 检查`wails.json`中是否有安装命令`frontend:install` +- 如果没有，则跳过此步骤 +- 如果有，则检查前端目录中是否存在`package.json`。 如果不存在，则跳过这一步 +- 从`package.json`文件内容生成 MD5 +- 它检查`package.json.md5`是否存在，如果存在，则将其内容（MD5 sum）与生成的内容进行比较，以查看内容是否已更改。 如果相同，则跳过此步骤 +- 如果`package.json.md5`不存在，则使用生成的 MD5 sum 创建它 +- 如果现在需要构建，或者`node_modules`不存在，或者给出了`-f`标志，则在前端目录中执行安装命令 + +#### 手动步骤 + +这一步可以从命令行或带有`npm install`的前端脚本完成. + +### 构建前端项目 + +#### Wails 命令行 + +- 如果给出了`-s`标志，则跳过此步骤 +- 检查`wails.json`中是否有构建命令`frontend:build` +- 如果没有，则跳过此步骤 +- 如果有，就在 frontend 目录下执行它 + +#### 手动步骤 + +这一步可以从命令行或带有前端构建脚本`npm run build`的脚本或任何前端构建脚本完成。 + +### 生成资源 + +#### Wails 命令行 + +- 如果设置了`-nopackage`标志，则跳过此阶段 +- 如果`build/appicon.png`文件不存在，则创建一个默认文件 +- 对于 Windows，请参阅[Windows](#windows) +- 如果`build/windows/icon.ico`不存在，它将从`build/appicon.png`图像创建它。 + +##### Windows + +- 如果`build/windows/icon.ico`不存在，它将从`build/appicon.png`创建 256、128、64、48、32 和 16 大小的图标。 这是使用[winicon](https://github.com/leaanthony/winicon)完成的。 +- 如果`build/windows/.manifest`文件不存在，它会从默认版本创建它。 +- 将应用程序编译为生产版本（如上所述）。 +- 使用[winres](https://github.com/tc-hib/winres)将 icon 和 manifest 打包到一个`.syso`文件。 + +#### 手动步骤 + +- 使用[winicon](https://github.com/leaanthony/winicon)命令行工具或者其他工具创建`icon.ico` +- 为您的应用程序创建或者更新`.manifest`文件 +- 使用[winres 命令行](https://github.com/tc-hib/go-winres)生成一个`.syso`文件 + +### 编译应用程序 + +#### Wails 命令行 + +- 如果提供了`-clean`标志，则删除并重新创建`build`目录 +- 对于`wails dev`，使用以下默认 Go 标志：`-tags dev -gcflags "all=-N -l"` +- 对于`wails build`，使用以下默认 Go 标志：`-tags desktop,production -ldflags "-w -s"` + - 在 Windows 上， `-ldflags "-w -h -H windowsgui"` +- 使用`-tags`传递给命令行的其他`tags`被添加到默认值中 +- 使用`-ldflags`传递给命令行的其他`ldflags`将添加到默认值中 +- 传递`-o`标志 +- 指定的`-compiler`将用于 Go 编译器 + +#### 手动步骤 + +- 开发环境构建，最简单的命令是： `go build -tags dev -gcflags "all=-N -l"` +- 生产环境构建，最简单的命令是：`go build -tags desktop,production -ldflags "-w -s -H windowsgui"` +- 确保在与`.syso`文件相同的目录中进行编译 + +### 压缩应用程序 + +#### Wails 命令行 + +- 如果已给出`-upx`标志，则`upx`程序将运行以使用默认设置压缩应用程序 +- 如果也传递了`-upxflags`标志，则使用这些标志而不是默认 + +#### 手动步骤 + +- 手动运行`upx [flags]`以压缩应用程序。 diff --git a/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/migrating.mdx b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/migrating.mdx new file mode 100644 index 000000000..426c6cba6 --- /dev/null +++ b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/migrating.mdx @@ -0,0 +1,205 @@ +# 从 v1 迁移 + +## 概述 + +Wails v2 与 v1 相比有重大变化。 本文档旨在重点介绍迁移现有项目的更改和步骤。 + +### 创建应用程序 + +在 v1 中，使用`wails.CreateApp`来创建主应用程序，使用`app.Bind`来添加绑定，然后使用`app.Run()`运行应用程序。 + +示例： + +```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() +``` + +在 v2 中，只有一个方法`wails.Run()`接受[应用程序参数选项](../reference/options#应用程序参数选项)。 + +```go title="v2" + err := wails.Run(&options.App{ + Title: "MyApp", + Width: 800, + Height: 600, + Assets: assets, + Bind: []interface{}{ + basic, + }, + }) +``` + +### 绑定 + +在 v1 中，可以绑定任意函数和结构。 在 v2 中，这已被简化为仅绑定结构。 以前传递给 v1`Bind()`中的方法的结构实例现在在[应用程序参数选项](../reference/options#应用程序参数选项)`Bind`字段中指定： + +```go title="v1" + app := wails.CreateApp(/* options */) + app.Bind(basic) +``` + +```go title="v2" + err := wails.Run(&options.App{ + /* other options */ + Bind: []interface{}{ + basic, + }, + }) +``` + +在 v1 中，绑定方法在`window.backend`中。 这已更改为`window.go`。 + +### 应用程序生命周期 + +In v1, there were 2 special methods in a bound struct: `WailsInit()` and `WailsShutdown()`. 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): 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): 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): + +- [应用启动回调](../reference/options.mdx#onstartup) +- [应用退出回调](../reference/options.mdx#onshutdown) +- [前端 Dom 加载完成回调](../reference/options.mdx#ondomready) + +注意：[前端 Dom 加载完成回调](../reference/options#前端-dom-加载完成回调)替换了 v1 中的 `wails:ready` 系统事件。 + +这些方法可以是标准函数，但通常的做法是将它们作为结构的一部分： + +```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 +} +... +type Basic struct { + ctx context.Context +} +func (b *Basic) startup(ctx context.Context) { + b.ctx = ctx +} +... +type Basic struct { + ctx context.Context +} +func (b *Basic) startup(ctx context.Context) { + b.ctx = ctx +} +... +``` + +### 运行时 + +v2 中的运行时比 v1 丰富得多，支持菜单、窗口操作和更好的对话框。 方法的签名略有变化 - 请参阅[运行时](../reference/runtime/intro)。 + +在 v1 中，[运行时](../reference/runtime/intro)可通过传递给`WailsInit()`. 在 v2 中，运行时已移出到它自己的包。 In v2, the runtime has been moved out to its own package. 运行时中的每个方法都采用`context.Context`传递给了[应用启动回调](../reference/options#应用启动回调)方法。 + +```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!") +} +} +} + +``` + +### 资源 + +在 v2 最大的变化是资源的处理方式。 + +在 v1 中，资源通过 2 个应用程序参数选项传递： + +- `JS` - 应用程序的 Javascript +- `CSS` - 应用程序的 CSS + +这意味着生成单个 JS 和 CSS 文件的责任在于开发人员。 这本质上需要使用繁琐的打包程序，例如 webpack。 + +在 v2 中，Wails 不对您的前端资源做任何预设，就像网络服务器一样。 您的所有应用程序资源都作为`embed.FS`. + +这意味着不需要打包您的资源、将图像编码为 Base64 或尝试使用奇葩的打包工具配置来使用自定义字体。 + +在启动时，Wails 将扫描给定的`embed.FS`的`index.html`并将其位置用作所有其他应用程序资源的根路径 - 就像网络服务器一样。 + +示例：应用程序具有以下项目布局。 所有最终资源都放在 `frontend/dist`目录中： + +```shell +. +. +. +├── build/ +├── frontend/ +│ └── dist/ +│ ├── index.html +│ ├── main.js +│ ├── main.css +│ └── logo.svg +├── main.go +└── wails.json +``` + +应用程序可以通过简单地创建一个`embed.FS`来使用这些资源： + +```go title="Assets Example" +//go:embed frontend/dist +var assets embed.FS + +func main() { + err := wails.Run(&options.App{ + /* Other Options */ + Assets: assets, + }) +} +``` + +当然，如果您愿意，也可以使用打包工具。 唯一的要求是在 Wails 中使用`embed.FS`,将最终的程序资源目录传递给[应用程序参数选项](../reference/options#应用程序参数选项)的`Assets`键。 + +### 项目配置 + +在 v1 中，项目配置存储在项目根的 `project.json` 文件中。 在 v2 中，项目配置存储在项目根部的 `wails.json` 文件中。 + +文件的格式略有不同。 下面是区别： + +

+ +| 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.0.0-rc.1/guides/mouse-buttons.mdx b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/mouse-buttons.mdx new file mode 100644 index 000000000..dcb5b582d --- /dev/null +++ b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/mouse-buttons.mdx @@ -0,0 +1,25 @@ +# 鼠标按钮 + +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: 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: 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/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/overscroll.mdx b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/overscroll.mdx new file mode 100644 index 000000000..4262f1f84 --- /dev/null +++ b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/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.0.0-rc.1/guides/routing.mdx b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/routing.mdx new file mode 100644 index 000000000..910290a98 --- /dev/null +++ b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/routing.mdx @@ -0,0 +1,49 @@ +# 路由 + +路由是一种在应用程序中切换视图的流行方式。 此页面提供了有关如何执行此操作的一些指导。 + +## 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 + +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( + + {/* The rest of your app goes here */} + + } exact /> + } /> + } /> + {/* more... */} + + , + root +); +``` diff --git a/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/signing.mdx b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/signing.mdx new file mode 100644 index 000000000..a1f4ca990 --- /dev/null +++ b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/signing.mdx @@ -0,0 +1,575 @@ +# 代码签名 + +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. The guide will target CI environments, more specifically GitHub Actions. The guide will target CI environments, more specifically GitHub Actions. + +## Windows + +First off you need a code signing certificate. 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). 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. For signing your Wails app, a standard code signing certificate will do just fine. 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. 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: Here is a small workflow template: 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. + +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@v2 + - 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: "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@v2 + - 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/* + 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@v2 + - 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/* +``` + +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': 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': 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 /t /f certificate\certificate.pfx /p '${{ secrets.WIN_SIGNING_CERT_PASSWORD }}' + +``` + +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: The following variables needs to be replaced in the last line: 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@v2 + - 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: "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@v2 + - 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 mitchellh/gon/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/* +``` + +### 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). 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). 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: 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: 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: Here is a small template: 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@v2 + - 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: "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@v2 + - 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/mitchellh/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 mitchellh/gon/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": "@env:APPLE_PASSWORD" + }, + "sign" :{ + "application_identity" : "Developer ID Application: My Name" + } + } +``` + +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 +``` + +2. entitlements.plist: + +```plist +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@v2 + - 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 mitchellh/gon/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. + - 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 + 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 + 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 +``` + +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). Read more about entitlements [here](https://developer.apple.com/documentation/bundleresources/entitlements). 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: Here's an example `Info.plist` file: Here's an example `Info.plist` file: + +```plist + + + CFBundlePackageTypeAPPL + CFBundleNameMyApp + CFBundleExecutableapp + CFBundleIdentifierapp.myapp + CFBundleVersion0.1.0 + CFBundleGetInfoStringMy app is cool and nice and chill and + CFBundleShortVersionString0.1.0 + CFBundleIconFileiconfile + LSMinimumSystemVersion10.13.0 + NSHighResolutionCapabletrue + LSApplicationCategoryTypepublic.app-category.utilities + NSHumanReadableCopyright© Me + +``` + +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 + 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 + 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@v2 + - 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 mitchellh/gon/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. + - 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 + 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 + 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 +``` + +# 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). diff --git a/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/templates.mdx b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/templates.mdx new file mode 100644 index 000000000..5dba260b8 --- /dev/null +++ b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/templates.mdx @@ -0,0 +1,102 @@ +# 模板 + +Wails 从预先创建的模板生成项目。 在 v1 中，这是一组难以维护的项目，这些项目可能会过时。 在 v2 中，为了增强社区的能力，为模板添加了一些新功能： + +- 能够从[远程模板](../reference/cli#远程模板)生成项目 +- 帮助创建自己的模板的工具 + +## 创建模板 + +要创建模板，您可以使用`wails generate template`命令。 要生成默认模板，请运行： + +`wails generate template -name mytemplate` + +这将使用默认文件创建“mytemplate”目录： + +```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 +``` + +### 模板概述 + +默认模板包含以下文件和目录： + +| 文件名 / 目录 | 描述 | +| --------------- | ----------------- | +| NEXTSTEPS.md | 有关如何完成模板的说明 | +| README.md | 随模板发布的 README | +| app.tmpl.go | `app.go` 模板文件 | +| frontend/ | 包含前端资源的目录 | +| go.mod.tmpl | `go.mod` 模板文件 | +| main.tmpl.go | `main.go` 模板文件 | +| template.json | 模板元数据 | +| wails.tmpl.json | `wails.json` 模板文件 | + +此时，建议按照`NEXTSTEPS.md`中的步骤操作。 + +## 从现有项目创建模板 + +通过在生成模板时将路径传递给项目，可以从现有的前端项目创建模板。 我们现在将介绍如何创建 Vue 3 模板： + +- 安装 vue cli： `npm install -g @vue/cli` +- 创建默认项目：`vue create vue3-base` + - 选择 `Default (Vue 3) ([Vue 3] babel, eslint)` +- 项目生成后，运行： + +```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... +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... +``` + +- 现在可以按照`NEXTSTEPS.md`中指定的方式定制模板。 +- 一旦文件准备完毕，就可以通过运行命令来测试它：`wails init -n my-vue3-project -t .\wails-vue3-template\` +- 要测试新项目，请运行：`cd my-vue3-project` then `wails build` +- 项目编译完成后，运行它：`.\build\bin\my-vue3-project.exe` +- 您应该有了一个功能齐全的 Vue3 应用程序： + +
+ +
+ +## 发布模板 + +发布模板只是将文件推送到 GitHub。 鼓励以下最佳实践： + +- 从前端目录中删除任何不需要的文件和目录（例如：.git） +- 确保`template.json`完整，尤其是`helpurl` +- 将文件推送到 GitHub +- 在[社区模板](../community/templates)页面上创建 PR +- 在[模板公告](https://github.com/wailsapp/wails/discussions/825)讨论板上发布模板 diff --git a/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/troubleshooting.mdx b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/troubleshooting.mdx new file mode 100644 index 000000000..bf338f32f --- /dev/null +++ b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/troubleshooting.mdx @@ -0,0 +1,142 @@ +# 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 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 +NSAppTransportSecurity + + NSAllowsLocalNetworking + + +``` + +Reference: https://github.com/wailsapp/wails/issues/1504#issuecomment-1174317433 + +## Mac application not valid + +If your built application looks like this in finder: + +

+ +

+ +It's likely that your application's `info.plist` is invalid. Update the file in `build/.app/Contents/info.plist` and check if the data is valid, EG check the binary name is correct. To persist the changes, copy the file back to the `build/darwin` directory. + +## Cannot call backend method from frontend with variadic arguments + +If you have a backend method defined with variadic parameters, eg: + +```go +func (a *App) TestFunc(msg string, args ...interface{}) error { + // Code +} +``` + +calling this method from the frontend like this will fail: + +```js +var msg = "Hello: "; +var args = ["Go", "JS"]; +window.go.main.App.TestFunc(msg, ...args) + .then((result) => { + //do things here + }) + .catch((error) => { + //handle error + }); +``` + +Workaround: + +```js +var msg = "Hello "; +var args = ["Go", "JS"]; +window.go.main.App.TestFunc(msg, args) + .then((result) => { + //without the 3 dots + //do things here + }) + .catch((error) => { + //handle error + }); +``` + +Credit: https://github.com/wailsapp/wails/issues/1186 + +## I'm having getting proxy errors when trying to install Wails + +If you are getting errors like this: + +``` +"https://proxy.golang.org/github.com/wailsapp/wails/cmd/wails/@v/list": dial tcp 172.217.163.49:443: connectex: A connection attempt failed because the connected party did not properly respond after a period of time, or established connection failed because connected host has failed to respond. +``` + +it's probably because the official Go Proxy is being blocked (Users in China have reported this). The solution is to set up the proxy manually, eg: 解决方案是手动设置代理，例如： + +``` +go env -w GO111MODULE=on +go env -w GOPROXY=https://goproxy.cn,direct +``` + +Source: https://github.com/wailsapp/wails/issues/1233 + +## The generated Typescript doesn't have the correct types + +Sometimes 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). 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. 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 `` section of any new page you navigate to: + +```html + + + + +``` + +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. 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). 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. + +Source: https://github.com/wailsapp/wails/issues/1806 \ No newline at end of file diff --git a/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/vscode.mdx b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/vscode.mdx new file mode 100644 index 000000000..9911a286c --- /dev/null +++ b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/vscode.mdx @@ -0,0 +1,118 @@ + +# 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. 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. 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: 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' + ] + } + ] +} + 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. diff --git a/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/windows-installer.mdx b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/windows-installer.mdx new file mode 100644 index 000000000..5eb5b7d1f --- /dev/null +++ b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/windows-installer.mdx @@ -0,0 +1,56 @@ +# NSIS 安装程序 + +

+ +
+

+ +Wails 支持使用[NSIS 安装程序](https://nsis.sourceforge.io/)生成 Windows 安装程序。 + +## 安装 NSIS + +### Windows + +安装程序可在[NSIS 下载页面](https://nsis.sourceforge.io/Download)上找到。 + +如果您使用 chocolatey 包管理器，请运行以下脚本： + +``` +choco install nsis +``` + +如果手动安装 NSIS，则需要将 NSIS 安装目录中包含`makensis.exe`的*Bin*目录添加到 PATH 中。 [这是](https://www.architectryan.com/2018/03/17/add-to-the-path-on-windows-10/) 一个关于如何在 Windows 上添加到 PATH 的好教程。 + +### Linux + +应该可以通过您的发行版的软件包管理器获得`nsis`包。 + +### MacOS + +NSIS 可通 homebrew 安装：`brew install nsis`。 + +## 生成安装程序 + +创建新项目时，Wails 从`installer/info.json`中读取配置数据并使用项目的`wails.json`的 Info 部分，在`build/windows/installer`中生成 NSIS 配置文件： 创建新项目时，Wails 从`installer/info.json`中读取配置数据并使用项目的`wails.json`的 Info 部分，在`build/windows/installer`中生成 NSIS 配置文件： The config data is read from `installer/info.json` and that is configured to use the project's `wails.json` Info section: 创建新项目时，Wails 从`installer/info.json`中读取配置数据并使用项目的`wails.json`的 Info 部分，在`build/windows/installer`中生成 NSIS 配置文件： 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)" + }, +``` + +要为您的应用程序生成安装程序，请使用`wails build`的`-nsis`标志： + +``` +wails build -nsis +``` + +现在可用安装程序将生成在`build/bin`目录中。 diff --git a/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/windows.mdx b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/windows.mdx new file mode 100644 index 000000000..93f89b44c --- /dev/null +++ b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/guides/windows.mdx @@ -0,0 +1,61 @@ +# Windows 系统 + +此页面包含了在 Windows 上开发 Wails 应用程序相关的其他指南。 + +## 处理 WebView2 运行时依赖 + +为 Windows 构建 Wails 应用程序时对 Microsoft [WebView2 运行时](https://developer.microsoft.com/en-us/microsoft-edge/webview2/)有要求。 默认情况下，Windows 11 会安装它，但有些机器不会。 Wails 提供了一种简单的方法来处理这种依赖关系。 + +通过在构建时使用`-webview2`标志,您可以决定在未检测到合适的运行时的时候（包括安装的运行时是否太旧）应用程序将执行的操作。 四个选项是： + +1. Download（下载） +2. Embed（内嵌） +3. Browser（浏览器） +4. Error（错误） + +### Download（下载） + +此选项将提示用户在未找到合适的运行时时，提供从 Microsoft 的 WebView2 官方站点下载并运行引导程序。 如果用户继续，官方引导程序将被下载并运行。 + +### Embed（内嵌） + +此选项将官方引导程序嵌入到应用程序中。 如果没有找到合适的运行时，应用程序将提供并运行引导程序。 这将使二进制大小增加约 150k。 + +### Browser（浏览器） + +此选项将提示用户没有找到合适的运行时时，提供打开浏览器到 WebView2 官方页面，可以下载和安装引导程序。 然后应用程序将会退出，安装的操作留给用户。 + +### Error（错误） + +如果未找到合适的运行时间，则会向用户显示错误并且不采取进一步措施。 + +## Fixed version runtime + +Another way of dealing with webview2 dependency is shipping it yourself. Another way of dealing with webview2 dependency is shipping it yourself. You can download [fixed version runtime](https://developer.microsoft.com/ru-ru/microsoft-edge/webview2/#download-section) and bundle or download it with your application. 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. + +## 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). diff --git a/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/howdoesitwork.mdx b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/howdoesitwork.mdx new file mode 100644 index 000000000..297b4087b --- /dev/null +++ b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/howdoesitwork.mdx @@ -0,0 +1,435 @@ +--- +sidebar_position: 20 +--- + +# 它是如何工作的？ + +Wails 应用程序是一个带有一个 webkit 前端的标准的 Go 应用程序。 应用程序的 Go 部分由应用程序代码和一个运行时库组成， 该库提供了许多有用的操作，例如控制应用程序窗口。 前端是一个 webkit 窗口，将显示前端资源。 前端还可以使用运行时库的 Javascript 版本。 最后，可以将 Go 方法绑定到前端，这些将显示为可以调用的 Javascript 方法，就像它们是原生 Javascript 方法一样。 + +
+ +
+ +## 主应用程序 + +### 概述 + +主应用程序由对`wails.Run()`的调用组成。 它接受描述应用程序窗口大小、窗口标题、要使用的资源等应用程序配置。 基本应用程序可能如下所示： + +```go title="main.go" +package main + +import ( + "embed" + "log" + + "github.com/wailsapp/wails/v2" + "github.com/wailsapp/wails/v2/pkg/options" +) + +//go:embed frontend/dist +var assets embed.FS + +func main() { + + app := &App{} + + err := wails.Run(&options.App{ + Title: "Basic Demo", + Width: 1024, + Height: 768, + Assets: &assets, + OnStartup: app.startup, + OnShutdown: app.shutdown, + Bind: []interface{}{ + app, + }, + }) + if err != nil { + log.Fatal(err) + } +} + + +type App struct { + ctx context.Context +} + +func (b *App) startup(ctx context.Context) { + b.ctx = ctx +} + +func (b *App) shutdown(ctx context.Context) {} + +func (b *App) Greet(name string) string { + return fmt.Sprintf("Hello %s!", name) +} +``` + +### 选项概要 + +此示例设置了以下选项： + +- `Title` - 应该出现在窗口标题栏中的文本 +- `Width&Height`- 窗口的尺寸 +- `Assets` - 应用程序的前端资源 +- `OnStartup` - 创建窗口并即将开始加载前端资源时的回调 +- `OnShutdown` - 应用程序即将退出时的回调 +- `Bind` - 我们希望向前端暴露的一部分结构体实例 + +完整的应用程序参数选项列表可以在[参数选项](./reference/options)中找到。 + +#### 资产 + +`Assets` 选项是必须的，因为您不能拥有没有前端资源的 Wails 应用程序。 这些资源可以是您希望在 Web 应用程序中找到的任何文件 - html、js、css、svg、png 等。 **不需要生成资源包** - 纯文件即可。 当应用程序启动时，它将尝试从您的资源中加载`index.html`，并且那时起前端基本上将作为浏览器工作。 值得注意的是`embed.FS`对文件所在的位置没有要求。 嵌入路径很可能使用了相对于您的主应用程序代码的嵌套目录，例如 `frontend/dist`： + +```go title="main.go" +//go:embed frontend/dist +var assets embed.FS +``` + +启动时，Wails 将遍历嵌入的文件，寻找包含的`index.html`。 所有其他资源将相对于该目录加载。 + +由于可用于生产的二进制文件使用包含在`embed.FS`中的文件，因此应用程序不需要附带任何外部文件。 + +当使用`wails dev`命令在“开发”模式下，资源从磁盘加载，任何更改都会导致“实时重新加载”。 资产的位置将从 `embed.FS` 推断。 + +更多细节可以在[应用程序开发指南](./guides/application-development)中找到。 + +#### 应用程序生命周期回调 + +在即将加载前端`index.html`之前，对 [应用启动回调](./reference/options#应用启动回调) 中提供的函数进行调用。 一个标准的 Go 上下文被传递给这个方法。 调用运行时需要此上下文，因此标准方式是保存此时对它的引用。 在应用程序关闭之前，再次使用上下文以同样的方式调用 [应用退出回调](./reference/options#应用退出回调)。 当前端完成加载`index.html`中所有资源时，还有一个 [前端 Dom 加载完成回调](./reference/options#前端-dom-加载完成回调) ，相当于 Javascript 中的`body onload`事件。 还可以通过设置 [关闭应用程序之前回调](./reference/options#关闭应用程序之前回调) 选项来控制窗口关闭（或应用程序退出）事件。 + +#### 方法绑定 + +`Bind`选项是 Wails 应用程序中最重要的参数选项之一。 它指定向前端暴露哪些结构方法。 想到传统的 web 应用程序中的 "Controllers" 。 当应用程序启动时，它会检查 `Bind` 中列出的结构实例， 确定哪些方法是公开的（以大写字母开头），并将生成前端可以调用的那些方法的 Javascript 版本。 + +:::info 注意 + +Wails 要求您传入结构的 _实例_ 才能正确绑定它 + +::: + +在此示例中，我们创建一个新`App`实例，然后将此实例添加到`wails.Run`中的`Bind`选项： + +```go {16,24} title="main.go" +package main + +import ( + "embed" + "log" + + "github.com/wailsapp/wails/v2" + "github.com/wailsapp/wails/v2/pkg/options" +) + +//go:embed frontend/dist +var assets embed.FS + +func main() { + + app := &App{} + + err := wails.Run(&options.App{ + Title: "Basic Demo", + Width: 1024, + Height: 768, + Assets: &assets, + 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) +} +``` + +您可以绑定任意数量的结构体。 只需确保创建它的一个实例并将其传递给 `Bind`： + +```go {8-10} + //... + //... + ... + err := wails.Run(&options.App{ + Title: "Basic Demo", + Width: 1024, + Height: 768, + Assets: &assets, + OnStartup: app.startup, + OnShutdown: app.shutdown, + Bind: []interface{}{ + app, + &mystruct1{}, + &mystruct2{}, + }, + }) +... + +``` + +When you run `wails dev` (or `wails generate module`), a frontend module will be generated containing the following: + +- 调用绑定的 Go 方法 +- 调用运行时方法 +- 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. + +## 前端 + +### 概述 + +前端是由 webkit 渲染的文件集合。 这就像浏览器和网络服务器合二为一。 您可以使用的框架或库[^1]几乎没有限制。 前端和 Go 代码之间的主要交互点是： + +- 调用绑定的 Go 方法 +- 调用运行时方法 + +### 调用绑定的 Go 方法 + +在`wails dev`模式下运行应用程序时，会生成一个 javascript 模块，该模块用 JSDoc 注释包装这些方法。 这确实有助于开发，尤其是因为大多数 IDE 将处理 JSDoc 以提供代码完成和类型提示。 该模块名为`go` 并在`wailsjsdir`标志指定的目录中生成。 The generated files mirror the package names in your application. 在上面的例子中，我们绑定 `app`，它有一个公开方法 `Greet`。 在上面的例子中，我们绑定 `app`，它有一个公开方法 `Greet`。 This will lead to the generation of the following files: + +```bash +window.go.main.App.Greet("Bill").then((result) => { + console.log("The greeting is: " + result); + }) +``` + +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: 要从我们的前端调用 `Greet`，我们只需导入该方法并像普通的 Javascript 函数一样调用它： + +```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 +const go = { + main: { + App: { + /** + * Greet + * @param {Person} arg1 - Go Type: string + * @returns {Promise} - Go Type: string + */ + Greet: (arg1) => { + return window.go.main.App.Greet(arg1); + }, + }, + }, +}; +export default go; +``` + +这些方法返回一个 Promise。 成功的调用将导致 Go 调用的第一个返回值被传递给 `resolve` 处理程序。 一个不成功的调用是将一个 Go 方法的第二个错误类型返回值通过`reject`传递回调用者。 这通过 `reject` 处理程序传回。 This is passed back via the `reject` handler. 在上面的例子中，Greet 只返回一个字符串，所以 `Javascript` 调用永远不会`reject` - 除非将无效数据传递给它。 + +所有数据类型都在 Go 和 Javascript 之间正确转换。 包括结构体。 如果您从 Go 调用返回一个结构体，它将作为 `Javascript` Map 返回到您的前端。 注意：如果您想使用结构体，您必须为您的结构体字段定义`json` 标签！ + +:::info 注意 +目前不支持嵌套匿名结构体。 +::: + +也可以将结构体发送回 Go。 任何作为期望结构的参数传递的 Javascript Map 都将转换为该结构类型。 为了使这个过程更容易，在 `开发`模式下，会生成一个 TypeScript 模块，定义绑定方法中使用的所有结构类型。 使用此模块，可以构建原生 Javascript 对象并将其发送到 Go 代码。 + +还额外支持在其签名中使用结构的 Go 方法。 所有由绑定方法指定的 Go 结构体（作为参数或返回类型）都将自动生成 Typescript 版本作为 Go 代码包装器模块的一部分。 使用这些，可以在 Go 和 Javascript 之间共享相同的数据模型。 + +此外`bindings.js`，还有一个名为`models.ts`的文件. 这包含我们 Go 结构体的 TypeScript 形式： + +```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) +} +``` + +只要您将 TypeScript 作为前端构建配置的一部分，您就可以通过以下方式使用这些模型： + +```js title="App.js" +export class Address { + street: string; + postcode: string; + + static createFrom(source: any = {}) { + return new Address(source); + } + + constructor(source: any = {}) { + if ("string" === typeof source) source = JSON.parse(source); + this.street = source["street"]; + this.postcode = source["postcode"]; + } +} +export class Person { + name: string; + age: number; + address?: Address; + + static createFrom(source: any = {}) { + return new Person(source); + } + + constructor(source: any = {}) { + if ("string" === typeof source) source = JSON.parse(source); + this.name = source["name"]; + this.age = source["age"]; + this.address = this.convertValues(source["address"], Address); + } + + convertValues(a: any, classs: any, asMap: boolean = false): any { + if (!a) { + return a; + } + if (a.slice) { + return (a as any[]).map((elem) => this.convertValues(elem, classs)); + } else if ("object" === typeof a) { + if (asMap) { + for (const key of Object.keys(a)) { + a[key] = new classs(a[key]); + } + return a; + } + return new classs(a); + } + return a; + } +} +``` + +JSDoc 和 TypeScript 生成模型的组合构成了一个强大的开发环境。 + +```ts title="App.d.ts" +import go from "./wailsjs/go/bindings"; +import { Person } from "./wailsjs/go/models"; + +let name = ""; + +function greet(name) { + let p = new Person(); + p.name = name; + p.age = 42; + go.main.App.Greet(p).then((result) => { + console.log(result); + }); +} +``` + +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: 该文件包含我们绑定方法使用的所有结构定义。 在这个示例中，这是一个 `Person` 结构体。 如果我们查看 `models.ts`，我们可以看到模型是如何定义的： + +```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) { + 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; + } + } +} +``` + +可以在[运行时参考](./reference/runtime/intro)中找到有关 JS 运行时的更多详细信息。 + +```js title="mycode.js" +const go = { + main: { + App: { + /** + * Greet + * @param {Person} arg1 - Go Type: main.Person + * @returns {Promise} - Go Type: string + */ + Greet: (arg1) => { + return window.go.main.App.Greet(arg1); + }, + }, + }, +}; +export default go; +``` + +The combination of generated bindings and TypeScript models makes for a powerful development environment. + +关于绑定的更多信息可以在[应用程序开发指南](./guides/application-development)的[绑定方法](./guides/application-development#绑定方法)一节中找到。 + +### 调用运行时方法 + +Javascript 运行时位于`window.runtime`并包含许多方法来执行各种任务，例如发出事件或执行日志记录操作： + +```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). + +[^1]: 有一小部分库使用了 WebView 中不支持的功能。 对于这种情况，通常有替代方案和解决方法。 diff --git a/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/introduction.mdx b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/introduction.mdx new file mode 100644 index 000000000..8c191a7aa --- /dev/null +++ b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/introduction.mdx @@ -0,0 +1,71 @@ +--- +sidebar_position: 1 +--- + +# 简介 + +Wails 是一个可让您使用 Go 和 Web 技术编写桌面应用的项目。 + +将它看作为 Go 的快并且轻量的 Electron 替代品。 您可以使用 Go 的灵活性和强大功能，结合丰富的现代前端，轻松的构建应用程序。 + +### 功能 + +- 原生菜单、对话框、主题和半透明 +- Windows、macOS 和 linux 支持 +- 内置 Svelte、React 、Preact 、Vue、Lit 和 Vanilla JS 的模板 +- 从 Javascript 轻松调用 Go 方法 +- 自动将Go结构体转换为TypeScript模块 +- Windows 上不需要 CGO 或外部 DLL +- 使用 [Vite ](https://vite.net/) 的实时开发模式 +- 可以轻松创建、构建和打包应用的强大命令行工具 +- 丰富的 [运行时库](/docs/next/reference/runtime) +- Applications built with Wails are Apple & Microsoft Store compliant + + +这是 [varly](https://varly.app) - 一个使用 Wails 编写的 MacOS 和 Windows 桌面应用。 它不仅看起来很强，它使用原生菜单和半透明 - 你希望从现代原生应用中得到的一切 + +

+ + + +

+ +### 快速启动模板 + +Wails 带有许多预配置的模板，可让您快速启动和运行应用程序。 有以下框架的模板：Svelte、React、Vue、Preact、Lit 和 Vanilla。 每个模板都有 Javascript 和 Typescript 版本。 + +### 原生元素 + +Wails 使用专门构建的库来处理窗口、菜单、对话框等原生元素，因此您可以构建美观、功能丰富的桌面应用程序。 + +**它不嵌入浏览器**，因此性能高。 相反，它使用平台的原生渲染引擎。 在 Windows 上，是基于 Chromium 构建的新 Microsoft Webview2 库。 + +### Go 和 Javascript 互操作 + +Wails 自动使您的 Go 方法可用于 Javascript，因此您可以从前端按名称调用它们！ 它甚至会生成 Go 方法使用的结构体的 Typescript 版本，因此您可以在 Go 和 Javascript 之间传递相同的数据结构。 + +### 运行时库 + +当检测到您的应用程序资源发生更改时，您正在运行的应用程序将“重新加载”，几乎立即反馈您的更改。 + +### 实时开发体验 + +#### 自动重新构建 + +当您在“开发”模式下运行您的应用程序时，Wails 会将您的应用程序构建为原生桌面应用程序，但会从磁盘读取您的资源。 它将检测您的 Go 代码的任何更改并自动重新构建和重新启动您的应用程序。 + +#### 自动重新加载 + +当检测到对您的应用程序资产的更改时，您正在运行的应用程序将“重新加载”，几乎立即反映您的更改 + +#### 在浏览器中开发您的应用程序 + +如果您更喜欢在浏览器中调试和开发，那么 Wails 可以满足您的需求。 正在运行的应用程序还有一个网络服务器，它将在连接到它的任何浏览器中运行您的应用程序。 当您的资源在磁盘上发生变化时，它会刷新。 + +### 可用于生产的原生二进制文件 + +当您准备好完成应用程序的最终构建时，CLI 会将其编译为单个可执行文件，并将所有资源打包到其中。 在 Windows 和 MacOS 上，可以创建用于分发的原生包。 使用打包工具后生成的资源（图标、info.plist、清单文件等）是您项目的一部分，可以自定义，让您完全控制应用程序的构建方式。 + +### 工具 + +Wails CLI 提供了一种简单的方法来生成、构建和打包您的应用程序。 它将完成创建图标的繁重工作，使用最佳设置编译您的应用程序，并提供可分发的、可用于生产的二进制文件。 可以从许多入门模板中进行选择，以快速启动和运行！ diff --git a/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/_category_.json b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/_category_.json new file mode 100644 index 000000000..ebb337b83 --- /dev/null +++ b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/_category_.json @@ -0,0 +1,4 @@ +{ + "label": "Reference", + "position": 40 +} diff --git a/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/cli.mdx b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/cli.mdx new file mode 100644 index 000000000..41b1a9926 --- /dev/null +++ b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/cli.mdx @@ -0,0 +1,252 @@ +--- +sidebar_position: 2 +--- + +# 命令行 + +Wails CLI 有许多用于管理项目的命令。 所有命令都以此方式运行： + +`wails <命令> <标志>` + +## 初始化 + +`wails init` 用于生成项目。 + +| 标志 | 描述 | 默认 | +|:--------- |:---------------------------------------------- |:-------:| +| -n "项目名称" | 项目名称。 **强制必填** | | +| -d "项目目录" | 要创建的项目目录 | 项目名 | +| -g | 初始化 git 存储库 | | +| -l | 可用项目模板列表 | | +| -q | 禁止输出到控制台 | | +| -t "模板名称" | 要使用的项目模板。 这可能是默认模板的名称或在 github 上托管的远程模板的 URL 。 | vanilla | +| -ide | 生成 IDE 项目文件 | | +| -f | 强制构建应用 | 否 | + +示例： `wails init -n test -d mytestproject -g -ide vscode -q` + +这将在 "mytestproject" 目录生成一个名为 "test" 的项目，初始化 git，生成 vscode 项目文件并静默执行。 + +可以在[此处](../guides/ides)找到有关在 Wails 中使用 IDE 的更多信息。 + +### 远程模板 + +支持远程模板（托管在 GitHub 上）并且可以使用模板项目的 URL 进行安装。 + +示例： `wails init -n test -t https://github.com/leaanthony/testtemplate[@v1.0.0]` + +可以在[此处](../community/templates)找到社区维护的模板列表 + +:::warning 注意 + +**Wails 项目不维护也不对第 3 方模板负责** + +如果您不信任某个模板，请检查 `package.json` 和 `wails.json` 中安装的模块和运行的脚本。 + +::: + +## 构建 + +`wails build`用于将您的项目编译为生产可用的二进制文件。 + +| 标志 | 描述 | 默认 | +|:-------------------- |:------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ |:--------------------------- | +| -platform | 为指定的[平台](../reference/cli#平台)（逗号分割）构建，例如：`windows/arm64`。 `windows/arm64`. `windows/arm64`. 注意，如果没有指定架构，则使用`runtime.GOARCH`。 `windows/arm64`. 注意，如果没有指定架构，则使用`runtime.GOARCH`。 | runtime.GOOS/runtime.GOARCH | +| -clean | 清理`build/bin`目录 | | +| -compiler "编译器" | 使用不同的 go 编译器来构建，例如 go1.15beta1 | go | +| -ldflags "标志" | 传递给编译器的额外 ldflags | | +| -nopackage | 不打包应用程序 | | +| -o filename | 输出文件名 | | +| -s | 跳过前端构建 | 否 | +| -f | 强制构建应用 | 否 | +| -tags "额外标签" | 传递给编译器构建标签（引号和空格分隔） | | +| -upx | 使用“upx”压缩最终二进制文件 | | +| -upxflags | 传递给 upx 的标志 | | +| -v int | 详细级别 (0 - silent, 1 - default, 2 - verbose) | 1 | +| -webview2 | WebView2 安装程序策略：download,embed,browser,error. | download | +| -u | 更新项目的 `go.mod` 以使用与 CLI 相同版本的 Wails | | +| -debug | 在应用程序中保留调试信息 在应用程序中保留调试信息 Allows the use of the devtools in the application window | 否 | +| -trimpath | Remove all file system paths from the resulting executable. | 否 | +| -race | Build with Go's race detector | 否 | +| -platform "platform" | Keep the console window for Windows builds | 否 | + +有关`webview2`标志的详细描述，请参阅[Windows 系统](../guides/windows)指南。 + +如果您更喜欢使用标准 Go 工具进行构建，请参阅[手动构建](../guides/manual-builds)指南。 + +示例： + +`wails build -clean -o myproject.exe` + +:::info 苹果芯片上的 UPX + +在苹果芯片上使用 UPX 相关的[问题](https://github.com/upx/upx/issues/446)。 + +::: + +:::info Windows 上的 UPX + +一些防病毒软件供应商误将`upx`压缩的二进制文件标记为病毒，请查看相关[问题](https://github.com/upx/upx/issues/437)。 + +::: + +### 平台 + +支持的平台有： + +| 平台 | 描述 | +|:---------------- |:--------------------------------------------- | +| 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 | + +## 诊断检查 + +`wails doctor` 将运行诊断程序以确保您的系统已准备好进行开发。 + +示例： + +``` +Wails CLI v2.0.0-beta + +Scanning system - Please wait (this may take a long time)...Done. + +Wails CLI v2.0.0-beta + +Scanning system - Please wait (this may take a long time)...Done. + +System +------ +OS: Windows 10 Pro +Version: 2009 (Build: 19043) +ID: 21H1 +Go Version: go1.17 +Platform: windows +Architecture: amd64 + +Dependency Package Name Status Version +---------- ------------ ------ ------- +WebView2 N/A Installed 93.0.961.52 +npm N/A Installed 6.14.15 +*upx N/A Installed upx 3.96 +*docker N/A Installed 20.10.6 + +* - Optional Dependency + +Diagnosis +--------- +Your system is ready for Wails development! + +Wails CLI v2.0.0-beta + +Scanning system - Please wait (this may take a long time)...Done. + +System +------ +OS: Windows 10 Pro +Version: 2009 (Build: 19043) +ID: 21H1 +Go Version: go1.17 +Platform: windows +Architecture: amd64 + +Dependency Package Name Status Version +---------- ------------ ------ ------- +WebView2 N/A Installed 93.0.961.52 +npm N/A Installed 6.14.15 +*upx N/A Installed upx 3.96 +*docker N/A Installed 20.10.6 + +* - Optional Dependency + +Diagnosis +--------- +Your system is ready for Wails development! + +``` + +## 开发 + +`wails dev` 用于以 "实时开发" 模式运行您的应用。 这意味着： + +- 应用程序的`go.mod`将被更新为与 Wails CLI 版本相同的版本 +- 应用程序被编译并自动运行 +- 一个观察者被启动，如果它检测到您的 go 文件的变化，它将触发您的开发应用程序的重新构建 +- 启动一个网络服务器`http://localhost:34115`，通过 http 为您的应用程序（不仅仅是前端）提供服务。 这允许您使用您喜欢的浏览器开发扩展 +- 所有应用程序资源都从磁盘加载。 如果它们被更改，应用程序将自动重新加载（而不是重新构建）。 所有连接的浏览器也将重新加载 +- 生成的 JS 模块提供以下内容： + - 带有自动生成的 JSDoc 的 Go 方法的 Javascript 包装器，提供代码提示 + - 您的 Go 结构体的 TypeScript 版本，可以构造并传递给您的 Go 方法 +- 生成第二个 JS 模块，为运行时提供包装器 + TS 声明 + +| 标志 | 描述 | 默认 | +|:------------------------------ |:-------------------------------------------------------------------------------------------------------------------------------- |:------------------------ | +| -assetdir "./path/to/assets" | 编译资源的路径 | `wails.json`中的值 | +| -browser | 在启动时打开浏览器到`http://localhost:34115` | | +| -compiler "编译器" | 使用不同的 go 编译器来构建，例如 go1.15beta1 | go | +| -e | 触发重新构建的扩展（逗号分隔） | go | +| -reloaddirs | 触发重新加载的附加目录（逗号分隔） | `wails.json`中的值 | +| -ldflags "标志" | 传递给编译器的额外 ldflags | | +| -tags "额外标签" | 传递给编译器构建标签（引号和空格分隔） | | +| -loglevel "日志级别" | 要使用的日志级别 - Trace, Debug, Info, Warning, Error | Debug | +| -noreload | 资源更改时禁用自动重新加载 | | +| -nogen | 详细级别 (0 - silent, 1 - standard, 2 - verbose) | | +| -v | 生成生成的 Wails JS 模块的目录 | 1 | +| -wailsjsdir | 检测到资源更改后等待重新加载的时间 | `wails.json`中的值 | +| -debounce | 将 wails 开发服务器绑定到的地址 | "http://localhost:34115" | +| -frontenddevserverurl "url 地址" | 使用第三方开发服务器提供资源，比如 Vite | "localhost:34115" | +| -frontenddevserverurl "url" | 以 shell 样式传递给应用程序的参数 | "" | +| -appargs "args" | 目标平台/架构 | | +| -save | 将指定的 `assetdir`、 `reloaddirs`、 `wailsjsdir`、 `debounce` 、 `devserver` 和 `frontenddevserverurl` 标志的值保存到 `wails.json` 以成为后续调用的默认值。 | | +| -race | Build with Go's race detector | 否 | +| -s | 跳过前端构建 | 否 | + +示例： + +`wails dev -assetdir ./frontend/dist -wailsjsdir ./frontend/src -browser` + +此命令将执行以下操作： + +- 构建应用程序并运行它（更多细节在[这里](../guides/manual-builds)） +- 在`./frontend/src`中生成 Wails JS 模块 +- 监听`./frontend/dist`中文件的更新并在更改时重新加载 +- 打开浏览器并连接到应用程序 + +[此处](../guides/application-development)提供了有关将此功能与现有框架脚本一起使用的更多信息。 + +## 生成 + +### 模板 + +Wails 使用模板来生成项目。 `wails generate template`命令有助于构建模板，以使它可以用于生成项目。 + +| 标志 | 描述 | +|:-------------- |:--------------- | +| -name | 模板名称（必填） | +| -frontend "路径" | 要在模板中使用的前端项目的路径 | + +有关创建模板的更多详细信息，请参阅[模板指南](../guides/templates)。 + +### module + +`wails update` 将更新 Wails CLI 的版本。 + +## 更新 + +`wails version` 仅输出当前的 CLI 版本。 + +| 标志 | 描述 | +|:------------- |:----------- | +| -pre | 更新到最新的预发布版本 | +| -version "版本" | 安装指定版本的 CLI | + +## 版本 + +`wails version` will simply output the current CLI version. diff --git a/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/menus.mdx b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/menus.mdx new file mode 100644 index 000000000..f486cb1e3 --- /dev/null +++ b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/menus.mdx @@ -0,0 +1,277 @@ +--- +sidebar_position: 4 +--- + +# 应用菜单 + +It is possible to add an application menu to Wails projects. 可以通过定义 [菜单](#菜单) 结构并设置 [`Menu`](../reference/options#菜单) 选项或者通过调用运行时方法 [设置应用程序菜单](../reference/runtime/menu#设置应用程序菜单) 来将应用程序菜单添加到 Wails 项目。 可以通过定义 [菜单](#菜单) 结构并设置 [`Menu`](../reference/options#菜单) 选项或者通过调用运行时方法 [设置应用程序菜单](../reference/runtime/menu#设置应用程序菜单) 来将应用程序菜单添加到 Wails 项目。 + +也可以通过更新菜单结构并调用[更新应用程序菜单](../reference/runtime/menu#更新应用程序菜单)来动态更新菜单 。 + +```go + AppMenu := menu.NewMenu() + FileMenu := AppMenu.AddSubmenu("File") + FileMenu.AddText("&Open", keys.CmdOrCtrl("o"), openFile) + FileMenu.AddSeparator() + FileMenu.AddText("Quit", keys.CmdOrCtrl("q"), func(_ *menu.CallbackData) { + runtime.Quit() + }) + + if runtime.GOOS == "darwin" { + AppMenu.Append(menu.EditMenu()) // on macos platform, we should append EditMenu to enable Cmd+C,Cmd+V,Cmd+Z... shortcut + } + + err := wails.Run(&options.App{ + Title: "Menus Demo", + Width: 800, + Height: 600, + Menu: AppMenu, + 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. + +type Menu struct { + Items []*MenuItem +} +``` + +示例: + +上面的示例使用快捷方法，但是可以手动构建菜单结构。 + +## Menu + +A Menu is a collection of MenuItems: + +```go title="Package: github.com/wailsapp/wails/v2/pkg/menu" +type Menu struct { + Items []*MenuItem +} +``` + +示例: + +上面的示例使用快捷方法，但是可以手动构建菜单结构。 + +```go title="Package: github.com/wailsapp/wails/v2/pkg/menu" +func NewMenuFromItems(first *MenuItem, rest ...*MenuItem) *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 +} +``` + +| 字段 | Type | 注解 | +| ----------- | ------------------------------------ | --------------------------- | +| Label | string | 菜单文字 | +| Accelerator | [\*keys.Accelerator](#accelerator) | 此菜单项的键绑定 | +| Type | [Type](#type) | 菜单项的类型 | +| Disabled | bool | 禁用菜单项 | +| Hidden | bool | 隐藏此菜单项 | +| Checked | bool | 向菜单项设置选中 (复选框和单选类型) | +| SubMenu | [\*Menu](#menu) | 设置子菜单 | +| Click | [Callback](#callback) | 单击菜单时的回调函数 | +| Role | string | 定义此菜单项的[角色](#角色)。 暂时只支持 Mac | + +### Accelerator + +加速器（有时称为键盘快捷键）定义了按键和菜单项之间的绑定。 Wails 将加速器定义为一个组合或键 + [修饰符](#修饰符)。 它们在`"github.com/wailsapp/wails/v2/pkg/menu/keys"`包中可用。 + +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") +``` + +键是键盘上除了`+`的任何字符，它被定义为`加号`。 有些键不能表示为字符，因此可以使用一组命名字符： + +- `backspace` +- `tab` +- `return` +- `enter` +- `escape` +- `left` +- `right` +- `up` +- `down` +- `space` +- `delete` +- `home` +- `end` +- `page up` +- `page down` +- `f1` +- `f2` +- `f3` +- `f4` +- `f5` +- `f6` +- `f7` +- `f8` +- `f9` +- `f10` +- `f11` +- `f12` +- `f13` +- `f14` +- `f15` +- `f16` +- `f17` +- `f18` +- `f19` +- `f20` +- `f21` +- `f22` +- `f23` +- `f24` +- `f25` +- `f26` +- `f27` +- `f28` +- `f29` +- `f30` +- `f31` +- `f32` +- `f33` +- `f34` +- `f35` +- `numlock` + +Wails 还支持使用与 Electron 相同的语法来解析加速器。 这对于在配置文件中存储加速器很有用。 + +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") +``` + +#### 修饰符 + +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 +``` + +示例: + +```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 + +以下修饰符是可以与加速键组合使用的键： + +```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" +) +``` + +许多快捷方法可用于使用修饰符创建加速器： + +```go title="Package: github.com/wailsapp/wails/v2/pkg/menu" +myMenu := menu.NewMenuFromItems( + menu.SubMenu("File", menu.NewMenuFromItems( + menu.Text("&Open", keys.CmdOrCtrl("o"), openFile), + menu.Separator(), + menu.Text("Quit", keys.CmdOrCtrl("q"), func(_ *menu.CallbackData) { + runtime.Quit() + }), + )), + ) + + runtime.MenuSetApplicationMenu(myMenu) +``` + +修饰符可以结合`keys.Combo(key string, modifier1 Modifier, modifier2 Modifier, rest ...Modifier)`使用： + +```go title="Package: github.com/wailsapp/wails/v2/pkg/menu" +func Text(label string, accelerator *keys.Accelerator, click Callback) *MenuItem +func Separator() *MenuItem +func Radio(label string, selected bool, accelerator *keys.Accelerator, click Callback) *MenuItem +func Checkbox(label string, checked bool, accelerator *keys.Accelerator, click Callback) *MenuItem +func SubMenu(label string, menu *Menu) *MenuItem +``` + +关于单选菜单组的说明:单选菜单组定义为菜单中相邻的多个单选菜单项。 这意味着您不需要将项目分组在一起，因为它是自动的。 然而，这也意味着您不能有两个相邻的单选菜单组-它们之间必须有一个非单选菜单项。 + +### Callback + +为方便起见，提供了快捷方法来快速创建菜单项： + +```go title="Package: github.com/wailsapp/wails/v2/pkg/menu" +type Callback func(*CallbackData) + +type CallbackData struct { + MenuItem *MenuItem +} +``` + +给函数一个`CallbackData`结构体，它指示哪个菜单项触发了回调。 这在使用可能共享回调的单选菜单组时很有用。 + +### Role + +每个菜单项都可能有一个回调，在单击该项时会执行该回调： + +目前仅 Mac 支持角色。 + +::: + +一个菜单项可能有一个角色，它本质上是一个预定义的菜单项。 我们目前支持以下角色： + +| Role | 描述 | +| ------------ | -------------------------------------- | +| AppMenuRole | 标准的 Mac 应用程序菜单。 可以使用`menu.AppMenu()`创建 | +| EditMenuRole | 标准的 Mac 编辑菜单。 可以使用`menu.EditMenu()`创建 | diff --git a/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/options.mdx b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/options.mdx new file mode 100644 index 000000000..5235e6fa0 --- /dev/null +++ b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/options.mdx @@ -0,0 +1,644 @@ +--- +sidebar_position: 3 +--- + +# 参数选项 + +## 应用程序参数选项 + +该`Options.App`结构包含应用程序配置。 它被传递给`wails.Run()`方法： + +```go title="Example" +import "github.com/wailsapp/wails/v2/pkg/options" + +func main() { + + err := wails.Run(&options.App{ + Title: "Menus Demo", + Width: 800, + Height: 600, + DisableResize: false, + Fullscreen: false, + Frameless: true, + MinWidth: 400, + MinHeight: 400, + MaxWidth: 1280, + MaxHeight: 1024, + StartHidden: false, + HideWindowOnClose: false, + BackgroundColour: &options.RGBA{R: 0, G: 0, B: 0, A: 255}, + AlwaysOnTop: false, + Assets: assets, + AssetsHandler: assetsHandler, + Menu: app.applicationMenu(), + Logger: nil, + LogLevel: logger.DEBUG, + LogLevelProduction: logger.ERROR, + OnStartup: app.startup, + OnDomReady: app.domready, + OnShutdown: app.shutdown, + OnBeforeClose: app.beforeClose, + WindowStartState: options.Maximised, + CSSDragProperty: "--wails-draggable", + CSSDragValue: "drag", + Bind: []interface{}{ + app, + }, + Windows: &windows.Options{ + WebviewIsTransparent: false, + WindowIsTranslucent: 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), + }, + // User messages that can be customised + Messages *windows.Messages + }, + Mac: &mac.Options{ + TitleBar: &mac.TitleBar{ + TitlebarAppearsTransparent: true, + HideTitle: false, + HideTitleBar: false, + FullSizeContent: false, + UseToolbar: false, + HideToolbarSeparator: true, + }, + Appearance: mac.NSAppearanceNameDarkAqua, + WebviewIsTransparent: true, + WindowIsTranslucent: false, + About: &mac.AboutInfo{ + Title: "My Application", + Message: "© 2021 Me", + Icon: icon, + }, + }, + Linux: &linux.Options{ + Icon: icon, + }, + }) + if err != nil { + log.Fatal(err) + } +} + +``` + +### 标题 + +窗口标题栏中显示的文本。 + +类型：string + +### 宽度 + +窗口的初始宽度。 + +名称：Width + +### 高度 + +窗口的初始高度。 + +类型：`windows.Theme` + +### 禁用调整窗口尺寸 + +默认情况下，主窗口可调整大小。 将此设置为 `true` 将使其保持固定大小。 + +类型：int + +### Fullscreen + +将此设置为 `true` 将在启动时使窗口全屏。 + +类型：int + +### 无边框 + +设置为`true`时，窗口将没有边框或标题栏。 另请参阅[无边框窗口](../guides/frameless)。 + +类型：int + +### 最小宽度 + +这将设置窗口的最小宽度。 如果给出的值`Width`小于这个值，窗口将被设置为`MinWidth`默认值。 + +类型：bool + +### 最小高度 + +这将设置窗口的最小高度。 如果给出的值`Height`小于这个值，窗口将被设置为`MinHeight`默认值。 + +类型：bool + +### 最大宽度 + +这将设置窗口的最大宽度。 如果给出的值`Width`大于这个值，窗口将被设置为`MaxWidth`默认值。 + +类型：bool + +### 最大高度 + +这将设置窗口的最大高度。 如果给出的值`Height`大于这个值，窗口将被设置为`MaxHeight`默认值。 + +类型：bool + +### 启动时隐藏窗口 + +设置为`true`时，应用程序将被隐藏，直到调用[显示窗口](../reference/runtime/window#显示窗口)。 + +类型：int +### 关闭时隐藏窗口 + +默认情况下，关闭窗口将关闭应用程序。 将此设置为`true`意味着关闭窗口将隐藏窗口。 + +窗口在失去焦点时应保持在其他窗口之上。 + +类型：int + +### RGBA + +This value is the default background colour of the window. Default: white 类型：int (0xRRGGBBAA) 示例：0xFF000088 - 透明度为 50% 的红色 + +Type: `*options.RGBA`
Default: white + +### 窗口固定在最顶层 + +窗口在失去焦点时应保持在其他窗口之上。 + +类型：int + +### 资源 + +应用程序要使用的前端资源。 需要一个`index.html`文件。 + +名称：StartHidden + +### 菜单 + + + +注意：在 Mac 上，如果未指定菜单，则将创建默认菜单。 + +| 值 | 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. 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. 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. Vite serves the index.html on every path, that does not contain a file extension. + +类型：[AppearanceType](#外观类型) + +### 日志 + +应用程序要使用的菜单。 [菜单参考](../reference/runtime/menu)中有关菜单的更多详细信息。 + +:::note +On Mac, if no menu is specified, a default menu will be created. +::: + +This value is the default background colour of the window. Default: white Default: white + +### 日志级别 + +应用程序要使用的记录器。 有关日志记录的更多详细信息，请参阅[日志参考](../reference/runtime/log)。 + +类型：bool + +### 应用启动回调 + +默认日志级别。 有关日志记录的更多详细信息，请参阅[日志参考](../reference/runtime/log)。 + +名称：Assets + +### 前端 Dom 加载完成回调 + +The default log level for production builds. 有关日志记录的更多详细信息，请参阅[日志参考](../reference/runtime/log)。 有关日志记录的更多详细信息，请参阅[日志参考](../reference/runtime/log)。 + +类型：logger.Logger + +### 应用退出回调 + +此回调在前端创建之后调用，但在`index.html`加载之前调用。 它提供了应用程序上下文。 + +类型：\*menu.Menu + +### 关闭应用程序之前回调 + +在前端加载完毕`index.html`及其资源后调用此回调。 它提供了应用程序上下文。 + +类型：\*menu.Menu + +### 窗口启动状态 + +在前端被销毁之后，应用程序终止之前，调用此回调。 它提供了应用程序上下文。 + +类型：\*menu.Menu + +### 绑定 + +如果设置了此回调，它将在通过单击窗口关闭按钮或调用`runtime.Quit`即将退出应用程序时被调用. 返回 `true` 将导致应用程序继续，`false` 将继续正常关闭。 Returning true will cause the application to continue, false will continue shutdown as normal. 这有助于与用户确认他们希望退出程序。 这有助于与用户确认他们希望退出程序。 + +名称：Mac + +```go title=windowsapp.go +func (b *App) beforeClose(ctx context.Context) (prevent bool) { + dialog, err := runtime.MessageDialog(ctx, runtime.MessageDialogOptions{ + 类型： runtime.QuestionDialog, + Title: "Quit?", + Message: "Are you sure you want to quit?", + }) + + if err != nil { + return false + } + return dialog != "Yes" +``` + +类型：func(ctx context.Context) + +### WindowStartState + +名称：Linux + +| 值 | Win | Mac | Lin | +| ---------- | --- | --- | --- | +| Fullscreen | ✅ | ✅ | ✅ | +| Maximised | ✅ | ✅ | ✅ | +| Minimised | ✅ | ❌ | ✅ | + +默认值：在开发模式下是`Info`，在生产模式下是`Error`。 + +### CSSDragProperty + +Indicates the CSS property to use to identify which elements can be used to drag the window. Default: `--wails-draggable`. + +类型：string + +### CSSDragValue + +Indicates what value the `CSSDragProperty` style should have to drag the window. Default: `drag`. + +类型：string + +### Bind + +名称：WebviewIsTransparent + +名称：OnStartup + +### Windows + +名称：WindowIsTranslucent + +名称：LogLevel + +### Mac + +名称：DisableWindowIcon + +类型：func(ctx context.Context) + +### Linux + +名称：DisableFramelessWindowDecorations + +名称：OnShutdown + +## Windows 特定选项 + +### 禁用窗口图标 + +设置为 `true` 时将使 WebView 背景透明。 这意味着如果你使用`rgba(0,0,0,0)`，主窗口将显示。 通常与[窗口半透明](#窗口半透明)结合使用以制作冰霜效果的应用程序。 + +类型：int + +### 禁用无边框窗口装饰 + +将此设置为 `true` 将使窗口半透明。 通常与[网页透明](#网页透明) 结合使用以制作冰霜效果的应用程序。 + +类型：int + +### Webview 用户数据路径 + +这定义了应用程序应该使用的主题： + +类型：int + +### 主题 + +将此设置为`true`将移除[无边框](#无边框)模式下的窗口装饰。 这意味着将不会有`Aero 阴影` 和 `圆角`显示在窗口上。 请注意，`圆角`只在 Windows 11 上支持。 + +类型：int + +### 自定义主题 + +这定义了 WebView2 存储用户数据的路径。 如果为空将使用`%APPDATA%\[BinaryName.exe]`。 + +类型：string + +### 消息 + +This defines the path to a directory with WebView2 executable files and libraries. If empty, webview2 installed in the system will be used. 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) + +类型：string + +### 标题栏 + +TitleBar 结构提供了配置标题栏外观的能力。 + +名称：Appearance + +| 值 | 描述 | +| ------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | +| SystemDefault | _默认_. 主题将基于系统默认值。 The theme will be based on the system default. The theme will be based on the system default. 如果用户更改了他们的主题，应用程序将更新以使用新设置 The theme will be based on the system default. 如果用户更改了他们的主题，应用程序将更新以使用新设置 The theme will be based on the system default. 如果用户更改了他们的主题，应用程序将更新以使用新设置 | +| Dark | 该应用程序将只使用深色主题 | +| Light | 从样式掩码中移除 [NSWindowStyleMaskTitled](https://developer.apple.com/documentation/appkit/nswindowstylemask/nswindowstylemasktitled/)。 | + +类型：[\*mac.TitleBar](#标题栏结构) + +### 外观 + +类型：\*mac.Options + +类型：bool + +Appearance 用于根据 Apple 的 [NSAppearance](https://developer.apple.com/documentation/appkit/nsappearancename?language=objc) 名称设置应用程序的样式。 + +#### 外观 + +CustomTheme 结构使用 `int32` 指定颜色值. 这些是非标准 Windows 格式： `0x00BBGGAA`。 These are in the standard(!) Windows format of: `0x00BBGGAA`. These are in the standard(!) Windows format of: `0x00BBGGAA`. 提供了一个辅助函数来将 RGB 转换为这种格式：`windows.RGB(r,g,b uint8)`。 + +名称：WindowIsTranslucent + +```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 +} +``` + +名称：Mac + +```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), + }, +``` + +### 网页透明 + +一个如果找不到有效的 webview2 运行时，webview2 安装程序所使用的字符串结构。 + +名称：About + +您可以选择支持的任意语言定制此选项。 + +### 窗口半透明 + +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. The default value (0) will perform redraws as fast as it can. + +Type: \*mac.Options + +### 关于 + +您可以指定应用程序的[外观](https://developer.apple.com/documentation/appkit/nsappearance?language=objc)。 + +类型：bool + +### OnResume + +“关于”菜单项将出现在应用程序菜单中： + +类型：bool + +## Mac 特定选项 + +### TitleBar + +The TitleBar struct provides the ability to configure the look and feel of the title bar. + +类型：bool + + +### 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. + +类型：string + +### 禁用窗口图标 + +设置为 `true` 时将使 WebView 背景透明。 这意味着如果你使用`rgba(0,0,0,0)`，主窗口将显示。 通常与[窗口半透明](#窗口半透明)结合使用以制作冰霜效果的应用程序。 + +类型：int + +### 禁用无边框窗口装饰 + +将此设置为 `true` 将使窗口半透明。 通常与[网页透明](#网页透明) 结合使用以制作冰霜效果的应用程序。 + +类型：int + +### 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. + +名称：CustomTheme + + +#### 标题栏结构 + +预设的标题栏设置可用： + +```go +type TitleBar struct { + TitlebarAppearsTransparent bool + HideTitle bool + HideTitleBar bool + FullSizeContent bool + UseToolbar bool + HideToolbarSeparator bool +} +``` + +| 设置 | 描述 | +| -------------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | +| TitlebarAppearsTransparent | 使标题栏透明。 This has the effect of hiding the titlebar and the content fill the window. 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 | 隐藏窗口的标题。 [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 | 使 webview 填满整个窗口。 [Apple Docs](https://developer.apple.com/documentation/appkit/nswindowstylemask/nswindowstylemaskfullsizecontentview) | +| UseToolbar | 向窗口添加默认工具栏。 [Apple Docs](https://developer.apple.com/documentation/appkit/nstoolbar?language=objc) | +| HideToolbarSeparator | 删除工具栏下方的线条。 [Apple Docs](https://developer.apple.com/documentation/appkit/nstoolbar/1516954-showsbaselineseparator?language=objc) | + +Preconfigured titlebar settings are available: + +| 值 | 描述 | +| --------------------------- | ---------------------------------------------- | +| `mac.TitleBarDefault()` | ![](/img/reference/titlebar-default.webp) | +| `mac.TitleBarHidden()` | ![](/img/reference/titlebar-hidden.webp) | +| `mac.TitleBarHiddenInset()` | ![](/img/reference/titlebar-hidden-inset.webp) | + +名称：Mac + +```go +Mac: &mac.Options{ + TitleBar: mac.TitleBarHiddenInset(), +} +``` + +Click [here](https://github.com/lukakerr/NSWindowStyles) for some inspiration on customising the titlebar. + +#### 外观类型 + +You can specify the application's [appearance](https://developer.apple.com/documentation/appkit/nsappearance?language=objc). + +| 值 | 描述 | +| ----------------------------------------------------- | --------------- | +| DefaultAppearance | 使用默认系统值 | +| NSAppearanceNameAqua | 标准日间系统外观 | +| NSAppearanceNameDarkAqua | 标准黑夜系统外观 | +| NSAppearanceNameVibrantLight | 轻盈灵动的外观 | +| NSAppearanceNameAccessibilityHighContrastAqua | 标准白天系统外观的高对比度版本 | +| NSAppearanceNameAccessibilityHighContrastDarkAqua | 标准黑夜系统外观的高对比度版本 | +| NSAppearanceNameAccessibilityHighContrastVibrantLight | 轻盈灵动外观的高对比度版本 | +| NSAppearanceNameAccessibilityHighContrastVibrantDark | 深色活力外观的高对比度版本 | + +名称：Mac + +```go +Mac: &mac.Options{ + Appearance: mac.NSAppearanceNameDarkAqua, +} +``` + +#### 关于结构 + +```go +type AboutInfo struct { + Title string + Message string + Icon []byte +} +``` + +如果提供了这些设置，“关于”菜单项将出现在应用程序菜单中（使用`AppMenu` role 时）。 建议这样配置： + +```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, + }, + }, + }) + Mac: &mac.Options{ + About: &mac.AboutInfo{ + Title: "My Application", + Message: "© 2021 Me", + Icon: icon, + }, + }, + }) + Mac: &mac.Options{ + About: &mac.AboutInfo{ + Title: "My Application", + Message: "© 2021 Me", + Icon: icon, + }, + }, + }) +``` + +The "About" menu item will appear in the app menu: + +
+ +
+ +
+ +When clicked, that will open an about message box: + +
+ +
+ +
+ +## Linux 特定选项 + +### Icon + +设置代表窗口的图标。 当窗口最小化（也称为图标化）时使用此图标。 + +名称：Appearance + +一些窗口管理器或桌面环境也可能将其放置在窗口框架中，或在其他上下文中显示。 在其他情况下，根本不使用该图标，因此您的预计情况可能会有所不同。 + +注意：Wayland 上的 Gnome 至少不显示此图标。 要在那里有一个应用程序图标，必须使用一个`.desktop`文件。 在 KDE 上它应该可以工作。 + +图标应该以自然绘制的任何尺寸提供；也就是说，在传递图像之前不要缩放图像。 缩放将延迟到当所需的最终尺寸已知的最后一刻，以获得最佳质量。 diff --git a/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/project-config.mdx b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/project-config.mdx new file mode 100644 index 000000000..a491fb3d5 --- /dev/null +++ b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/project-config.mdx @@ -0,0 +1,63 @@ +--- +sidebar_position: 5 +--- + +# 项目配置 + +项目配置在项目目录中的`wails.json`文件中。 配置的结构是： + +```json +{ + "name": "[项目名称]", + "assetdir": "[资源目录的相对路径]", + "reloaddirs": "[触发重新加载的附加目录（逗号分隔），这仅用于一些重要资源配置]", + "frontend:install": "[安装 node 依赖的命令，在 frontend 目录下运行 - 通常是 `npm install`]", + "frontend:build": "[构建资源的命令，在 frontend 目录下运行 - 通常是 `npm run build`]", + "frontend:dev": "[此命令已被 frontend:dev:build 替代。 If frontend:dev:build is not specified will falls back to this command. If frontend:dev:build is not specified will falls back to this command. 如果没有指定 frontend:dev:build 将回退到该命令，如果此命令也没有指定将回退到 frontend:build]", + "frontend:dev:build": "[此命令等效于开发模式中的 frontend:build，如果没有指定则回退到 frontend:dev]", + "frontend:dev:install": "[此命令等效于开发模式中的 frontend:install，如果没有指定则只有 frontend:install]", + "frontend:dev:watcher": "[此命令在 `wails dev` 上的单独进程中运行。 If not specified falls back to frontend:dev]", + "frontend:dev:install": "[This command is the dev equivalent of frontend:install. If not specified falls back to frontend:install]", + "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. 对第 3 方观察者有用]", + "frontend:dev:serverUrl": "[使用第三方开发服务器提供资源，比如 Vite", + "wailsjsdir": "[自动生成的JS模块将被创建的目录的相对路径]", + "version": "[项目配置版本]", + "outputfilename": "[二进制文件的名称]", + "debounceMS": 100, // 在检测到资源更改时，开发服务器等待重新加载的时间 + "devServer": "[将 wails 开发服务器绑定到的地址。 默认：localhost:34115]", + "appargs": "[在dev模式下以shell样式传递给应用程序的参数]", + "runNonNativeBuildHooks": false, // 定义构建钩子是否应该运行，尽管它们是为主机操作系统以外的操作系统定义的。 + "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": "[在构建指定的 GOOS/GOARCH 后将执行的命令：${platform} 替换为'GOOS/GOARCH'，${bin} 替换为编译后的二进制文件的路径。 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/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/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": "[在构建指定的 GOOS/GOARCH 后将执行的命令：${platform} 替换为'GOOS/GOARCH'，${bin} 替换为编译后的二进制文件的路径。 + ]", + "GOOS/*": "[在构建指定的 GOOS 后将执行的命令：${platform} 替换为'GOOS/GOARCH'，${bin} 替换为编译后的二进制文件的路径。 'GOOS/GOARCH'钩子在'GOOS/*'和'*/*'钩子之前执行。 ]", + "GOOS/*": "[在构建指定的 GOOS 后将执行的命令：${platform} 替换为'GOOS/GOARCH'，${bin} 替换为编译后的二进制文件的路径。 'GOOS/*'钩子在'*/*'钩子之前执行。 ]", + "*/*": "[每次构建后将执行的命令：${platform} 替换为'GOOS/GOARCH'，${bin} 替换为编译后的二进制文件的路径。 + ]" + }, + "info": { + // 用于填充 manifests 和 version 信息的数据。 + "companyName": "[公司名称。 默认: [项目名]]", + "productName": "[产品名称。 默认: [项目名]]", + "productVersion": "[产品的版本。 默认: '1.0.0']", + "copyright": "[产品的版权。 默认: 'Copyright.........']", + "comments": "[该应用程序的简短注释。 默认: 'Built using Wails (https://wails.app)']" + }, + "nsisType": "['multiple': 每个架构一个安装程序。 'single': 适用于所有正在构建的架构的单一通用安装程序。 默认: 'multiple']" +} +``` + +该文件将在运行`wails build`或`wails dev`时，由 Wails CLI 读取。 + +`wails build/dev`命令中的`assetdir`、`reloaddirs`、`wailsjsdir`、`debounceMS`、`devserver`和`frontenddevserverurl`标志将覆盖项目配置并作为后续运行的默认值。 diff --git a/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/_category_.json b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/_category_.json new file mode 100644 index 000000000..ac6d55488 --- /dev/null +++ b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/_category_.json @@ -0,0 +1,4 @@ +{ + "label": "Runtime", + "position": 1 +} diff --git a/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/browser.mdx b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/browser.mdx new file mode 100644 index 000000000..7a3679fe9 --- /dev/null +++ b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/browser.mdx @@ -0,0 +1,14 @@ +--- +sidebar_position: 7 +--- + +# 浏览器 + +这些方法与系统浏览器相关。 + +### 浏览器打开 URL + +使用系统默认浏览器打开给定的 URL。 + +Go: `BrowserOpenURL(ctx context.Context, url string)`
JS: `BrowserOpenURL(url string)` + diff --git a/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/dialog.mdx b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/dialog.mdx new file mode 100644 index 000000000..efffe260b --- /dev/null +++ b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/dialog.mdx @@ -0,0 +1,283 @@ +--- +sidebar_position: 5 +--- + +# 对话框 + +运行时的这一部分提供对原生对话框的调用，例如文件选择器和消息框。 + +:::info Javascript +JS 运行时当前不支持对话框。 +::: + +### 打开选择目录对话框 + +打开一个对话框，提示用户选择目录。 可以使用 [打开选择文件对话框参数选项](#打开选择文件对话框参数选项)进行自定义。 + +Go: `OpenDirectoryDialog(ctx context.Context, dialogOptions OpenDialogOptions) (string, error)` + +返回值: 所选目录（如果用户取消则为空白）或错误 + +### 打开选择文件对话框 + +打开一个对话框，提示用户选择文件。 可以使用 [打开选择文件对话框参数选项](#打开选择文件对话框参数选项)进行自定义。 + +Go: `OpenFileDialog(ctx context.Context, dialogOptions OpenDialogOptions) (string, error)` + +返回值: 所选文件（如果用户取消则为空白）或错误 + +### 打开选择多个文件对话框 + +打开一个对话框，提示用户选择多个文件。 可以使用 [打开选择文件对话框参数选项](#打开选择文件对话框参数选项)进行自定义。 + +Go: `OpenMultipleFilesDialog(ctx context.Context, dialogOptions OpenDialogOptions) ([]string, error)` + +返回值: 选定的文件（如果用户取消则为零）或错误 + +### 保存文件对话框 + +打开一个对话框，提示用户选择文件名以进行保存。 可以使用[保存文件对话框参数选项](#保存文件对话框参数选项)自定义。 + +Go: `SaveFileDialog(ctx context.Context, dialogOptions SaveDialogOptions) (string, error)` + +返回值: 所选文件（如果用户取消则为空白）或错误 + +### 消息对话框 + +使用消息对话框显示消息。 可以使用[消息对话框参数选项](#消息对话框参数选项)进行自定义。 + +Go: `MessageDialog(ctx context.Context, dialogOptions MessageDialogOptions) (string, error)` + +返回值: 所选按钮的文本或错误 + +## 参数选项 + +### 打开选择文件对话框参数选项 + +```go +type OpenDialogOptions struct { + DefaultDirectory string + DefaultFilename string + Title string + Filters []FileFilter + ShowHiddenFiles bool + CanCreateDirectories bool + ResolvesAliases bool + TreatPackagesAsDirectories bool +} +``` + +| 字段 | 描述 | Win | Mac | Lin | +| -------------------------- | ------------------- | --- | --- | --- | +| DefaultDirectory | 对话框打开时显示的目录 | ✅ | ✅ | ✅ | +| DefaultFilename | 默认文件名 | ✅ | ✅ | ✅ | +| Title | 对话框的标题 | ✅ | ✅ | ✅ | +| [Filters](#filefilter) | 文件过滤器列表 | ✅ | ✅ | ✅ | +| ShowHiddenFiles | 显示系统隐藏的文件 | | ✅ | ✅ | +| CanCreateDirectories | 允许用户创建目录 | | ✅ | | +| ResolvesAliases | 如果为 true，则返回文件而不是别名 | | ✅ | | +| TreatPackagesAsDirectories | 允许导航到包 | | ✅ | | + +### 保存文件对话框参数选项 + +```go +type SaveDialogOptions struct { + DefaultDirectory string + DefaultFilename string + Title string + Filters []FileFilter + ShowHiddenFiles bool + CanCreateDirectories bool + TreatPackagesAsDirectories bool +} +``` + +| 字段 | 描述 | Win | Mac | Lin | +| -------------------------- | ----------- | --- | --- | --- | +| DefaultDirectory | 对话框打开时显示的目录 | ✅ | ✅ | ✅ | +| DefaultFilename | 默认文件名 | ✅ | ✅ | ✅ | +| Title | 对话框的标题 | ✅ | ✅ | ✅ | +| [Filters](#filefilter) | 文件过滤器列表 | ✅ | ✅ | ✅ | +| ShowHiddenFiles | 显示系统隐藏的文件 | | ✅ | ✅ | +| CanCreateDirectories | 允许用户创建目录 | | ✅ | | +| TreatPackagesAsDirectories | 允许导航到包 | | ✅ | | + +### 消息对话框参数选项 + +```go +type MessageDialogOptions struct { + Type DialogType + Title string + Message string + Buttons []string + DefaultButton string + CancelButton string +} +``` + +| 字段 | 描述 | Win | Mac | Lin | +| ------------- | ----------------------------------- | --- | --- | --- | +| Type | 消息对话框的类型，例如问题、信息... | ✅ | ✅ | ✅ | +| Title | 对话框的标题 | ✅ | ✅ | ✅ | +| Message | 向用户显示的消息 | ✅ | ✅ | ✅ | +| Buttons | 按钮标题列表 | | ✅ | | +| DefaultButton | 带有此文本的按钮应被视为默认按钮。 Bound to `return` | | ✅ | | +| CancelButton | 带有此文本的按钮应被视为取消。 Bound to `escape` | | ✅ | | + +#### Windows + +Windows 具有标准对话框类型，其中的按钮不可自定义。 返回的值将是以下之一："Ok"、"Cancel"、"Abort"、"Retry"、"Ignore"、"Yes"、"No"、"Try Again"或"Continue" + +#### Linux + +Linux 有标准的对话框类型，其中的按钮是不可定制的。 返回的值将是以下之一：“Ok”、“Cancel”、“Yes”、“No” + +#### Mac + +Mac 上的消息对话框最多可以指定 4 个按钮。 如果没有`DefaultButton`或`CancelButton`给出，第一个按钮被认为是默认的并绑定到`return`键。 + +对于以下代码： + +```go +selection, err := runtime.MessageDialog(b.ctx, runtime.MessageDialogOptions{ + Title: "It's your turn!", + Message: "Select a number", + Buttons: []string{"one", "two", "three", "four"}, +}) +``` + +第一个按钮显示为默认值： + +
+ +
+ +
+ +如果我们指定`DefaultButton`为“two”： + +```go +selection, err := runtime.MessageDialog(b.ctx, runtime.MessageDialogOptions{ + Title: "It's your turn!", + Message: "Select a number", + Buttons: []string{"one", "two", "three", "four"}, + DefaultButton: "two", +}) +``` + +第二个按钮显示为默认值。 当 `return` 被按下时，则返回数值“two”。 + +
+ +
+ +
+ +如果我们现在指定`CancelButton`为“three”： + +```go +selection, err := runtime.MessageDialog(b.ctx, runtime.MessageDialogOptions{ + Title: "It's your turn!", + Message: "Select a number", + Buttons: []string{"one", "two", "three", "four"}, + DefaultButton: "two", + CancelButton: "three", +}) +``` + +带有“three”的按钮显示在对话框的底部。 当`escape`被按下时，则返回值“three”： + +
+ +
+ +
+
+
+ +#### 对话框类型 + +```go +const ( + InfoDialog DialogType = "info" + WarningDialog DialogType = "warning" + ErrorDialog DialogType = "error" + QuestionDialog DialogType = "question" + ) +``` + +### 文件过滤 + +```go +type FileFilter struct { + DisplayName string // Filter information EG: "Image Files (*.jpg, *.png)" + Pattern string // semi-colon separated list of extensions, EG: "*.jpg;*.png" +} +``` + +#### Windows + +Windows 允许您在对话框中使用多个文件过滤器。 每个 FileFilter 将在对话框中显示为一个单独的条目： + +
+ +
+ +
+
+
+ +#### Linux + +Linux 允许您在对话框中使用多个文件过滤器。 每个 FileFilter 将在对话框中显示为一个单独的条目： + +
+ +
+ +
+
+
+ +#### Mac + +Mac 对话框只有一组模式来过滤文件的概念。 如果提供了多个 FileFilters，Wails 将使用所有定义的模式。 + +示例： + +```go + selection, err := runtime.OpenFileDialog(b.ctx, runtime.OpenDialogOptions{ + Title: "Select File", + Filters: []runtime.FileFilter{ + { + DisplayName: "Images (*.png;*.jpg)", + Pattern: "*.png;*.jpg", + }, { + DisplayName: "Videos (*.mov;*.mp4)", + Pattern: "*.mov;*.mp4", + }, + }, + }) +``` + +这将导致使用`*.png,*.jpg,*.mov,*.mp4`作为过滤器打开文件对话框。 diff --git a/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/events.mdx b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/events.mdx new file mode 100644 index 000000000..8d21f7bee --- /dev/null +++ b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/events.mdx @@ -0,0 +1,38 @@ +--- +sidebar_position: 2 +--- + +# 事件 + +Wails 运行时提供了一个统一的事件系统，其中事件可以由 Go 或 Javascript 发出或接收。 可选地，数据可以与事件一起传递。 侦听器将接收本地数据类型中的数据。 + +### 添加事件侦听器 + +此方法为给定的事件名称设置一个侦听器。 当一个`eventName`类型的事件被[触发指定事件](#触发指定事件)时，回调被触发。 与触发事件一起发送的任何其他数据都将传递给回调。 + +Go: `EventsOn(ctx context.Context, eventName string, callback func(optionalData ...interface{}))`
JS: `EventsOn(eventName string, callback function(optionalData?: any))` + +### 移除事件侦听器 + +This method unregisters the listener for the given event name, optionally multiple listeneres can be unregistered via `additionalEventNames`. + +Go: `EventsOff(ctx context.Context, eventName string, additionalEventNames ...string)`
JS: `EventsOff(eventName string, ...additionalEventNames)` + +### 添加只触发一次的事件侦听器 + +此方法为给定的事件名称设置一个侦听器，但只会触发一次。 + +Go: `EventsOnce(ctx context.Context, eventName string, callback func(optionalData ...interface{}))`
JS: `EventsOnce(eventName string, callback function(optionalData?: any))` + +### 添加指定对多触发次数的事件侦听器 + +此方法为给定的事件名称设置一个侦听器，但最多只能触发`counter`次。 + +Go: `EventsOnMultiple(ctx context.Context, eventName string, callback func(optionalData ...interface{}), counter int)`
JS: `EventsOnMultiple(eventName string, callback function(optionalData?: any), counter int)` + +### 触发指定事件 + +此方法触发指定的事件。 可选数据可以与事件一起传递。 这将触发任何事件侦听器。 + +Go: `EventsEmit(ctx context.Context, eventName string, optionalData ...interface{})`
JS: `EventsEmit(ctx context, optionalData function(optionalData?: any))` + diff --git a/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/intro.mdx b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/intro.mdx new file mode 100644 index 000000000..24f60593f --- /dev/null +++ b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/intro.mdx @@ -0,0 +1,73 @@ +--- +sidebar_position: 1 +--- + +# 介绍 + +运行时是一个为应用程序提供实用方法的库。 有 Go 和 Javascript 运行时，目的是在可能的情况下尝试使它们保持一致。 + +It has utility methods for: + +- [Window](window.mdx) +- [Menu](menu.mdx) +- [Dialog](dialog.mdx) +- [Events](events.mdx) +- [Browser](browser.mdx) +- [Log](log.mdx) + +Go 运行时可通过导入`github.com/wailsapp/wails/v2/pkg/runtime`。 此包中的所有方法都将 context 作为第一个参数。 此 context 应该从 [应用启动回调](../options.mdx#onstartup) 或 [前端 Dom 加载完成回调](../options.mdx#ondomready) 钩子获得。 + +:::info 注意 + +虽然上下文将提供给[应用启动回调](../../reference/options#应用启动回调)方法，但不能保证运行时将在此方法中工作，因为窗口正在不同的线程中初始化。 如果您希望在启动时调用运行时方法，请使用[前端 Dom 加载完成回调](../../reference/options#前端-dom-加载完成回调)方法。 + +::: + +Javascript 库可通过`window.runtime`提供给前端。 使用 `开发` 模式时会生成一个运行时包，该包为运行时提供 Typescript 声明。 这应该位于您的前端目录中的`wailsjs`目录中。 + +### 隐藏 + +Go: `Hide(ctx context.Context)`
JS: `Hide()` + +隐藏应用程序。 + +:::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`. ::: 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`. ::: + +### 环境 + +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`. ::: :::info Note On Mac, this will bring the application back into the foreground. For Windows and Linux, this is currently the same as `WindowShow`. ::: For Windows and Linux, this is currently the same as `WindowShow`. ::: ::: + +Go: `Show(ctx context.Context)`
JS: `Show()` + +### Quit + +Quits the application. + +Go: `Quit(ctx context.Context)`
JS: `Quit()` + +### Environment + +Returns details of the current environment. + +Go: `Environment(ctx context.Context) EnvironmentInfo`
JS: `Environment(): Promise` + +#### 环境信息 + +Go: +```go +type EnvironmentInfo struct { + BuildType string + Platform string + Arch string +} +``` +JS: +```ts +interface EnvironmentInfo { + buildType: string; + platform: string; + arch: string; +} +``` diff --git a/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/log.mdx b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/log.mdx new file mode 100644 index 000000000..2b717aa52 --- /dev/null +++ b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/log.mdx @@ -0,0 +1,130 @@ +--- +sidebar_position: 3 +--- + +# 日志 + +Wails 运行时提供了一种可以从 Go 或 Javascript 调用的日志记录机制。 像大多数记录器一样，有许多日志级别： + +- Trace +- Debug +- Info +- Warning +- Error +- Fatal + +记录器将输出当前或更高日志级别的任何日志消息。 示例：`Debug`日志级别将输出除`Trace`消息之外的所有消息。 + +### 打印日志 + +将给定的消息记录为原始消息。 + +Go: `LogPrint(ctx context.Context, message string)`
JS: `LogPrint(message: string)` + +### 格式化打印日志 + +将给定的消息记录为原始消息。 + +Go: `LogPrintf(ctx context.Context, format string, args ...interface{})`
+ +### Trace 日志 + +在`Trace`日志级别记录给定的消息。 + +Go: `LogTrace(ctx context.Context, message string)`
JS: `LogTrace(message: string)` + +### 格式化 Trace 日志 + +在`Trace`日志级别记录给定的消息。 + +Go: `LogTracef(ctx context.Context, format string, args ...interface{})`
+ +### Debug 日志 + +在`Debug`日志级别记录给定的消息。 + +Go: `LogDebug(ctx context.Context, message string)`
JS: `LogDebug(message: string)` + +### 格式化 Debug 日志 + +在`Debug`日志级别记录给定的消息。 + +Go: `LogDebugf(ctx context.Context, format string, args ...interface{})`
+ +### Info 日志 + +在`Info`日志级别记录给定的消息。 + +Go: `LogInfo(ctx context.Context, message string)`
JS: `LogInfo(message: string)` + +### 格式化 Info 日志 + +在`Info`日志级别记录给定的消息。 + +Go: `LogInfof(ctx context.Context, format string, args ...interface{})`
+ +### Warning 日志 + +在`Warning`日志级别记录给定的消息。 + +Go: `LogWarning(ctx context.Context, message string)`
JS: `LogWarning(message: string)` + +### 格式化 Warning 日志 + +在`Warning`日志级别记录给定的消息。 + +Go: `LogWarningf(ctx context.Context, format string, args ...interface{})`
+ +### Error 日志 + +在`Error`日志级别记录给定的消息。 + +Go: `LogError(ctx context.Context, message string)`
JS: `LogError(message: string)` + +### 格式化 Error 日志 + +在`Error`日志级别记录给定的消息。 + +Go: `LogErrorf(ctx context.Context, format string, args ...interface{})`
+ +### Fatal 日志 + +在`Fatal`日志级别记录给定的消息。 + +Go: `LogFatal(ctx context.Context, message string)`
JS: `LogFatal(message: string)` + +### 格式化 Fatal 日志 + +在`Fatal`日志级别记录给定的消息。 + +Go: `LogFatalf(ctx context.Context, format string, args ...interface{})`
+ +### 设置日志级别 + +设置日志级别。 在 Javascript 中，该数字与以下日志级别有关： + +| 值 | 日志等级 | +| - | ------- | +| 1 | Trace | +| 2 | Debug | +| 3 | Info | +| 4 | Warning | +| 5 | Error | + +Go: `LogSetLogLevel(ctx context.Context, level logger.LogLevel)`
JS: `LogSetLogLevel(level: number)` + +## 使用自定义日志 + +可以通过使用应用程序参数选项 [日志](../../reference/options#日志) 提供自定义记录器来使用它。 唯一的要求是记录器实现了在`github.com/wailsapp/wails/v2/pkg/logger`里`logger.Logger`定义的接口： + +```go title="logger.go" +type Logger interface { + Print(message string) + Trace(message string) + Debug(message string) + Info(message string) + Warning(message string) + Error(message string) + Fatal(message string) +} +``` diff --git a/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/menu.mdx b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/menu.mdx new file mode 100644 index 000000000..4ce2b368e --- /dev/null +++ b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/menu.mdx @@ -0,0 +1,24 @@ +--- +sidebar_position: 6 +--- + +# 菜单 + +这些方法与应用程序菜单相关。 + +:::info Javascript + Menu is currently unsupported in the JS runtime. +::: ::: +::: ::: + +### 设置应用程序菜单 + +Sets the application menu to the given [menu](../menus.mdx). + +Go: `MenuSetApplicationMenu(ctx context.Context, menu *menu.Menu)` + +### 更新应用程序菜单 + +将应用程序菜单设置为给定的[应用菜单](../../reference/menus)。 + +Go: `MenuUpdateApplicationMenu(ctx context.Context)` diff --git a/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/window.mdx b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/window.mdx new file mode 100644 index 000000000..e26776d0c --- /dev/null +++ b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/reference/runtime/window.mdx @@ -0,0 +1,213 @@ +--- +sidebar_position: 4 +--- + +# 窗口 + +这些方法可以控制应用程序窗口。 + +### 窗口标题 + +设置窗口标题栏中的文本。 + +Go: `WindowSetTitle(ctx context.Context, title string)`
JS: `WindowSetTitle(title: string)` + +### 窗口全屏 + +使窗口全屏。 + +Go: `WindowFullscreen(ctx context.Context)`
JS: `WindowFullscreen()` + +### 窗口取消全屏 + +在全屏之前恢复先前的窗口尺寸和位置。 + +Go: `WindowUnfullscreen(ctx context.Context)`
JS: `WindowUnfullscreen()` + +### 窗口居中 + +使窗口在当前窗口所在的监视器上居中。 + +Go: `WindowCenter(ctx context.Context)`
JS: `WindowCenter()` + +### 窗口居中 + +使窗口在当前窗口所在的监视器上居中。 + +Go: `WindowReload(ctx context.Context)`
JS: `WindowReload()` + +### 窗口重新加载 + +执行“重新加载”（重新加载 index.html） + +Go: `WindowReloadApp(ctx context.Context)`
JS: `WindowReloadApp()` + +### 窗口设置系统默认主题 + +仅限 Windows。 + +Go: `WindowSetSystemDefaultTheme(ctx context.Context)`
JS: `WindowSetSystemDefaultTheme()` + +### 窗口设置深色主题 + +JS 方法签名: `WindowSetLightTheme()` + +JS 方法签名: `WindowSetLightTheme()` + +仅限 Windows。 + +### 显示窗口 + +JS 方法签名: `WindowSetLightTheme()` + +JS 方法签名: `WindowSetLightTheme()` + +仅限 Windows。 + +### 隐藏窗口 + +JS 方法签名: `WindowSetLightTheme()` + +隐藏窗口（如果当前可见）。 + +如果窗口当前处于隐藏状态，则显示该窗口。 + +### 设置窗口尺寸 + +隐藏窗口（如果当前可见）。 + +Go: `WindowHide(ctx context.Context)`
JS: `WindowHide()` + +### 获取窗口尺寸 + +设置窗口的宽度和高度。 + +Go: `WindowSetSize(ctx context.Context, width int, height int)`
JS: `WindowSetSize(size: Size)` + +### 设置窗口最大尺寸 + +Returns true if the window not minimised, maximised or fullscreen. + +Go: `WindowGetSize(ctx context.Context) (width int, height int)`
JS: `WindowGetSize() : Size` + +### 设置窗口最小尺寸 + +获取窗口的宽度和高度。 + +Go: `WindowSetMinSize(ctx context.Context, width int, height int)`
JS: `WindowSetMinSize(size: Size)` + +### 设置窗口最大尺寸 + +Gets the width and height of the window. + +Go: `WindowSetAlwaysOnTop(ctx context.Context, b bool)`
JS: `WindowSetAlwaysOnTop(b: Boolen)` + +### 设置窗口位置 + +设置最小窗口大小。 如果窗口当前小于给定尺寸，将调整窗口大小。 + +Setting a size of `0,0` will disable this constraint. + +获取相对于窗口当前所在显示器的窗口位置。 + +### 获取窗口位置 + +设置最大窗口大小。 如果窗口当前大于给定尺寸，将调整窗口大小。 + +Setting a size of `0,0` will disable this constraint. + +Go: `WindowSetPosition(ctx context.Context, x int, y int)`
JS: `WindowSetPosition(position: Position)` + +### 窗口最大化 + +获取相对于窗口当前所在显示器的窗口位置。 + +Go: `WindowGetPosition(ctx context.Context) (x int, y int)`
JS: `WindowGetPosition() : Position` + +### 窗口取消最大化 + +最大化窗口以填满屏幕。 + +Go: `WindowMaximise(ctx context.Context)`
JS: `WindowMaximise()` + +### 窗口最大化切换 + +将窗口恢复到最大化之前的尺寸和位置。 + +Go: `WindowUnmaximise(ctx context.Context)`
JS: `WindowUnmaximise()` + +### 窗口最小化 + +在最大化和最大化之间切换。 + +Go: `WindowToggleMaximise(ctx context.Context)`
JS: `WindowToggleMaximise()` + +### 窗口取消最小化 + +最小化窗口。 + +Go: `WindowMinimise(ctx context.Context)`
JS: `WindowMinimise()` + +### 尺寸 + +Returns true if the window is maximised. + +Go: `WindowUnminimise(ctx context.Context)`
JS: `WindowUnminimise()` + +### 窗口设置 RGBA + +将窗口恢复到最小化之前的尺寸和位置。 + +Go: `WindowToggleMaximise(ctx context.Context)`
JS: `WindowToggleMaximise()` + +### 位置 + +窗口 + +Go: `WindowSetBackgroundColour(ctx context.Context, R, G, B, A uint8)`
JS: `WindowSetBackgroundColour(R, G, B, A)` + +### 尺寸 + +Restores the window to the dimensions and position prior to minimising. + +Go: `WindowUnminimise(ctx context.Context)`
JS: `WindowUnminimise()` + +### WindowIsMinimised + +Returns true if the window is minimised. + +Go: `WindowIsMinimised(ctx context.Context) bool` JS: `WindowIsMinimised() bool` + +### WindowSetBackgroundColour + +将窗口的背景颜色设置为给定的 RGBA 颜色定义。 此颜色将显示所有透明像素。 + +Valid values for R, G, B and A are 0-255. + +:::info Windows +On Windows, only alpha values of 0 or 255 are supported. +任何不为 0 的值都将被视为 255。 +任何不为 0 的值都将被视为 255。 +::: + +Go: `WindowSetBackgroundColour(ctx context.Context, R, G, B, A uint8)`
JS: `WindowSetBackgroundColour(R, G, B, A)` + +## Typescript 对象定义 + +### Position + +```ts +interface Position { + x: number; + y: number; +} +``` + +### Size + +```ts +interface Size { + w: number; + h: number; +} +``` diff --git a/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/tutorials/_category_.json b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/tutorials/_category_.json new file mode 100644 index 000000000..dfac1d175 --- /dev/null +++ b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/tutorials/_category_.json @@ -0,0 +1,4 @@ +{ + "label": "Tutorials", + "position": 70 +} diff --git a/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/tutorials/dogsapi.mdx b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/tutorials/dogsapi.mdx new file mode 100644 index 000000000..f4845fdbe --- /dev/null +++ b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/tutorials/dogsapi.mdx @@ -0,0 +1,243 @@ +--- +sidebar_position: 20 +--- + +# Dogs API + +
+ +
+ +
+ +:::note This tutorial has been kindly provided by [@tatadan](https://twitter.com/tatadan) and forms part of their [Wails Examples Repository](https://github.com/tataDan/wails-v2-examples). ::: + +In this tutorial we are going to develop an application that retrieves photos of dogs from the web and then displays them. + +### Create the project + +Let's create the application. From a terminal enter: `wails init -n dogs-api -t svelte` + +Note: We could optionally add `-ide vscode` or `-ide goland` to the end of this command if you wanted to add IDE support. + +Now let's `cd dogs-api` and start editing the project files. + +### Remove unused code + +We will start by removing some elements that we know we will not use: + +- Open `app.go` and remove the following lines: + +```go +// Greet returns a greeting for the given name +func (a *App) Greet(name string) string { + return fmt.Sprintf("Hello %s, It's show time!", name) +} +``` + +- Open `frontend/src/App.svelte` and delete all lines. +- Delete the `frontend/src/assets/images/logo-universal.png` file + +### Creating our application + +Now let's add our new Go code. + +Add the following struct declarations to `app.go` before the function definitions: + +```go +type RandomImage struct { + Message string + Status string +} + +type AllBreeds struct { + Message map[string]map[string][]string + Status string +} + +type ImagesByBreed struct { + Message []string + Status string +} +``` + +Add the following functions to `app.go` (perhaps after the existing function definitions): + +```go +func (a *App) GetRandomImageUrl() string { + response, err := http.Get("https://dog.ceo/api/breeds/image/random") + if err != nil { + log.Fatal(err) + } + + responseData, err := ioutil.ReadAll(response.Body) + if err != nil { + log.Fatal(err) + } + + var data RandomImage + json.Unmarshal(responseData, &data) + + return data.Message +} + +func (a *App) GetBreedList() []string { + var breeds []string + + response, err := http.Get("https://dog.ceo/api/breeds/list/all") + if err != nil { + log.Fatal(err) + } + + responseData, err := ioutil.ReadAll(response.Body) + if err != nil { + log.Fatal(err) + } + + var data AllBreeds + json.Unmarshal(responseData, &data) + + for k := range data.Message { + breeds = append(breeds, k) + } + + sort.Strings(breeds) + + return breeds +} + +func (a *App) GetImageUrlsByBreed(breed string) []string { + + url := fmt.Sprintf("%s%s%s%s", "https://dog.ceo/api/", "breed/", breed, "/images") + response, err := http.Get(url) + if err != nil { + log.Fatal(err) + } + + responseData, err := ioutil.ReadAll(response.Body) + if err != nil { + log.Fatal(err) + } + + var data ImagesByBreed + json.Unmarshal(responseData, &data) + + return data.Message +} +``` + +Modify the `import` section of `app.go` to look like this: + +```go +import ( + "context" + "fmt" + "encoding/json" + "io/ioutil" + "log" + "net/http" + "sort" +) +``` + +Add the following lines to `frontend/src/App.svelte`: + +```html + + +

Dogs API

+
+ + Click on down arrow to select a breed + + +
+
+{#if showRandomPhoto} + No dog found +{/if} +{#if showBreedPhotos} + {#each photos as photo} + No dog found + {/each} +{/if} + + +``` + +### Testing the application + +To generate the bindings and test the application, run `wails dev`. + +### Compiling the application + +To compile the application to a single, production grade binary, run `wails build`. + + + + + diff --git a/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/tutorials/helloworld.mdx b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/tutorials/helloworld.mdx new file mode 100644 index 000000000..034c44fd6 --- /dev/null +++ b/website/i18n/zh-Hans/docusaurus-plugin-content-docs/version-v2.0.0-rc.1/tutorials/helloworld.mdx @@ -0,0 +1,117 @@ +--- +sidebar_position: 10 +--- + +# 你好世界 + +本教程的目的是让你使用最基本的 软件来运行和使用Wails。 你将可以: + +- 创建一个新的Wails应用 +- 构建应用 +- 运行应用 + +:::note +本教程使用 Windows 作为目标平台。 根据您的操作系统，输出会略有不同。 +::: + +## 创建一个新Wails应用 + +使用默认的vanilla JS模板创建新的Wails程序, 您需要运行这个指令: + +```bash +wails init -n helloworld +``` + +您应该会看到如下输出： + +``` +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. +``` + +这将在当前目录中创建一个名为 `helloworld` 的新目录。 在这个目录中，您会找到一些文件： + +``` +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 +``` + +## 构建应用 + +要构建应用程序，请切换到新的 `helloword` 项目目录并运行以下命令： + +```bash +wails build +``` + +您应该会看到如下输出： + +``` +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. +``` + +这有一个已经编译了的应用程序保存在 `build/bin` 目录中。 + +## 运行应用 + +如果我们在 Windows 文件管理器中查看 `build/bin` 目录，我们应该看到我们的项目二进制文件： + +
+ +
+ +
+ +我们可以通过简单的双击 `helloworld.exe` 文件来运行它。 + +在 Mac 上，Wails 生成一个 `helloworld.app` 文件，可以通过双击来运行。 + +在 Linux 上，您可以从 `build/bin` 目录使用 `/helloword` 运行应用程序。 + +您应该看到应用程序正常工作： + +
+ +
+
diff --git a/website/versioned_docs/version-v2.0.0-beta.44/appendix/_category_.json b/website/versioned_docs/version-v2.0.0-beta.44/appendix/_category_.json new file mode 100644 index 000000000..83af4ca28 --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-beta.44/appendix/_category_.json @@ -0,0 +1,4 @@ +{ + "label": "Appendix", + "position": 70 +} diff --git a/website/versioned_docs/version-v2.0.0-beta.44/community/_category_.json b/website/versioned_docs/version-v2.0.0-beta.44/community/_category_.json new file mode 100644 index 000000000..524986e1e --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-beta.44/community/_category_.json @@ -0,0 +1,4 @@ +{ + "label": "Community", + "position": 50 +} diff --git a/website/versioned_docs/version-v2.0.0-beta.44/community/links.mdx b/website/versioned_docs/version-v2.0.0-beta.44/community/links.mdx new file mode 100644 index 000000000..d081cb9b3 --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-beta.44/community/links.mdx @@ -0,0 +1,24 @@ +--- +sidebar_position: 2 +--- + +# Links + +This page serves as a list for community related links. Please submit a PR (click `Edit this page` at the bottom) +to submit links. + +## Awesome Wails + +The [definitive list](https://github.com/wailsapp/awesome-wails) of links related to Wails. + +## Support Channels + +- [Gophers Slack Channel](https://gophers.slack.com/messages/CJ4P9F7MZ/) +- [Gophers Slack Channel Invite](https://invite.slack.golangbridge.org/) +- [Github Issues](https://github.com/wailsapp/wails/issues) +- [v2 Beta Discussion Board](https://github.com/wailsapp/wails/discussions/828) + +## Social Media + +- [Twitter](https://twitter.com/wailsapp) +- [Wails Chinese Community QQ Group](https://qm.qq.com/cgi-bin/qm/qr?k=PmIURne5hFGNd7QWzW5qd6FV-INEjNJv&jump_from=webapi) - Group number: 1067173054 diff --git a/website/versioned_docs/version-v2.0.0-beta.44/community/showcase/_category_.json b/website/versioned_docs/version-v2.0.0-beta.44/community/showcase/_category_.json new file mode 100644 index 000000000..276e283b7 --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-beta.44/community/showcase/_category_.json @@ -0,0 +1,4 @@ +{ + "label": "Showcase", + "position": 1 +} diff --git a/website/versioned_docs/version-v2.0.0-beta.44/community/showcase/emailit.mdx b/website/versioned_docs/version-v2.0.0-beta.44/community/showcase/emailit.mdx new file mode 100644 index 000000000..629b67be8 --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-beta.44/community/showcase/emailit.mdx @@ -0,0 +1,8 @@ +# EmailIt + +

+
+

+ +[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 builtin [Node-Red](https://nodered.org/) server, scripts terminal, and the [ScriptBar](https://github.com/raguay/ScriptBarApp) program for displaying results from Node-Red or a script on your system. Documentation is very scarce, but the programs works. It’s built using Wails2 and Svelte, and the download is a universal macOS application. + diff --git a/website/versioned_docs/version-v2.0.0-beta.44/community/showcase/encrypteasy.mdx b/website/versioned_docs/version-v2.0.0-beta.44/community/showcase/encrypteasy.mdx new file mode 100644 index 000000000..5df462ac5 --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-beta.44/community/showcase/encrypteasy.mdx @@ -0,0 +1,10 @@ + +# EncryptEasy + +

+
+

+ +**[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. diff --git a/website/versioned_docs/version-v2.0.0-beta.44/community/showcase/filehound.mdx b/website/versioned_docs/version-v2.0.0-beta.44/community/showcase/filehound.mdx new file mode 100644 index 000000000..c4e5d96d0 --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-beta.44/community/showcase/filehound.mdx @@ -0,0 +1,23 @@ + +# FileHound Export Utility + +

+
+

+ + +[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 diff --git a/website/versioned_docs/version-v2.0.0-beta.44/community/showcase/modalfilemanager.mdx b/website/versioned_docs/version-v2.0.0-beta.44/community/showcase/modalfilemanager.mdx new file mode 100644 index 000000000..6245d8171 --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-beta.44/community/showcase/modalfilemanager.mdx @@ -0,0 +1,10 @@ +# Modal File Manager + +

+
+

+ +[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. 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. + diff --git a/website/versioned_docs/version-v2.0.0-beta.44/community/showcase/mollywallet.mdx b/website/versioned_docs/version-v2.0.0-beta.44/community/showcase/mollywallet.mdx new file mode 100644 index 000000000..2354e566e --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-beta.44/community/showcase/mollywallet.mdx @@ -0,0 +1,9 @@ + +# Molley Wallet + +

+
+

+ +[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. + diff --git a/website/versioned_docs/version-v2.0.0-beta.44/community/showcase/october.mdx b/website/versioned_docs/version-v2.0.0-beta.44/community/showcase/october.mdx new file mode 100644 index 000000000..f9db3cede --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-beta.44/community/showcase/october.mdx @@ -0,0 +1,11 @@ +# October + +

+
+

+ +[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. \ No newline at end of file diff --git a/website/versioned_docs/version-v2.0.0-beta.44/community/showcase/optimus.mdx b/website/versioned_docs/version-v2.0.0-beta.44/community/showcase/optimus.mdx new file mode 100644 index 000000000..f35de9442 --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-beta.44/community/showcase/optimus.mdx @@ -0,0 +1,9 @@ + +# Optimus + +

+
+

+ +[Optimus](https://github.com/splode/optimus) is a desktop image optimization application. It supports conversion and compression between WebP, JPEG, and PNG image formats. + diff --git a/website/versioned_docs/version-v2.0.0-beta.44/community/showcase/portfall.mdx b/website/versioned_docs/version-v2.0.0-beta.44/community/showcase/portfall.mdx new file mode 100644 index 000000000..63524e35c --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-beta.44/community/showcase/portfall.mdx @@ -0,0 +1,9 @@ + +# Portfall + +

+
+

+ +[Portfall](https://github.com/rekon-oss/portfall) - A desktop k8s port-forwarding portal for easy access to all your cluster UIs + diff --git a/website/versioned_docs/version-v2.0.0-beta.44/community/showcase/restic-browser.mdx b/website/versioned_docs/version-v2.0.0-beta.44/community/showcase/restic-browser.mdx new file mode 100644 index 000000000..034370609 --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-beta.44/community/showcase/restic-browser.mdx @@ -0,0 +1,11 @@ + +# Restic Browser + +

+
+

+ +[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. + + + diff --git a/website/versioned_docs/version-v2.0.0-beta.44/community/showcase/riftshare.mdx b/website/versioned_docs/version-v2.0.0-beta.44/community/showcase/riftshare.mdx new file mode 100644 index 000000000..892d3d7fb --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-beta.44/community/showcase/riftshare.mdx @@ -0,0 +1,19 @@ + +# RiftShare + +

+
+

+ +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! diff --git a/website/versioned_docs/version-v2.0.0-beta.44/community/showcase/scriptbar.mdx b/website/versioned_docs/version-v2.0.0-beta.44/community/showcase/scriptbar.mdx new file mode 100644 index 000000000..02538a030 --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-beta.44/community/showcase/scriptbar.mdx @@ -0,0 +1,7 @@ +# ScriptBar + +

+
+

+ +[ScriptBar](https://GitHub.com/raguay/ScriptBarApp) is a program to show the output of the embedded [Node-Red](https://nodered.org) server in the [EmailIt](https://GitHub.com/raguay/EmailIt) application. 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. diff --git a/website/versioned_docs/version-v2.0.0-beta.44/community/showcase/surge.mdx b/website/versioned_docs/version-v2.0.0-beta.44/community/showcase/surge.mdx new file mode 100644 index 000000000..02fba67c0 --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-beta.44/community/showcase/surge.mdx @@ -0,0 +1,9 @@ + +# Surge + +

+
+

+ +[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. + diff --git a/website/versioned_docs/version-v2.0.0-beta.44/community/showcase/wally.mdx b/website/versioned_docs/version-v2.0.0-beta.44/community/showcase/wally.mdx new file mode 100644 index 000000000..b4bb707c7 --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-beta.44/community/showcase/wally.mdx @@ -0,0 +1,9 @@ + +# Wally + +

+
+

+ +[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. + diff --git a/website/versioned_docs/version-v2.0.0-beta.44/community/showcase/wombat.mdx b/website/versioned_docs/version-v2.0.0-beta.44/community/showcase/wombat.mdx new file mode 100644 index 000000000..d580c7eca --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-beta.44/community/showcase/wombat.mdx @@ -0,0 +1,10 @@ + +# Wombat + +

+
+

+ + +[Wombat](https://github.com/rogchap/wombat) is a cross platform gRPC client. + diff --git a/website/versioned_docs/version-v2.0.0-beta.44/community/showcase/ytd.mdx b/website/versioned_docs/version-v2.0.0-beta.44/community/showcase/ytd.mdx new file mode 100644 index 000000000..5b7568436 --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-beta.44/community/showcase/ytd.mdx @@ -0,0 +1,10 @@ + +# Ytd + +

+
+

+ + +[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. + diff --git a/website/versioned_docs/version-v2.0.0-beta.44/community/templates.mdx b/website/versioned_docs/version-v2.0.0-beta.44/community/templates.mdx new file mode 100644 index 000000000..3f2fe6dba --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-beta.44/community/templates.mdx @@ -0,0 +1,49 @@ +--- +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) - A template using Vite,Vue and Vue-Router(Support both JavaScript and TypeScript) +- [wails-vite-vue-ts](https://github.com/codydbentley/wails-vite-vue-ts) - Vue 3 TypeScript with Vite (and instructions to add features) +- [wails-vite-vue-the-works](https://github.com/codydbentley/wails-vite-vue-the-works) - Vue 3 TypeScript with Vite, Vuex, Vue Router, Sass, and ESLint + Prettier + +## Angular + +- [wails-angular-template](https://github.com/TAINCER/wails-angular-template) - Angular with TypeScript, Sass, Hot-Reload, Code-Splitting and i18n + +## React + +- [wails-react-template](https://github.com/AlienRecall/wails-react-template) - A template using reactjs +- [wails-react-template](https://github.com/flin7/wails-react-template) - A minimal template for React that supports live development +- [wails-template-nextjs](https://github.com/LGiki/wails-template-nextjs) - A template using Next.js and TypeScript + +## Svelte + +- [wails-svelte-template](https://github.com/raitonoberu/wails-svelte-template) - A template using Svelte +- [wails-vite-svelte-template](https://github.com/BillBuilt/wails-vite-svelte-template) - A template using Svelte and Vite +- [wails-vite-svelte-tailwind-template](https://github.com/BillBuilt/wails-vite-svelte-tailwind-template) - A template using Svelte and Vite with TailwindCSS v3 +- [wails-sveltekit-template](https://github.com/h8gi/wails-sveltekit-template) - A template using SvelteKit + +## 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: diff --git a/website/versioned_docs/version-v2.0.0-beta.44/contributing/_category_.json b/website/versioned_docs/version-v2.0.0-beta.44/contributing/_category_.json new file mode 100644 index 000000000..fad21931a --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-beta.44/contributing/_category_.json @@ -0,0 +1,4 @@ +{ + "label": "Contributing", + "position": 99 +} diff --git a/website/versioned_docs/version-v2.0.0-beta.44/contributing/developing-new-features.mdx b/website/versioned_docs/version-v2.0.0-beta.44/contributing/developing-new-features.mdx new file mode 100644 index 000000000..1aa5ea145 --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-beta.44/contributing/developing-new-features.mdx @@ -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/_` +- 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. +::: + diff --git a/website/versioned_docs/version-v2.0.0-beta.44/contributing/documenting.mdx b/website/versioned_docs/version-v2.0.0-beta.44/contributing/documenting.mdx new file mode 100644 index 000000000..1655a44fe --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-beta.44/contributing/documenting.mdx @@ -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. + diff --git a/website/versioned_docs/version-v2.0.0-beta.44/contributing/fixing-bugs.mdx b/website/versioned_docs/version-v2.0.0-beta.44/contributing/fixing-bugs.mdx new file mode 100644 index 000000000..7e1c78ad3 --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-beta.44/contributing/fixing-bugs.mdx @@ -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/_` +- 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. +::: \ No newline at end of file diff --git a/website/versioned_docs/version-v2.0.0-beta.44/contributing/helping-others.mdx b/website/versioned_docs/version-v2.0.0-beta.44/contributing/helping-others.mdx new file mode 100644 index 000000000..340f51a2a --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-beta.44/contributing/helping-others.mdx @@ -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 +::: diff --git a/website/versioned_docs/version-v2.0.0-beta.44/contributing/setting-up-a-dev-environment.mdx b/website/versioned_docs/version-v2.0.0-beta.44/contributing/setting-up-a-dev-environment.mdx new file mode 100644 index 000000000..b5cfd8eca --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-beta.44/contributing/setting-up-a-dev-environment.mdx @@ -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 => ` + +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` + diff --git a/website/versioned_docs/version-v2.0.0-beta.44/contributing/testing.mdx b/website/versioned_docs/version-v2.0.0-beta.44/contributing/testing.mdx new file mode 100644 index 000000000..d01204651 --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-beta.44/contributing/testing.mdx @@ -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. diff --git a/website/versioned_docs/version-v2.0.0-beta.44/contributing/ways-of-contributing.mdx b/website/versioned_docs/version-v2.0.0-beta.44/contributing/ways-of-contributing.mdx new file mode 100644 index 000000000..cfe50b654 --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-beta.44/contributing/ways-of-contributing.mdx @@ -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. \ No newline at end of file diff --git a/website/versioned_docs/version-v2.0.0-beta.44/gettingstarted/_category_.json b/website/versioned_docs/version-v2.0.0-beta.44/gettingstarted/_category_.json new file mode 100644 index 000000000..597b920df --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-beta.44/gettingstarted/_category_.json @@ -0,0 +1,4 @@ +{ + "label": "Getting Started", + "position": 10 +} diff --git a/website/versioned_docs/version-v2.0.0-beta.44/gettingstarted/building.mdx b/website/versioned_docs/version-v2.0.0-beta.44/gettingstarted/building.mdx new file mode 100644 index 000000000..73734912e --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-beta.44/gettingstarted/building.mdx @@ -0,0 +1,19 @@ +--- +sidebar_position: 6 +--- + +# Compiling your Project + +From the project directory, run `wails build`. +This will compile your project and save the production-ready binary in the `build/bin` directory. + +If you run the binary, you should see the default application: + +
+ +
+
+ + +For more details on compilation options, please refer to the [CLI Reference](../reference/cli.mdx#build). + diff --git a/website/versioned_docs/version-v2.0.0-beta.44/gettingstarted/development.mdx b/website/versioned_docs/version-v2.0.0-beta.44/gettingstarted/development.mdx new file mode 100644 index 000000000..323e90ba9 --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-beta.44/gettingstarted/development.mdx @@ -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 \ No newline at end of file diff --git a/website/versioned_docs/version-v2.0.0-beta.44/gettingstarted/firstproject.mdx b/website/versioned_docs/version-v2.0.0-beta.44/gettingstarted/firstproject.mdx new file mode 100644 index 000000000..f68643a2f --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-beta.44/gettingstarted/firstproject.mdx @@ -0,0 +1,125 @@ +--- +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: + + +import Tabs from "@theme/Tabs"; +import TabItem from "@theme/TabItem"; + + + + Generate a Svelte project using Javascript with:

+ + wails init -n myproject -t svelte +If you would rather use Typescript:
+ + wails init -n myproject -t svelte-ts + + + Generate a React project using Javascript with:

+ + wails init -n myproject -t react +If you would rather use Typescript:
+ + wails init -n myproject -t react-ts + + + Generate a Vue project using Javascript with:

+ + wails init -n myproject -t vue + +If you would rather use Typescript:
+ + wails init -n myproject -t vue-ts + + + Generate a Preact project using Javascript with:

+ + wails init -n myproject -t preact + +If you would rather use Typescript:
+ + wails init -n myproject -t preact-ts + + + Generate a Lit project using Javascript with:

+ + wails init -n myproject -t lit + +If you would rather use Typescript:
+ + wails init -n myproject -t lit-ts + + + Generate a Vanilla project using Javascript with:

+ + wails init -n myproject -t vanilla + +If you would rather use Typescript:
+ + wails init -n myproject -t vanilla-ts + + + + + +
+ +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. + +The default module name in `go.mod` is "changeme". You should change this to something more appropriate. diff --git a/website/versioned_docs/version-v2.0.0-beta.44/gettingstarted/installation.mdx b/website/versioned_docs/version-v2.0.0-beta.44/gettingstarted/installation.mdx new file mode 100644 index 000000000..c4c7a19bd --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-beta.44/gettingstarted/installation.mdx @@ -0,0 +1,95 @@ +--- +sidebar_position: 1 +--- + +# Installation + +## Supported Platforms + +- Windows 10/11 AMD64/ARM64 +- MacOS 10.13+ AMD64 +- MacOS 11.0+ ARM64 +- Linux AMD64/ARM64 + +## Dependencies + +Wails has a number of common dependencies that are required before installation: + +- Go 1.17+ +- NPM (Node 15+) + +### Go + +Download Go from the [Go Downloads Page](https://go.dev/doc/install). + +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: + + + +import Tabs from "@theme/Tabs"; +import TabItem from "@theme/TabItem"; + + + + Wails requires that the xcode command line tools are installed. This can be done by running:
+ xcode-select --install + + + Wails requires that the WebView2{" "} + runtime is installed. Some Windows installations will already have this installed. You can check using + the{" "} + wails doctor command (see below). + + + 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. + + + + + +## Optional Dependencies + +- [UPX](https://upx.github.io/) for compressing your applications. + +## Installing Wails + +Run `go install github.com/wailsapp/wails/v2/cmd/wails@latest` to install the Wails CLI. + +## System Check + +Running `wails doctor` will check if you have the correct dependencies installed. If not, it will advise on what is missing and help on how to rectify any problems. + +## 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. \ No newline at end of file diff --git a/website/versioned_docs/version-v2.0.0-beta.44/guides/_category_.json b/website/versioned_docs/version-v2.0.0-beta.44/guides/_category_.json new file mode 100644 index 000000000..5935dad93 --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-beta.44/guides/_category_.json @@ -0,0 +1,4 @@ +{ + "label": "Guides", + "position": 50 +} diff --git a/website/versioned_docs/version-v2.0.0-beta.44/guides/application-development.mdx b/website/versioned_docs/version-v2.0.0-beta.44/guides/application-development.mdx new file mode 100644 index 000000000..13b1b7382 --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-beta.44/guides/application-development.mdx @@ -0,0 +1,231 @@ + +# 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) + } +} +``` + + + +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 specifiy `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/). +For [create-react-app](https://create-react-app.dev/), it's possible to use +[this script](https://gist.github.com/int128/e0cdec598c5b3db728ff35758abdbafd) to achieve a similar result. + +## Go Module + +The default Wails templates generate a `go.mod` file that contains the module name "changeme". You should change this +to something more appropriate after project generation. diff --git a/website/versioned_docs/version-v2.0.0-beta.44/guides/bleeding-edge.mdx b/website/versioned_docs/version-v2.0.0-beta.44/guides/bleeding-edge.mdx new file mode 100644 index 000000000..292b9d523 --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-beta.44/guides/bleeding-edge.mdx @@ -0,0 +1,54 @@ + +# Bleeding Edge + +## Overview + +Wails is in constant development and new releases are regularly "tagged". This usually happens when all the newer code +on `master` has been tested and confirmed working. If you need a bugfix or feature that has not yet made it to a release, +it's possible to use the latest "bleeding edge" version using the following steps: + +- `git clone https://github.com/wailsapp/wails` +- `cd wails/v2/cmd/wails` +- `go install` + +NOTE: The directory that you cloned the project into will now be called "clonedir". + +The Wails CLI will now be at the very latest version. To update projects to use the latest version, update the project's +`go.mod` and ensure the following line is at the bottom of the file: + +`replace github.com/wailsapp/wails/v2 => ` + +Example: + +On Windows: +`replace github.com/wailsapp/wails/v2 => C:\Users\leaan\Documents\wails-v2-beta\wails\v2` + +On 'nix: +`replace github.com/wailsapp/wails/v2 => /home/me/projects/wails/v2` + +To revert back to a stable version, run: + +`go install github.com/wailsapp/wails/v2/cmd/wails@latest` + +## Testing a Branch + +If you want to test a branch, follow the instructions above, but ensure you switch the branch you want to test before installing: + +- `git clone https://github.com/wailsapp/wails` +- `cd wails` +- `git checkout -b branch-to-test --track origin/branch-to-test` +- `cd v2/cmd/wails` +- `go install` + +## 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` diff --git a/website/versioned_docs/version-v2.0.0-beta.44/guides/dynamic-assets.mdx b/website/versioned_docs/version-v2.0.0-beta.44/guides/dynamic-assets.mdx new file mode 100644 index 000000000..a8438a397 --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-beta.44/guides/dynamic-assets.mdx @@ -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: 255}, + 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: + +

+ +

+ +However, if we request `go.mod`, we will see the following output: + +

+ +

+ +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 + +``` +with: +```html + +``` +Then we would see the following: + +

+ +

+ +:::warning +Exposing your filesystem in this way is a security risk. It is recommended that you properly manage access +to your filesystem. +::: + diff --git a/website/versioned_docs/version-v2.0.0-beta.44/guides/frameless.mdx b/website/versioned_docs/version-v2.0.0-beta.44/guides/frameless.mdx new file mode 100644 index 000000000..7c22b66d3 --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-beta.44/guides/frameless.mdx @@ -0,0 +1,47 @@ + +# Frameless Applications + +Wails supports applications with no frame. This can be achieved by using the [frameless](../reference/options.mdx#frameless) +field in [Application Options](../reference/options.mdx#application-options). + + +:::warning +The `data-wails-drag` attribute is being deprecated in favour of the following CSS style: +`style="--wails-draggable:drag"`. You can use `style="--wails-draggable:no-drag"` to disable the drag behaviour. +For this release only, you can test this by setting the following application option: +```go + Experimental: &options.Experimental{ + UseCSSDrag: true, + }, +``` +::: + +Wails offers a simple solution for dragging the window: Any HTML element that has the attribute "data-wails-drag" will +act as a "drag handle". This property applies to all nested elements. If you need to indicate that a nested element +should not drag, then use the attribute 'data-wails-no-drag' on that element. + +The default vanilla template uses this, even though it is not frameless. The whole `body` element is tagged as draggable. +The `
` is tagged as being not draggable. + +```html + + + + + + + +
+ + +
+
+ + + + +``` + +:::info Fullscreen + If you allow your application to go fullscreen, this drag functionality will be disabled. +::: diff --git a/website/versioned_docs/version-v2.0.0-beta.44/guides/frontend.mdx b/website/versioned_docs/version-v2.0.0-beta.44/guides/frontend.mdx new file mode 100644 index 000000000..6c9d0cf27 --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-beta.44/guides/frontend.mdx @@ -0,0 +1,77 @@ + +# Frontend + +## Script Injection + +When Wails serves your `index.html`, by default, it will inject 2 script entries into the `` 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 + + + injection example + + + + + + + +
Please enter your name below 👇
+
+ + +
+ + + + + +``` + +### Overriding Default Script Injection + +To provide more flexibility to developers, there is a meta tag that may be used to customise this behaviour: + +```html + +``` + +The options are as follows: + +| Value | Description | +| -------------------- | ------------------------------------------------- | +| noautoinjectruntime | Disable the autoinjection of `/wails/runtime.js` | +| noautoinjectipc | Disable the autoinjection of `/wails/ipc.js` | +| noautoinject | Disable all autoinjection of scripts | + +Multiple options may be used provided they are comma seperated. + +This code is perfectly valid and operates the same as the autoinjection version: + +```html + + + + injection example + + + + + + +
Please enter your name below 👇
+
+ + +
+ + + + + + + +``` \ No newline at end of file diff --git a/website/versioned_docs/version-v2.0.0-beta.44/guides/ides.mdx b/website/versioned_docs/version-v2.0.0-beta.44/guides/ides.mdx new file mode 100644 index 000000000..46f0268ff --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-beta.44/guides/ides.mdx @@ -0,0 +1,114 @@ +# IDEs + +Wails aims to provide a great development experience. To that aim, we now support generating IDE specific configuration +to provide smoother project setup. + +Currently, we support [Visual Studio Code](https://code.visualstudio.com/) but aim to support other IDEs such as Goland. + +## Visual Studio Code + +

+ +

+ +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. + +::: \ No newline at end of file diff --git a/website/versioned_docs/version-v2.0.0-beta.44/guides/linux-distro-support.mdx b/website/versioned_docs/version-v2.0.0-beta.44/guides/linux-distro-support.mdx new file mode 100644 index 000000000..db9dde55a --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-beta.44/guides/linux-distro-support.mdx @@ -0,0 +1,108 @@ + +# 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 `.go`, where `` 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! +::: \ No newline at end of file diff --git a/website/versioned_docs/version-v2.0.0-beta.44/guides/linux.mdx b/website/versioned_docs/version-v2.0.0-beta.44/guides/linux.mdx new file mode 100644 index 000000000..c23c0f348 --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-beta.44/guides/linux.mdx @@ -0,0 +1,20 @@ + +# 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) \ No newline at end of file diff --git a/website/versioned_docs/version-v2.0.0-beta.44/guides/manual-builds.mdx b/website/versioned_docs/version-v2.0.0-beta.44/guides/manual-builds.mdx new file mode 100644 index 000000000..e3be40d0b --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-beta.44/guides/manual-builds.mdx @@ -0,0 +1,99 @@ + +# Manual Builds + +The Wails CLI does a lot of heavy lifting for the project, but sometimes it's desirable to manually build your project. +This document will discuss the different operations the CLI does and how this may be achieved in different ways. + +## Build Process + +When either `wails build` or `wails dev` are used, the Wails CLI performs a common build process: + + - Install frontend dependencies + - Build frontend project + - Generate build assets + - Compile application + - [optional] Compress application + +### Install frontend dependencies + +#### CLI Steps + +- If the `-s` flag is given, this step is skipped +- Checks `wails.json` to see if there is an install command in the key `frontend:install` +- If there isn't, it skips this step +- If there is, it checks if `package.json` exists in the frontend directory. If it doesn't exist, it skips this step +- An MD5 sum is generated from the `package.json` file contents +- It checks for the existence of `package.json.md5` and if it exists, will compare the contents of it (an MD5 sum) + with the one generated to see if the contents have changed. If they are the same, this step is skipped +- If `package.json.md5` does not exist, it creates it using the generated MD5 sum +- If a build is now required, or `node_modules` does not exist, or the `-f` flag is given, the install command is + executed in the frontend directory + +#### Manual Steps + +This step could be done from the command line or a script with `npm install`. + +### Build frontend project + +#### Wails CLI + +- If the `-s` flag is given, this step is skipped +- Checks `wails.json` to see if there is a build command in the key `frontend:build` +- If there isn't, it skips this step +- If there is, it is executed in the frontend directory + +#### Manual Steps + +This step could be done from the command line or a script with `npm run build` or whatever the frontend build script is. + +### Generate assets + +#### Wails CLI + +- If `-nopackage` flag is set, this stage is skipped +- If the `build/appicon.png` file does not exist, a default one is created +- For Windows, see [Bundling for Windows](#windows) +- If `build/windows/icon.ico` does not exist, it will create it from the `build/appicon.png` image. + +##### Windows + +- If `build/windows/icon.ico` does not exist, it will create it from `build/appicon.png` using icon sizes of 256, 128, 64, 48, 32 and 16. This is done using [winicon](https://github.com/leaanthony/winicon). +- If the `build/windows/.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. diff --git a/website/versioned_docs/version-v2.0.0-beta.44/guides/migrating.mdx b/website/versioned_docs/version-v2.0.0-beta.44/guides/migrating.mdx new file mode 100644 index 000000000..1474131f8 --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-beta.44/guides/migrating.mdx @@ -0,0 +1,206 @@ + +# Migrating from v1 + +## Overview + +Wails v2 is a significant change from v1. This document aims to highlight the changes and the steps in migrating an existing project. + +### Creating the Application + +In v1, the main application is created using `wails.CreateApp`, bindings are added with `app.Bind`, then the +application is run using `app.Run()`. + +Example: + +```go title="v1" + app := wails.CreateApp(&wails.AppConfig{ + Title: "MyApp", + Width: 1024, + Height: 768, + JS: js, + CSS: css, + Colour: "#131313", + }) + app.Bind(basic) + app.Run() +``` + +In v2, there is just a single method, `wails.Run()`, that accepts [application options](../reference/options.mdx#application-options). + +```go title="v2" + err := wails.Run(&options.App{ + Title: "MyApp", + Width: 800, + Height: 600, + Assets: assets, + Bind: []interface{}{ + basic, + }, + }) +``` + +### Binding + +In v1, it was possible to bind both arbitrary functions and structs. In v2, this has been simplified to only binding structs. +The struct instances that were previously passed to the `Bind()` method in v1, are now specified in the `Bind` field of +the [application options](../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 +the 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 frontend/dist +var assets embed.FS + +func main() { + err := wails.Run(&options.App{ + /* Other Options */ + Assets: assets, + }) +} +``` + +Of course, bundlers can be used if you wish to. The only requirement is to pass +the final application assets directory to Wails using an `embed.FS` in the `Assets` +key of the [application options](../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: + +

+ +| 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/versioned_docs/version-v2.0.0-beta.44/guides/mouse-buttons.mdx b/website/versioned_docs/version-v2.0.0-beta.44/guides/mouse-buttons.mdx new file mode 100644 index 000000000..0a3a45740 --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-beta.44/guides/mouse-buttons.mdx @@ -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 diff --git a/website/versioned_docs/version-v2.0.0-beta.44/guides/overscroll.mdx b/website/versioned_docs/version-v2.0.0-beta.44/guides/overscroll.mdx new file mode 100644 index 000000000..bbe593bc7 --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-beta.44/guides/overscroll.mdx @@ -0,0 +1,11 @@ + +# Overscroll + +[Overscroll](https://developer.mozilla.org/en-US/docs/Web/CSS/overscroll-behavior) is the "bounce effect" you sometimes +get when you scroll beyond a page's content boundaries. This is common in mobile apps. This can be disabled using CSS: + +```css +body { + overscroll-behavior: none; +} +``` \ No newline at end of file diff --git a/website/versioned_docs/version-v2.0.0-beta.44/guides/routing.mdx b/website/versioned_docs/version-v2.0.0-beta.44/guides/routing.mdx new file mode 100644 index 000000000..bdcd49b24 --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-beta.44/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( + + {/* The rest of your app goes here */} + + } exact /> + } /> + } /> + {/* more... */} + + , + root); +``` diff --git a/website/versioned_docs/version-v2.0.0-beta.44/guides/signing.mdx b/website/versioned_docs/version-v2.0.0-beta.44/guides/signing.mdx new file mode 100644 index 000000000..3da981dfa --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-beta.44/guides/signing.mdx @@ -0,0 +1,386 @@ +# 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@v2 + - 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 /t /f certificate\certificate.pfx /p '${{ secrets.WIN_SIGNING_CERT_PASSWORD }}' + +``` +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@v2 + - 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@v2 + - 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/mitchellh/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 mitchellh/gon/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": "@env:APPLE_PASSWORD" + }, + "sign" :{ + "application_identity" : "Developer ID Application: My Name" + } + } + ``` + 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 + ``` +2. entitlements.plist: + ```plist + + + + + com.apple.security.app-sandbox + + com.apple.security.network.client + + com.apple.security.network.server + + com.apple.security.files.user-selected.read-write + + com.apple.security.files.downloads.read-write + + + + ``` + 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 + + + CFBundlePackageTypeAPPL + CFBundleNameMyApp + CFBundleExecutableapp + CFBundleIdentifierapp.myapp + CFBundleVersion0.1.0 + CFBundleGetInfoStringMy app is cool and nice and chill and + CFBundleShortVersionString0.1.0 + CFBundleIconFileiconfile + LSMinimumSystemVersion10.13.0 + NSHighResolutionCapabletrue + LSApplicationCategoryTypepublic.app-category.utilities + NSHumanReadableCopyright© Me + +``` + +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@v2 + - 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 mitchellh/gon/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). \ No newline at end of file diff --git a/website/versioned_docs/version-v2.0.0-beta.44/guides/templates.mdx b/website/versioned_docs/version-v2.0.0-beta.44/guides/templates.mdx new file mode 100644 index 000000000..090cf8a9e --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-beta.44/guides/templates.mdx @@ -0,0 +1,95 @@ + +# Templates + +Wails generates projects from pre-created templates. In v1, this was a difficult to maintain set of projects that were +subject to going out of date. In v2, to empower the community, a couple of new features have been added for templates: + +- Ability to generate projects from [Remote Templates](../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: + +
+ +
+ +## 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 diff --git a/website/versioned_docs/version-v2.0.0-beta.44/guides/troubleshooting.mdx b/website/versioned_docs/version-v2.0.0-beta.44/guides/troubleshooting.mdx new file mode 100644 index 000000000..6541600b8 --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-beta.44/guides/troubleshooting.mdx @@ -0,0 +1,111 @@ +# 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 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 +NSAppTransportSecurity + + NSAllowsLocalNetworking + + +``` + +Reference: https://github.com/wailsapp/wails/issues/1504#issuecomment-1174317433 + +## Mac application not valid + +If your built application looks like this in finder: + +

+ +

+ +it's likely that your application's `info.plist` is invalid. Update the file in `build/.app/Contents/info.plist` +and check if the data is valid, EG check the binary name is correct. To persist the changes, copy the file back to +the `build/darwin` directory. + +## Cannot call backend method from frontend with variadic arguments + +If you have a backend method defined with variadic parameters, eg: +```go +func (a *App) TestFunc(msg string, args ...interface{}) error { + // Code +} +``` +calling this method from the frontend like this will fail: +```js +var msg = "Hello: " +var args = ["Go", "JS"] +window.go.main.App.TestFunc(msg, ...args).then((result) => { + //do things here +}).catch((error) => { + //handle error +}); +``` +Workaround: +```js +var msg = "Hello " +var args = ["Go", "JS"] +window.go.main.App.TestFunc(msg, args).then((result) => { //without the 3 dots + //do things here +}).catch((error) => { + //handle error +}); +``` +Credit: https://github.com/wailsapp/wails/issues/1186 + +## I'm having getting proxy errors when trying to install Wails + +If you are getting errors like this: +``` +"https://proxy.golang.org/github.com/wailsapp/wails/cmd/wails/@v/list": dial tcp 172.217.163.49:443: connectex: A connection attempt failed because the connected party did not properly respond after a period of time, or established connection failed because connected host has failed to respond. +``` +it's probably because the official Go Proxy is being blocked (Users in China have reported this). +The solution is to set up the proxy manually, eg: +``` +go env -w GO111MODULE=on +go env -w GOPROXY=https://goproxy.cn,direct +``` +Source: https://github.com/wailsapp/wails/issues/1233 + +## 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 `` section of any new page you navigate to: + +```html + + + + +``` + +Source: https://github.com/wailsapp/wails/discussions/1512 \ No newline at end of file diff --git a/website/versioned_docs/version-v2.0.0-beta.44/guides/windows-installer.mdx b/website/versioned_docs/version-v2.0.0-beta.44/guides/windows-installer.mdx new file mode 100644 index 000000000..decfe0b42 --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-beta.44/guides/windows-installer.mdx @@ -0,0 +1,51 @@ +# NSIS installer + +

+
+

+ +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. + +If you use the chocolatey package manager, run the following script: +``` +choco install nsis +``` +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. diff --git a/website/versioned_docs/version-v2.0.0-beta.44/guides/windows.mdx b/website/versioned_docs/version-v2.0.0-beta.44/guides/windows.mdx new file mode 100644 index 000000000..73162d8a4 --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-beta.44/guides/windows.mdx @@ -0,0 +1,71 @@ + +# 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. + +## 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). \ No newline at end of file diff --git a/website/versioned_docs/version-v2.0.0-beta.44/howdoesitwork.mdx b/website/versioned_docs/version-v2.0.0-beta.44/howdoesitwork.mdx new file mode 100644 index 000000000..9a2bed0c2 --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-beta.44/howdoesitwork.mdx @@ -0,0 +1,403 @@ +--- +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. + +
+ +
+ +## The Main Application + +### Overview + +The main application consists of a single call to `wails.Run()`. It accepts the +application configuration which describes the size of the application window, the window title, +what assets to use, etc. A basic application might look like this: + +```go title="main.go" +package main + +import ( + "embed" + "log" + + "github.com/wailsapp/wails/v2" + "github.com/wailsapp/wails/v2/pkg/options" +) + +//go:embed frontend/dist +var assets embed.FS + +func main() { + + app := &App{} + + err := wails.Run(&options.App{ + Title: "Basic Demo", + Width: 1024, + Height: 768, + Assets: &assets, + OnStartup: app.startup, + OnShutdown: app.shutdown, + Bind: []interface{}{ + app, + }, + }) + if err != nil { + log.Fatal(err) + } +} + + +type App struct { + ctx context.Context +} + +func (b *App) startup(ctx context.Context) { + b.ctx = ctx +} + +func (b *App) shutdown(ctx context.Context) {} + +func (b *App) Greet(name string) string { + return fmt.Sprintf("Hello %s!", name) +} +``` + +### Options rundown + +This example has the following options set: + +- `Title` - The text that should appear in the window's title bar +- `Width` & `Height` - The dimensions of the window +- `Assets` - The application's frontend assets +- `OnStartup` - A callback for when the window is created and is about to start loading the frontend assets +- `OnShutdown` - A callback for when the application is about to quit +- `Bind` - A slice of struct instances that we wish to expose to the frontend + +A full list of application options can be found in the [Options Reference](reference/options). + +#### Assets + +The `Assets` option is mandatory as you can't have a Wails application without frontend assets. Those assets can be +any files you would expect to find in a web application - html, js, css, svg, png, etc. **There is no requirement to +generate asset bundles** - plain files will do. When the application starts, it will attempt to load `index.html` +from your assets and the frontend will essentially work as a browser from that point on. It is worth noting that +there is no requirement on where in the `embed.FS` the files live. It is likely that the embed path uses a nested +directory relative to your main application code, such as `frontend/dist`: + +```go title="main.go" +//go:embed frontend/dist +var assets embed.FS +``` + +At startup, Wails will iterate the embedded files looking for the directory containing `index.html`. All other assets will be loaded relative +to this directory. + +As production binaries use the files contained in `embed.FS`, there are no external files required to be shipped with +the application. + +When running in development mode using the `wails dev` command, the assets are loaded off disk, and any changes result +in a "live reload". The location of the assets will be inferred from the `embed.FS`. + +More details can be found in the [Application Development Guide](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 {16,24} title="main.go" +package main + +import ( + "embed" + "log" + + "github.com/wailsapp/wails/v2" + "github.com/wailsapp/wails/v2/pkg/options" +) + +//go:embed frontend/dist +var assets embed.FS + +func main() { + + app := &App{} + + err := wails.Run(&options.App{ + Title: "Basic Demo", + Width: 1024, + Height: 768, + Assets: &assets, + 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 {8-10} + //... + err := wails.Run(&options.App{ + Title: "Basic Demo", + Width: 1024, + Height: 768, + Assets: &assets, + Bind: []interface{}{ + app, + &mystruct1{}, + &mystruct2{}, + }, + }) + +``` + +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 + +[^1]: + There is a very small subset of libraries that use features unsupported in WebViews. There are often alternatives and + workarounds for such cases. + +### Calling bound Go methods + +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; +``` + +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. Note: If you wish to use structs, you **must** define +`json` struct tags for your fields! + +:::info Note +Anonymous nested structs are not supported at this time. +::: + +It is 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; +``` + +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) { + 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). diff --git a/website/versioned_docs/version-v2.0.0-beta.44/introduction.mdx b/website/versioned_docs/version-v2.0.0-beta.44/introduction.mdx new file mode 100644 index 000000000..a62caa78c --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-beta.44/introduction.mdx @@ -0,0 +1,78 @@ +--- +sidebar_position: 1 +--- + +# Introduction + +## Overview + +Wails is a project that enables you to write desktop apps using Go and web technologies. + +Consider it a lightweight and fast Electron alternative for Go. You can easily build applications with the flexibility +and power of Go, combined with a rich, modern frontend. + +Wails doesn't hold back with the eye candy either! This is [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. + +

+ + + +

+ +## 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 is resource efficient. Instead, it uses the native rendering engine for the +platform. On Windows, this is the new Microsoft Webview2 library, built on Chromium. + +## Go & Javascript Interoperability + +Wails automatically makes your Go methods available to Javascript, so you can call them by name from your frontend! +It even generates Typescript versions of the structs used by your Go methods, so you can pass the same data structures +between Go and Javascript. + +## Runtime Library + +Wails provides a runtime library, for both Go and Javascript, that handles a lot of the things modern applications need, +like Eventing, Logging, Dialogs, etc. + +## Live Development Experience + +### Automatic Rebuilds + +When you run your application in "dev" mode, Wails will build your application as a native desktop application, but will +read your assets from disk. It will detect any changes to your Go code and automatically rebuild and relaunch your +application. + +### Automatic Reloads + +When changes to your application assets are detected, your running application will "reload", reflecting your changes +almost immediately. + +### Develop your application in a Browser + +If you prefer to debug and develop in a browser then Wails has you covered. The running application also has a webserver +that will run your application in any browser that connects to it. It will even refresh when your assets change on disk. + +## Production-ready Native Binaries + +When you're ready to do the final build of your application, the CLI will compile it down to a single executable, with +all the assets bundled into it. On Windows and MacOS, it is possible to create a native package for distribution. The +assets used in packaging (icon, info.plist, manifest file, etc) are part of your project and may be customised, giving +you total control over how your applications are built. + +## Tooling + +The Wails CLI provides a hassle-free way to generate, build and bundle your applications. It will do the heavy lifting +of creating icons, compiling your application with optimal settings and delivering a distributable, production ready +binary. Choose from a number of starter templates to get up and running quickly! diff --git a/website/versioned_docs/version-v2.0.0-beta.44/reference/_category_.json b/website/versioned_docs/version-v2.0.0-beta.44/reference/_category_.json new file mode 100644 index 000000000..ebb337b83 --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-beta.44/reference/_category_.json @@ -0,0 +1,4 @@ +{ + "label": "Reference", + "position": 40 +} diff --git a/website/versioned_docs/version-v2.0.0-beta.44/reference/cli.mdx b/website/versioned_docs/version-v2.0.0-beta.44/reference/cli.mdx new file mode 100644 index 000000000..ee584c439 --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-beta.44/reference/cli.mdx @@ -0,0 +1,227 @@ +--- +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 ` + +## init + +`wails init` is used for generating projects. + +| Flag | Description | Default | +| :------------------- | :------------------------------------- | :-------------------------: | +| -n "project name" | Name of the project. **Mandatory**. | | +| -d "project dir" | Project directory to create | Name of the project | +| -g | Initialise git repository | | +| -l | List available project templates | | +| -q | Suppress output to console | | +| -t "template name" | The project template to use. This can be the name of a default template or a URL to a remote template hosted on github. | vanilla | +| -ide | Generate IDE project files | | +| -f | Force build application | false | + +Example: + `wails init -n test -d mytestproject -g -ide vscode -q` + +This will generate a a project called "test" in the "mytestproject" directory, initialise git, +generate vscode project files and do so silently. + +More information on using IDEs with Wails can be found [here](../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 | +| :------------------- | :-------------------------------------- | :------------------------- | +| -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`.
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 | 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" | | +| -upxflags | Flags to pass to upx | | +| -v int | Verbosity level (0 - silent, 1 - default, 2 - verbose) | 1 | +| -webview2 | WebView2 installer strategy: download,embed,browser,error | download | +| -u | Updates your project's `go.mod` to use the same version of Wails as the CLI | | +| -debug | Retains debug information in the application. 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. + +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 UPX on Apple Silicon + + There are [issues](https://github.com/upx/upx/issues/446) with using UPX with Apple Silicon. + +::: + +:::info UPX on Windows + + Some Antivirus vendors false positively mark `upx` compressed binaries as virus, see [issue](https://github.com/upx/upx/issues/437). + +::: + +### Platforms + +Supported platforms are: + +| Platform | Description | +|:---------------- |:--------------------------------------------- | +| darwin | MacOS + architecture of build machine | +| darwin/amd64 | MacOS 10.13+ AMD64 | +| darwin/arm64 | MacOS 11.0+ ARM64 | +| darwin/universal | MacOS AMD64+ARM64 universal application | +| windows | Windows 10/11 + architecture of build machine | +| windows/amd64 | Windows 10/11 AMD64 | +| windows/arm64 | Windows 10/11 ARM64 | +| linux | Linux + architecture of build machine | +| linux/amd64 | Linux AMD64 | +| linux/arm64 | Linux ARM64 | + + +## doctor + +`wails doctor` will run diagnostics to ensure that your system is ready for development. + +Example: +``` +Wails CLI v2.0.0-beta + +Scanning system - Please wait (this may take a long time)...Done. + +System +------ +OS: Windows 10 Pro +Version: 2009 (Build: 19043) +ID: 21H1 +Go Version: go1.17 +Platform: windows +Architecture: amd64 + +Dependency Package Name Status Version +---------- ------------ ------ ------- +WebView2 N/A Installed 93.0.961.52 +npm N/A Installed 6.14.15 +*upx N/A Installed upx 3.96 + +* - Optional Dependency + +Diagnosis +--------- +Your system is ready for Wails development! + +``` + +## dev + +`wails dev` is used to run your application in a "live development" mode. This means: + + - The application's `go.mod` will be updated to use the same version of Wails as the CLI + - The application is compiled and run automatically + - A watcher is started and will trigger a rebuild of your dev app if it detects changes to your go files + - A webserver is started on `http://localhost:34115` which serves your application (not just frontend) over http. This allows you to use your favourite browser development extensions + - All application assets are loaded from disk. If they are changed, the application will automatically reload (not rebuild). All connected browsers will also reload + - A JS module is generated that provides the following: + - Javascript wrappers of your Go methods with autogenerated JSDoc, providing code hinting + - TypeScript versions of your Go structs, that can be constructed and passed to your go methods + - A second JS module is generated that provides a wrapper + TS declaration for the runtime + +| Flag | Description | Default | +| :------------------- | :-------------------------------------- | :------------------------- | +| -assetdir "./path/to/assets" | Serve assets from the given directory instead of using the provided asset FS | Value in `wails.json` | +| -browser | Opens a browser to `http://localhost:34115` on startup | | +| -compiler "compiler"| Use a different go compiler to build, eg go1.15beta1 | go | +| -e | Extensions to trigger rebuilds (comma separated) | go | +| -reloaddirs | Additional directories to trigger reloads (comma separated) | Value in `wails.json` | +| -ldflags "flags" | Additional ldflags to pass to the compiler | | +| -tags "extra tags" | Build tags to pass to compiler (quoted and space separated) | | +| -loglevel "loglevel"| Loglevel to use - Trace, Debug, Info, Warning, Error | Debug | +| -noreload | Disable automatic reload when assets change | | +| -nogen | Disable generate module | | +| -v | Verbosity level (0 - silent, 1 - standard, 2 - verbose) | 1 | +| -wailsjsdir | The directory to generate the generated Wails JS modules | Value in `wails.json` | +| -debounce | The time to wait for reload after an asset change is detected | 100 (milliseconds) | +| -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 | | +| -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: + +`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. + +## 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. diff --git a/website/versioned_docs/version-v2.0.0-beta.44/reference/menus.mdx b/website/versioned_docs/version-v2.0.0-beta.44/reference/menus.mdx new file mode 100644 index 000000000..ac083ef51 --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-beta.44/reference/menus.mdx @@ -0,0 +1,271 @@ +--- +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 + AppMenu := menu.NewMenu() + FileMenu := AppMenu.AddSubmenu("File") + FileMenu.AddText("&Open", keys.CmdOrCtrl("o"), openFile) + FileMenu.AddSeparator() + FileMenu.AddText("Quit", keys.CmdOrCtrl("q"), func(_ *menu.CallbackData) { + runtime.Quit() + }) + + if runtime.GOOS == "darwin" { + AppMenu.Append(menu.EditMenu()) // on macos platform, we should append EditMenu to enable Cmd+C,Cmd+V,Cmd+Z... shortcut + } + + err := wails.Run(&options.App{ + Title: "Menus Demo", + Width: 800, + Height: 600, + Menu: AppMenu, + 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` +- `tab` +- `return` +- `enter` +- `escape` +- `left` +- `right` +- `up` +- `down` +- `space` +- `delete` +- `home` +- `end` +- `page up` +- `page down` +- `f1` +- `f2` +- `f3` +- `f4` +- `f5` +- `f6` +- `f7` +- `f8` +- `f9` +- `f10` +- `f11` +- `f12` +- `f13` +- `f14` +- `f15` +- `f16` +- `f17` +- `f18` +- `f19` +- `f20` +- `f21` +- `f22` +- `f23` +- `f24` +- `f25` +- `f26` +- `f27` +- `f28` +- `f29` +- `f30` +- `f31` +- `f32` +- `f33` +- `f34` +- `f35` +- `numlock` + +Wails also supports parsing accelerators using the same syntax as Electron. This is useful for storing accelerators in +config files. + +Example: + +```go title="Package: github.com/wailsapp/wails/v2/pkg/menu/keys" + // Defines cmd+o on Mac and ctrl-o on Window/Linux + myShortcut, err := keys.Parse("Ctrl+Option+A") +``` + +#### Modifier + +The following modifiers are keys that may be used in combination with the accelerator key: + +```go title="Package: github.com/wailsapp/wails/v2/pkg/menu/keys" +const ( + // CmdOrCtrlKey represents Command on Mac and Control on other platforms + CmdOrCtrlKey Modifier = "cmdorctrl" + // OptionOrAltKey represents Option on Mac and Alt on other platforms + OptionOrAltKey Modifier = "optionoralt" + // ShiftKey represents the shift key on all systems + ShiftKey Modifier = "shift" + // ControlKey represents the control key on all systems + ControlKey Modifier = "ctrl" +) +``` +A number of helper methods are available to create Accelerators using modifiers: + +```go title="Package: github.com/wailsapp/wails/v2/pkg/menu/keys" +func CmdOrCtrl(key string) *Accelerator +func OptionOrAlt(key string) *Accelerator +func Shift(key string) *Accelerator +func Control(key string) *Accelerator +``` + +Modifiers can be combined using `keys.Combo(key string, modifier1 Modifier, modifier2 Modifier, rest ...Modifier)`: + +```go title="Package: github.com/wailsapp/wails/v2/pkg/menu/keys" + // Defines "Ctrl+Option+A" on Mac and "Ctrl+Alt+A" on Window/Linux + myShortcut := keys.Combo("a", ControlKey, OptionOrAltKey) +``` + +### Type + +Each menu item must have a type and there are 5 types available: + +```go title="Package: github.com/wailsapp/wails/v2/pkg/menu" +const ( + TextType Type = "Text" + SeparatorType Type = "Separator" + SubmenuType Type = "Submenu" + CheckboxType Type = "Checkbox" + RadioType Type = "Radio" +) +``` + +For convenience, helper methods are provided to quickly create a menu item: + +```go title="Package: github.com/wailsapp/wails/v2/pkg/menu" +func Text(label string, accelerator *keys.Accelerator, click Callback) *MenuItem +func Separator() *MenuItem +func Radio(label string, selected bool, accelerator *keys.Accelerator, click Callback) *MenuItem +func Checkbox(label string, checked bool, accelerator *keys.Accelerator, click Callback) *MenuItem +func SubMenu(label string, menu *Menu) *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()` | + diff --git a/website/versioned_docs/version-v2.0.0-beta.44/reference/options.mdx b/website/versioned_docs/version-v2.0.0-beta.44/reference/options.mdx new file mode 100644 index 000000000..b0772c67c --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-beta.44/reference/options.mdx @@ -0,0 +1,732 @@ +--- +sidebar_position: 3 +--- + +# Options + +## Application Options + +The `Options.App` struct contains the application configuration. +It is passed to the `wails.Run()` method: + +```go title="Example" +import "github.com/wailsapp/wails/v2/pkg/options" + +func main() { + + err := wails.Run(&options.App{ + Title: "Menus Demo", + Width: 800, + Height: 600, + DisableResize: false, + Fullscreen: false, + Frameless: true, + MinWidth: 400, + MinHeight: 400, + MaxWidth: 1280, + MaxHeight: 1024, + StartHidden: false, + HideWindowOnClose: false, + BackgroundColour: &options.RGBA{R: 0, G: 0, B: 0, A: 255}, + AlwaysOnTop: false, + Assets: assets, + AssetsHandler: assetsHandler, + Menu: app.applicationMenu(), + Logger: nil, + LogLevel: logger.DEBUG, + LogLevelProduction: logger.ERROR, + OnStartup: app.startup, + OnDomReady: app.domready, + OnShutdown: app.shutdown, + OnBeforeClose: app.beforeClose, + WindowStartState: options.Maximised, + Bind: []interface{}{ + app, + }, + Windows: &windows.Options{ + WebviewIsTransparent: false, + WindowIsTranslucent: false, + DisableWindowIcon: false, + DisableFramelessWindowDecorations: false, + WebviewUserDataPath: "", + 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), + }, + // User messages that can be customised + Messages *windows.Messages + }, + Mac: &mac.Options{ + TitleBar: &mac.TitleBar{ + TitlebarAppearsTransparent: true, + HideTitle: false, + HideTitleBar: false, + FullSizeContent: false, + UseToolbar: false, + HideToolbarSeparator: true, + }, + Appearance: mac.NSAppearanceNameDarkAqua, + WebviewIsTransparent: true, + WindowIsTranslucent: false, + About: &mac.AboutInfo{ + Title: "My Application", + Message: "© 2021 Me", + Icon: icon, + }, + }, + Linux: &linux.Options{ + Icon: icon, + }, + }) + if err != nil { + log.Fatal(err) + } +} + +``` + + + +### Title + +Name: Title + +Type: string + +The text shown in the window's title bar. + +### Width + +Name: Width + +Type: int + +The initial width of the window. +Default: 1024. + +### Height + +Name: Height + +Type: int + +The initial height of the window. +Default: 768 + +### DisableResize + +Name: DisableResize + +Type: bool + +By default, the main window is resizable. Setting this to `true` will keep it a fixed size. + +### Fullscreen + +Name: Fullscreen + +Type: bool + +Setting this to `true` will make the window fullscreen at startup. + +### Frameless + +Name: Frameless + +Type: bool + +When set to `true`, the window will have no borders or title bar. +Also see [Frameless Windows](../guides/frameless.mdx). + +### MinWidth + +Name: MinWidth + +Type: int + +This sets the minimum width for the window. If the value given in `Width` is less than this value, +the window will be set to `MinWidth` by default. + +### MinHeight + +Name: MinHeight + +Type: int + +This sets the minimum height for the window. If the value given in `Height` is less than this value, +the window will be set to `MinHeight` by default. + +### MaxWidth + +Name: MaxWidth + +Type: int + +This sets the maximum width for the window. If the value given in `Width` is more than this value, +the window will be set to `MaxWidth` by default. + +### MaxHeight + +Name: MaxHeight + +Type: int + +This sets the maximum height for the window. If the value given in `Height` is more than this value, +the window will be set to `MaxHeight` by default. + +### StartHidden + +Name: StartHidden + +Type: bool + +When set to `true`, the application will be hidden until [WindowShow](../reference/runtime/window.mdx#windowshow) +is called. + +### HideWindowOnClose + +Name: HideWindowOnClose + +Type: bool + +By default, closing the window will close the application. Setting this to `true` means closing the window will +hide the window instead. + +### BackgroundColour + +Name: BackgroundColour + +Type: *options.RGBA +Example: options.NewRGBA(255,0,0,128) - Red at 50% transparency + +This value is the default background colour of the window. +Default: white + +### AlwaysOnTop + +Name: AlwaysOnTop + +Type: bool + +Indicates that the window should stay above other windows when losing focus. + +### Assets + +Name: Assets + +Type: embed.FS + +The frontend assets to be used by the application. Requires an `index.html` file. + +### AssetsHandler + + + +Name: AssetsHandler + +Type: http.Handler + + +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. + +| Value | 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. + +### Menu + +Name: Menu + +Type: \*menu.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. + +### Logger + +Name: Logger + +Type: logger.Logger + +Default: Logger to Stdout + +The logger to be used by the application. More details about logging in the [Log Reference](../reference/runtime/log.mdx). + +### LogLevel + +Name: LogLevel + +Type: logger.LogLevel + +Default: `Info` in dev mode, `Error` in production mode + +The default log level. More details about logging in the [Log Reference](../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 + +Type: func(ctx context.Context) + +This callback is called after the frontend has been created, but before `index.html` has been loaded. It is given +the application context. + +### OnDomReady + +Name: OnDomReady + +Type: func(ctx context.Context) + +This callback is called after the frontend has loaded `index.html` and its resources. It is given +the application context. + +### OnShutdown + +Name: OnShutdown + +Type: func(ctx context.Context) + +This callback is called after the frontend has been destroyed, just before the application terminates. It is given +the application context. + +### OnBeforeClose + +Name: OnBeforeClose + +Type: func(ctx context.Context) bool + +If this callback is set, it will be called when the application is about to quit, either by clicking the window close +button or calling `runtime.Quit`. Returning true will cause the application to continue, false will continue shutdown +as normal. This is good for confirming with the user that they wish to exit the program. + +Example: +```go title=windowsapp.go +func (b *App) beforeClose(ctx context.Context) (prevent bool) { + dialog, err := runtime.MessageDialog(ctx, runtime.MessageDialogOptions{ + Type: runtime.QuestionDialog, + Title: "Quit?", + Message: "Are you sure you want to quit?", + }) + + if err != nil { + return false + } + return dialog != "Yes" +} +``` + +### WindowStartState + +Name: WindowStartState + +Type: options.WindowStartState + +Defines how the window should present itself at startup. + +| Value | Win | Mac | Lin | +| --------------- | --- | --- | --- | +| Fullscreen | ✅ | ✅ | ✅ | +| Maximised | ✅ | ✅ | ✅ | +| Minimised | ✅ | ❌ | ✅ | + +### Bind + +Name: Bind + +Type: []interface{} + +A slice of struct instances defining methods that need to be bound to the frontend. + +### Windows + +Name: Windows + +Type: \*windows.Options + +This defines [Windows specific options](#windows-specific-options). + +### Mac + +Name: Mac + +Type: \*mac.Options + +This defines [Mac specific options](#mac-specific-options). + +### Linux + +Name: Linux + +Type: \*linux.Options + +This defines [Linux specific options](#linux-specific-options). + +## Windows Specific Options + +### WebviewIsTransparent + +Name: WebviewIsTransparent + +Type: bool + +Setting this to `true` will make the webview background transparent when an alpha value of `0` is used. +This means that if you use `rgba(0,0,0,0)` for `background-color` in your CSS, the host window will show through. +Often combined with [WindowIsTranslucent](#WindowIsTranslucent) to make frosty-looking applications. + +### WindowIsTranslucent + +Name: WindowIsTranslucent + +Type: bool + +Setting this to `true` will make the window background translucent. Often combined +with [WebviewIsTransparent](#WebviewIsTransparent) to make frosty-looking applications. + +### DisableWindowIcon + +Name: DisableWindowIcon + +Type: bool + +Setting this to `true` will remove the icon in the top left corner of the title bar. + +### DisableFramelessWindowDecorations + +Name: DisableFramelessWindowDecorations + +Type: bool + +Setting this to `true` will remove the window decorations in [Frameless](#Frameless) mode. This means there will be no +'Aero Shadow' and no 'Rounded Corners' shown for the window. Please note that 'Rounded Corners' are only supported on +Windows 11. + +### WebviewUserDataPath + +Name: WebviewUserDataPath + +Type: string + +This defines the path where the WebView2 stores the user data. If empty `%APPDATA%\[BinaryName.exe]` will be used. + +### WebviewBrowserPath + +Name: WebviewBrowserPath + +Type: string + +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) + +### Theme + +Name: Theme + +Type: `windows.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 | + + +### CustomTheme + +Name: CustomTheme + +Type: `windows.CustomTheme` + +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. + +#### CustomTheme + +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 + +Name: Messages + +Type: `*windows.Messages` + +A struct of strings used by the webview2 installer if a valid webview2 runtime is not found. +Customise this for any language you choose to support. + +### ResizeDebounceMS + +Name: ResizeDebounceMS + +Type: uint16 + +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. + +### OnSuspend + +Name: OnSuspend + +Type: func() + +If set, this function will be called when windows initiates a switch to low power mode (suspend/hibernate) + +### OnResume + +Name: OnResume + +Type: func() + +If set, this function will be called when windows resumes from low power mode (suspend/hibernate) + + + +## Mac Specific Options + +### TitleBar + +Name: TitleBar + +Type: [*mac.TitleBar](#titlebar-struct) + +The TitleBar struct provides the ability to configure the look and feel of the title bar. + +### Appearance + +Name: Appearance + +Type: [AppearanceType](#appearance-type) + +Appearance is used to set the style of your app in accordance with Apple's [NSAppearance](https://developer.apple.com/documentation/appkit/nsappearancename?language=objc) names. + +### WebviewIsTransparent + +Name: WebviewIsTransparent + +Type: bool + +Setting this to `true` will make the webview background transparent when an alpha value of `0` is used. +This means that if you use `rgba(0,0,0,0)` for `background-color` in your CSS, the host window will show through. +Often combined with [WindowIsTranslucent](#WindowIsTranslucent) to make frosty-looking applications. + +### WindowIsTranslucent + +Name: WindowIsTranslucent + +Type: bool + +Setting this to `true` will make the window background translucent. Often combined +with [WebviewIsTransparent](#WebviewIsTransparent) to make frosty-looking applications. + +### About + +Name: About + +Type: [About](#about-struct) + +This configuration lets you set the title, message and icon for the "About" menu item in the app menu created by the "AppMenu" role. + +#### Titlebar struct + +The titlebar of the application can be customised by using the TitleBar options: + +```go +type TitleBar struct { + TitlebarAppearsTransparent bool + HideTitle bool + HideTitleBar bool + FullSizeContent bool + UseToolbar bool + HideToolbarSeparator bool +} +``` + +| Name | Description | +| ---- | ----------- | +| TitlebarAppearsTransparent | Makes the titlebar transparent. 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 type + +You can specify the application's [appearance](https://developer.apple.com/documentation/appkit/nsappearance?language=objc). + +| Value | Description | +| --------------- | ------------------ | +| DefaultAppearance | DefaultAppearance uses the default system value | +| NSAppearanceNameAqua | The standard light system appearance | +| NSAppearanceNameDarkAqua | The standard dark system appearance | +| NSAppearanceNameVibrantLight | The light vibrant appearance | +| NSAppearanceNameAccessibilityHighContrastAqua | A high-contrast version of the standard light system appearance | +| NSAppearanceNameAccessibilityHighContrastDarkAqua | A high-contrast version of the standard dark system appearance | +| NSAppearanceNameAccessibilityHighContrastVibrantLight | A high-contrast version of the light vibrant appearance | +| NSAppearanceNameAccessibilityHighContrastVibrantDark | A high-contrast version of the dark vibrant appearance | + +Example: +```go +Mac: &mac.Options{ + Appearance: mac.NSAppearanceNameDarkAqua, +} +``` + +#### About struct + +```go +type AboutInfo struct { + Title string + Message string + Icon []byte +} +``` +If these settings are provided, an "About" menu item will appear in the app menu (when using the `AppMenu` role). +Given this configuration: +```go +//go:embed build/appicon.png +var icon []byte + +func main() { + err := wails.Run(&options.App{ + ... + Mac: &mac.Options{ + About: &mac.AboutInfo{ + Title: "My Application", + Message: "© 2021 Me", + Icon: icon, + }, + }, + }) +``` +The "About" menu item will appear in the app menu: + +
+ +
+
+ +When clicked, that will open an about message box: + +
+ +
+
+ +## Linux Specific Options + +### Icon + +Name: Icon + +Type: []byte + +Sets up the icon representing the window. This icon is used when the window is minimized (also known as iconified). +Some window managers or desktop environments may also place it in the window frame, or display it in other contexts. +On others, the icon is not used at all, so your mileage may vary. + +NOTE: Gnome on Wayland at least does not display this icon. To have a application icon there, a `.desktop` file has to be used. +On KDE it should work. + +The icon should be provided in whatever size it was naturally drawn; that is, don’t scale the image before passing it. +Scaling is postponed until the last minute, when the desired final size is known, to allow best quality. diff --git a/website/versioned_docs/version-v2.0.0-beta.44/reference/project-config.mdx b/website/versioned_docs/version-v2.0.0-beta.44/reference/project-config.mdx new file mode 100644 index 000000000..936e3fd5f --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-beta.44/reference/project-config.mdx @@ -0,0 +1,52 @@ +--- +sidebar_position: 5 +--- + +# Project Config + +The project config resides in the `wails.json` file in the project directory. The structure of the config is: + +```json +{ + "name": "[The project name]", + "assetdir": "[Relative path to the directory containing the compiled assets, this is normally inferred and could be left empty]", + "reloaddirs": "[Additional directories to trigger reloads (comma separated), this is only used for some advanced asset configurations]", + "frontend:install": "[The command to install node dependencies, run in the frontend directory - often `npm install`]", + "frontend:build": "[The command to build the assets, run in the frontend directory - often `npm run build`]", + "frontend:dev": "[This command has been replaced by frontend:dev:build. If frontend:dev:build is not specified will falls back to this command. If this command is also not specified will falls back to frontend:build]", + "frontend:dev:build": "[This command is the dev equivalent of frontend:build. If not specified falls back to frontend:dev]", + "frontend:dev:install": "[This command is the dev equivalent of frontend:install. If not specified falls back to frontend:install]", + "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. 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]", + "debounceMS": 100, // The default time the dev server waits to reload when it detects a change in assets + "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.]", + "*/*": "[The command that will be executed after every build: ${platform} is replaced with the "GOOS/GOARCH" and ${bin} with the path to the compiled binary.]" + }, + "info": { // Data used to populate manifests and version info. + "companyName": "[The company name. Default: [The project name]]", + "productName": "[The product name. Default: [The project name]]", + "productVersion": "[The version of the product. Default: '1.0.0']", + "copyright": "[The copyright of the product. Default: 'Copyright.........']", + "comments": "[A short comment of the app. Default: 'Built using Wails (https://wails.app)']" + }, + "nsisType": "['multiple': One installer per architecture. 'single': Single universal installer for all architectures being built. Default: 'multiple']" +} +``` + +This file is read by the Wails CLI when running `wails build` or `wails dev`. + +The `assetdir`, `reloaddirs`, `wailsjsdir`, `debounceMS`, `devserver` and `frontenddevserverurl` flags in `wails build/dev` will update the project config +and thus become defaults for subsequent runs. \ No newline at end of file diff --git a/website/versioned_docs/version-v2.0.0-beta.44/reference/runtime/_category_.json b/website/versioned_docs/version-v2.0.0-beta.44/reference/runtime/_category_.json new file mode 100644 index 000000000..ac6d55488 --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-beta.44/reference/runtime/_category_.json @@ -0,0 +1,4 @@ +{ + "label": "Runtime", + "position": 1 +} diff --git a/website/versioned_docs/version-v2.0.0-beta.44/reference/runtime/browser.mdx b/website/versioned_docs/version-v2.0.0-beta.44/reference/runtime/browser.mdx new file mode 100644 index 000000000..1cb407d49 --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-beta.44/reference/runtime/browser.mdx @@ -0,0 +1,20 @@ +--- +sidebar_position: 7 +--- + +# Browser + +## Overview + +These methods are related to the system browser. + +### BrowserOpenURL +Go Signature: `BrowserOpenURL(ctx context.Context, url string)` + +JS Signature: `BrowserOpenURL(url string)` + +Opens the given URL in the system browser. + + + + diff --git a/website/versioned_docs/version-v2.0.0-beta.44/reference/runtime/dialog.mdx b/website/versioned_docs/version-v2.0.0-beta.44/reference/runtime/dialog.mdx new file mode 100644 index 000000000..2778010ff --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-beta.44/reference/runtime/dialog.mdx @@ -0,0 +1,263 @@ +--- +sidebar_position: 5 +--- + +# Dialog + +## Overview + +This part of the runtime provides access to native dialogs, such as File Selectors and Message boxes. + +:::info Javascript + Dialog is currently unsupported in the JS runtime. +::: + +### OpenDirectoryDialog + +Opens a dialog that prompts the user to select a directory. Can be customised using [OpenDialogOptions](#opendialogoptions). + +Go Signature: `OpenDirectoryDialog(ctx context.Context, dialogOptions OpenDialogOptions) (string, error)` + +Returns: Selected directory (blank if the user cancelled) or an error + + +### OpenFileDialog + +Opens a dialog that prompts the user to select a file. Can be customised using [OpenDialogOptions](#opendialogoptions). + +Go Signature: `OpenFileDialog(ctx context.Context, dialogOptions OpenDialogOptions) (string, error)` + +Returns: Selected file (blank if the user cancelled) or an error + + + +### OpenMultipleFilesDialog + +Opens a dialog that prompts the user to select multiple files. Can be customised using [OpenDialogOptions](#opendialogoptions). + +Go Signature: `OpenMultipleFilesDialog(ctx context.Context, dialogOptions OpenDialogOptions) ([]string, error)` + +Returns: Selected files (nil if the user cancelled) or an error + + + +### SaveFileDialog + +Opens a dialog that prompts the user to select a filename for the purposes of saving. Can be customised using [SaveDialogOptions](#savedialogoptions). + +Go Signature: `SaveFileDialog(ctx context.Context, dialogOptions SaveDialogOptions) (string, error)` + +Returns: The selected file (blank if the user cancelled) or an error + + + +### MessageDialog + +Displays a message using a message dialog. Can be customised using [MessageDialogOptions](#messagedialogoptions). + +Go Signature: `MessageDialog(ctx context.Context, dialogOptions MessageDialogOptions) (string, error)` + +Returns: The text of the selected button or an error + +## Options + +### OpenDialogOptions + +```go +type OpenDialogOptions struct { + DefaultDirectory string + DefaultFilename string + Title string + Filters []FileFilter + ShowHiddenFiles bool + CanCreateDirectories bool + ResolvesAliases bool + TreatPackagesAsDirectories bool +} +``` +| Field | Description | Win | Mac | Lin | +| -------------------------- | ---------------------------------------------- | --- | --- | --- | +| DefaultDirectory | The directory the dialog will show when opened | ✅ | ✅ | ✅ | +| DefaultFilename | The default filename | ✅ | ✅ | ✅ | +| Title | Title for the dialog | ✅ | ✅ | ✅ | +| [Filters](#filefilter) | A list of file filters | ✅ | ✅ | ✅ | +| ShowHiddenFiles | Show files hidden by the system | | ✅ | ✅ | +| CanCreateDirectories | Allow user to create directories | | ✅ | | +| ResolvesAliases | If true, returns the file not the alias | | ✅ | | +| TreatPackagesAsDirectories | Allow navigating into packages | | ✅ | | + + +### SaveDialogOptions + +```go +type SaveDialogOptions struct { + DefaultDirectory string + DefaultFilename string + Title string + Filters []FileFilter + ShowHiddenFiles bool + CanCreateDirectories bool + TreatPackagesAsDirectories bool +} +``` + +| Field | Description | Win | Mac | Lin | +| -------------------------- | ---------------------------------------------- | --- | --- | --- | +| DefaultDirectory | The directory the dialog will show when opened | ✅ | ✅ | ✅ | +| DefaultFilename | The default filename | ✅ | ✅ | ✅ | +| Title | Title for the dialog | ✅ | ✅ | ✅ | +| [Filters](#filefilter) | A list of file filters | ✅ | ✅ | ✅ | +| ShowHiddenFiles | Show files hidden by the system | | ✅ | ✅ | +| CanCreateDirectories | Allow user to create directories | | ✅ | | +| TreatPackagesAsDirectories | Allow navigating into packages | | ✅ | | + +### MessageDialogOptions + +```go +type MessageDialogOptions struct { + Type DialogType + Title string + Message string + Buttons []string + DefaultButton string + CancelButton string +} +``` +| Field | Description | Win | Mac | Lin | +| ------------- | ------------------------------------------------------------------------- | --- | --- | --- | +| Type | The type of message dialog, eg question, info... | ✅ | ✅ | ✅ | +| Title | Title for the dialog | ✅ | ✅ | ✅ | +| Message | The message to show the user | ✅ | ✅ | ✅ | +| Buttons | A list of button titles | | ✅ | | +| DefaultButton | The button with this text should be treated as default. Bound to `return` | | ✅ | | +| CancelButton | The button with this text should be treated as cancel. Bound to `escape` | | ✅ | | + +#### Windows + +Windows has standard dialog types in which the buttons are not customisable. +The value returned will be one of: "Ok", "Cancel", "Abort", "Retry", "Ignore", "Yes", "No", "Try Again" or "Continue" + +#### Linux + +Linux has standard dialog types in which the buttons are not customisable. +The value returned will be one of: "Ok", "Cancel", "Yes", "No" + +#### Mac + +A message dialog on Mac may specify up to 4 buttons. If no `DefaultButton` or `CancelButton` is given, the first button +is considered default and is bound to the `return` key. + +For the following code: +```go +selection, err := runtime.MessageDialog(b.ctx, runtime.MessageDialogOptions{ + Title: "It's your turn!", + Message: "Select a number", + Buttons: []string{"one", "two", "three", "four"}, +}) +``` +the first button is shown as default: +
+ +
+
+ +And if we specify `DefaultButton` to be "two": +```go +selection, err := runtime.MessageDialog(b.ctx, runtime.MessageDialogOptions{ + Title: "It's your turn!", + Message: "Select a number", + Buttons: []string{"one", "two", "three", "four"}, + DefaultButton: "two", +}) +``` +the second button is shown as default. When `return` is pressed, the value "two" is returned. +
+ +
+
+ +If we now specify `CancelButton` to be "three": +```go +selection, err := runtime.MessageDialog(b.ctx, runtime.MessageDialogOptions{ + Title: "It's your turn!", + Message: "Select a number", + Buttons: []string{"one", "two", "three", "four"}, + DefaultButton: "two", + CancelButton: "three", +}) +``` +the button with "three" is shown at the bottom of the dialog. When `escape` is pressed, the value "three" is returned: +
+ +
+
+
+
+ + +#### DialogType + +```go +const ( + InfoDialog DialogType = "info" + WarningDialog DialogType = "warning" + ErrorDialog DialogType = "error" + QuestionDialog DialogType = "question" + ) +``` + +### FileFilter + +```go +type FileFilter struct { + DisplayName string // Filter information EG: "Image Files (*.jpg, *.png)" + Pattern string // semi-colon separated list of extensions, EG: "*.jpg;*.png" +} +``` + +#### Windows + +Windows allows you to use multiple file filters in dialog boxes. Each FileFilter will show up as a separate entry in the +dialog: + +
+ +
+
+
+
+ +#### Linux + +Linux allows you to use multiple file filters in dialog boxes. Each FileFilter will show up as a separate entry in the +dialog: + +
+ +
+
+
+
+ + +#### Mac + +Mac dialogs only have the concept of a single set of patterns to filter files. If multiple FileFilters are provided, +Wails will use all the Patterns defined. + +Example: +```go + selection, err := runtime.OpenFileDialog(b.ctx, runtime.OpenDialogOptions{ + Title: "Select File", + Filters: []runtime.FileFilter{ + { + DisplayName: "Images (*.png;*.jpg)", + Pattern: "*.png;*.jpg", + }, { + DisplayName: "Videos (*.mov;*.mp4)", + Pattern: "*.mov;*.mp4", + }, + }, + }) +``` +This will result in the Open File dialog using `*.png,*.jpg,*.mov,*.mp4` as a filter. \ No newline at end of file diff --git a/website/versioned_docs/version-v2.0.0-beta.44/reference/runtime/events.mdx b/website/versioned_docs/version-v2.0.0-beta.44/reference/runtime/events.mdx new file mode 100644 index 000000000..c08f83c8a --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-beta.44/reference/runtime/events.mdx @@ -0,0 +1,51 @@ +--- +sidebar_position: 2 +--- + +# Events + +## Overview + +The Wails runtime provides a unified events system, where events can be emitted or received by either Go or Javascript. +Optionally, data may be passed with the events. Listeners will receive the data in the local data types. + +### EventsOn + +Go Signature: `EventsOn(ctx context.Context, eventName string, callback func(optionalData ...interface{}))` + +JS Signature: `EventsOn(eventName string, callback function(optionalData?: any))` + +This method sets up a listener for the given event name. When an event of type `eventName` is [emitted](#EventsEmit), +the callback is triggered. Any additional data sent with the emitted event will be passed to the callback. + +### EventsOff + +Go Signature: `EventsOff(ctx context.Context, eventName string)` + +JS Signature: `EventsOff(eventName string)` + +This method unregisters the listener for the given event name. + +### EventsOnce + +Go Signature: `EventsOnce(ctx context.Context, eventName string, callback func(optionalData ...interface{}))` + +JS Signature: `EventsOnce(eventName string, callback function(optionalData?: any))` + +This method sets up a listener for the given event name, but will only trigger once. + +### EventsOnMultiple + +Go Signature: `EventsOnMultiple(ctx context.Context, eventName string, callback func(optionalData ...interface{}), counter int)` + +JS Signature: `EventsOnMultiple(eventName string, callback function(optionalData?: any), counter int)` + +This method sets up a listener for the given event name, but will only trigger a maximum of `counter` times. + +### EventsEmit + +Go Signature: `EventsEmit(ctx context.Context, eventName string, optionalData ...interface{})` + +JS Signature: `EventsEmit(ctx context, optionalData function(optionalData?: any))` + +This method emits the given event. Optional data may be passed with the event. This will trigger any event listeners. diff --git a/website/versioned_docs/version-v2.0.0-beta.44/reference/runtime/intro.mdx b/website/versioned_docs/version-v2.0.0-beta.44/reference/runtime/intro.mdx new file mode 100644 index 000000000..0a33acdf9 --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-beta.44/reference/runtime/intro.mdx @@ -0,0 +1,70 @@ +--- +sidebar_position: 1 +--- + +# Introduction + +The runtime is a library that provides utility methods for your application. There is both a Go and Javascript runtime +and the aim is to try and keep them at parity where possible. + +The Go Runtime is available through importing `github.com/wailsapp/wails/v2/pkg/runtime`. All methods in this package +take a context as the first parameter. This context should be obtained from the [OnStartup](../options.mdx#onstartup) +or [OnDomReady](../options.mdx#ondomready) hooks. + +:::info Note + +Whilst the context will be provided to the +[OnStartup](../options.mdx#onstartup) method, there's no guarantee the runtime will work in this method as +the window is initialising in a different thread. If +you wish to call runtime methods at startup, use [OnDomReady](../options.mdx#ondomready). + +::: + +The Javascript library is available to the frontend via the `window.runtime` map. There is a runtime package generated when using `dev` +mode that provides Typescript declarations for the runtime. This should be located in the `wailsjs` directory in your +frontend directory. + +### 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)` + +Quits the application. + +### Environment + +Go Signature: `Environment(ctx context.Context) EnvironmentInfo` + +Returns details of the current environment. + +#### EnvironmentInfo + +```go +type EnvironmentInfo struct { + BuildType string // Either "production", "debug" or "dev" +} +``` + + diff --git a/website/versioned_docs/version-v2.0.0-beta.44/reference/runtime/log.mdx b/website/versioned_docs/version-v2.0.0-beta.44/reference/runtime/log.mdx new file mode 100644 index 000000000..713838008 --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-beta.44/reference/runtime/log.mdx @@ -0,0 +1,153 @@ +--- +sidebar_position: 3 +--- + +# Log + +## Overview + +The Wails runtime provides a logging mechanism that may be called from Go or Javascript. Like most +loggers, there are a number of log levels: + + - Trace + - Debug + - Info + - Warning + - Error + - Fatal + +The logger will output any log message at the current, or higher, log level. Example: The `Debug` log +level will output all messages except `Trace` messages. + +### LogPrint + +Go Signature: `LogPrint(ctx context.Context, message string)` + +JS Signature: `LogPrint(message: string)` + +Logs the given message as a raw message. + +### LogPrintf + +Go Signature: `LogPrintf(ctx context.Context, format string, args ...interface{})` + +Logs the given message as a raw message. + +### LogTrace + +Go Signature: `LogTrace(ctx context.Context, message string)` + +JS Signature: `LogTrace(message: string)` + +Logs the given message at the `Trace` log level. + +### LogTracef + +Go Signature: `LogTracef(ctx context.Context, format string, args ...interface{})` + +Logs the given message at the `Trace` log level. + +### LogDebug + +Go Signature: `LogDebug(ctx context.Context, message string)` + +JS Signature: `LogDebug(message: string)` + +Logs the given message at the `Debug` log level. + +### LogDebugf + +Go Signature: `LogDebugf(ctx context.Context, format string, args ...interface{})` + +Logs the given message at the `Debug` log level. + +### LogInfo + +Go Signature: `LogInfo(ctx context.Context, message string)` + +JS Signature: `LogInfo(message: string)` + +Logs the given message at the `Info` log level. + +### LogInfof + +Go Signature: `LogInfof(ctx context.Context, format string, args ...interface{})` + +Logs the given message at the `Info` log level. + +### LogWarning + +Go Signature: `LogWarning(ctx context.Context, message string)` + +JS Signature: `LogWarning(message: string)` + +Logs the given message at the `Warning` log level. + +### LogWarningf + +Go Signature: `LogWarningf(ctx context.Context, format string, args ...interface{})` + +Logs the given message at the `Warning` log level. + +### LogError + +Go Signature: `LogError(ctx context.Context, message string)` + +JS Signature: `LogError(message: string)` + +Logs the given message at the `Error` log level. + +### LogErrorf + +Go Signature: `LogErrorf(ctx context.Context, format string, args ...interface{})` + +Logs the given message at the `Error` log level. + +### LogFatal + +Go Signature: `LogFatal(ctx context.Context, message string)` + +JS Signature: `LogFatal(message: string)` + +Logs the given message at the `Fatal` log level. + +### LogFatalf + +Go Signature: `LogFatalf(ctx context.Context, format string, args ...interface{})` + +Logs the given message at the `Fatal` log level. + +### LogSetLogLevel + +Go Signature: `LogSetLogLevel(ctx context.Context, level logger.LogLevel)` + +JS Signature: `LogSetLogLevel(level: number)` + +Sets the log level. In Javascript, the number relates to the following log levels: + +| Value | Log Level | +| ----- | --------- | +| 1 | Trace | +| 2 | Debug | +| 3 | Info | +| 4 | Warning | +| 5 | Error | + +## Using a Custom Logger + +A custom logger may be used by providing it using the [Logger](../options.mdx#logger) +application option. The only requirement is that the logger implements the `logger.Logger` interface +defined in `github.com/wailsapp/wails/v2/pkg/logger`: + +```go title="logger.go" +type Logger interface { + Print(message string) + Trace(message string) + Debug(message string) + Info(message string) + Warning(message string) + Error(message string) + Fatal(message string) +} +``` + diff --git a/website/versioned_docs/version-v2.0.0-beta.44/reference/runtime/menu.mdx b/website/versioned_docs/version-v2.0.0-beta.44/reference/runtime/menu.mdx new file mode 100644 index 000000000..7d2d01783 --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-beta.44/reference/runtime/menu.mdx @@ -0,0 +1,25 @@ +--- +sidebar_position: 6 +--- + +# Menu + +## Overview + +These methods are related to the application menu. + +:::info Javascript + Menu is currently unsupported in the JS runtime. +::: + +### MenuSetApplicationMenu +Go Signature: `MenuSetApplicationMenu(ctx context.Context, menu *menu.Menu)` + +Sets the application menu to the given [menu](../menus.mdx) . + +### MenuUpdateApplicationMenu +Go Signature: `MenuUpdateApplicationMenu(ctx context.Context)` + +Updates the application menu, picking up any changes to the menu passed to `MenuSetApplicationMenu`. + + diff --git a/website/versioned_docs/version-v2.0.0-beta.44/reference/runtime/window.mdx b/website/versioned_docs/version-v2.0.0-beta.44/reference/runtime/window.mdx new file mode 100644 index 000000000..baf6222e5 --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-beta.44/reference/runtime/window.mdx @@ -0,0 +1,224 @@ +--- +sidebar_position: 4 +--- + +# Window + +## Overview + +These methods give control of the application window. + +### WindowSetTitle +Go Signature: `WindowSetTitle(ctx context.Context, title string)` + +JS Signature: `WindowSetTitle(title: string)` + +Sets the text in the window title bar. + +### WindowFullscreen +Go Signature: `WindowFullscreen(ctx context.Context)` + +JS Signature: `WindowFullscreen()` + +Makes the window full screen. + +### WindowUnfullscreen +Go Signature: `WindowUnfullscreen(ctx context.Context)` + +JS Signature: `WindowUnfullscreen()` + +Restores the previous window dimensions and position prior to full screen. + +### WindowCenter +Go Signature: `WindowCenter(ctx context.Context)` + +JS Signature: `WindowCenter()` + +Centers the window on the monitor the window is currently on. + +### WindowReload +Go Signature: `WindowReload(ctx context.Context)` + +JS Signature: `WindowReload()` + +Performs a "reload" (Reloads current page). + +### WindowReloadApp +Go Signature: `WindowReloadApp(ctx context.Context)` + +JS Signature: `WindowReloadApp()` + +Reloads the application frontend. + +### WindowSetSy + +### WindowSetSystemDefaultTheme +Go Signature: `WindowSetSystemDefaultTheme(ctx context.Context)` + +JS Signature: `WindowSetSystemDefaultTheme()` + +Windows only. + +Sets window theme to system default (dark/light). + +### WindowSetLightTheme +Go Signature: `WindowSetLightTheme(ctx context.Context)` + +JS Signature: `WindowSetLightTheme()` + +Windows only. + +Sets window theme to light. + +### WindowSetDarkTheme +Go Signature: `WindowSetDarkTheme(ctx context.Context)` + +JS Signature: `WindowSetDarkTheme()` + +Windows only. + +Sets window theme to dark. + +### WindowShow +Go Signature: `WindowShow(ctx context.Context)` + +JS Signature: `WindowShow()` + +Shows the window, if it is currently hidden. + +### WindowHide +Go Signature: `WindowHide(ctx context.Context)` + +JS Signature: `WindowHide()` + +Hides the window, if it is currently visible. + +### WindowSetSize +Go Signature: `WindowSetSize(ctx context.Context, width int, height int)` + +JS Signature: `WindowSetSize(size: Size)` + +Sets the width and height of the window. + +### WindowGetSize +Go Signature: `WindowGetSize(ctx context.Context) (width int, height int)` + +JS Signature: `WindowGetSize() : Size` + +Gets the width and height of the window. + +### WindowSetMinSize +Go Signature: `WindowSetMinSize(ctx context.Context, width int, height int)` + +JS Signature: `WindowSetMinSize(size: Size)` + +Sets the minimum window size. +Will resize the window if the window is currently smaller than the given dimensions. + +Setting a size of `0,0` will disable this constraint. + +### WindowSetMaxSize +Go Signature: `WindowSetMaxSize(ctx context.Context, width int, height int)` + +JS Signature: `WindowSetMaxSize(size: Size)` + +Sets the maximum window size. +Will resize the window if the window is currently larger than the given dimensions. + +Setting a size of `0,0` will disable this constraint. + +### WindowSetAlwaysOnTop +Go Signature: `WindowSetAlwaysOnTop(ctx context.Context, b bool)` + +JS Signature: `WindowSetAlwaysOnTop(b: Boolen)` + +Sets the window AlwaysOnTop or not on top. + + +### WindowSetPosition +Go Signature: `WindowSetPosition(ctx context.Context, x int, y int)` + +JS Signature: `WindowSetPosition(position: Position)` + +Sets the window position relative to the monitor the window is currently on. + +### WindowGetPosition +Go Signature: `WindowGetPosition(ctx context.Context) (x int, y int)` + +JS Signature: `WindowGetPosition() : Position` + +Gets the window position relative to the monitor the window is currently on. + +### WindowMaximise +Go Signature: `WindowMaximise(ctx context.Context)` + +JS Signature: `WindowMaximise()` + +Maximises the window to fill the screen. + +### WindowUnmaximise +Go Signature: `WindowUnmaximise(ctx context.Context)` + +JS Signature: `WindowUnmaximise()` + +Restores the window to the dimensions and position prior to maximising. + +### WindowToggleMaximise +Go Signature: `WindowToggleMaximise(ctx context.Context)` + +JS Signature: `WindowToggleMaximise()` + +Toggles between Maximised and UnMaximised. + +### WindowMinimise +Go Signature: `WindowMinimise(ctx context.Context)` + +JS Signature: `WindowMinimise()` + +Minimises the window. + +### WindowUnminimise +Go Signature: `WindowUnminimise(ctx context.Context)` + +JS Signature: `WindowUnminimise()` + +Restores the window to the dimensions and position prior to minimising. + +### WindowSetBackgroundColour +Go Signature: `WindowSetBackgroundColour(ctx context.Context, R, G, B, A uint8)` + +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. + +Valid values for R, G, B and A are 0-255. + +:::info Windows + +On Windows, only alpha values of 0 or 255 are supported. +Any value that is not 0 will be considered 255. + +::: + +## Typescript Object Definitions + +### Position + +```ts +interface Position { + x: number; + y: number; +} +``` + +### Size + +```ts +interface Size { + w: number; + h: number; +} +``` + + diff --git a/website/versioned_docs/version-v2.0.0-beta.44/tutorials/_category_.json b/website/versioned_docs/version-v2.0.0-beta.44/tutorials/_category_.json new file mode 100644 index 000000000..dfac1d175 --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-beta.44/tutorials/_category_.json @@ -0,0 +1,4 @@ +{ + "label": "Tutorials", + "position": 70 +} diff --git a/website/versioned_docs/version-v2.0.0-beta.44/tutorials/helloworld.mdx b/website/versioned_docs/version-v2.0.0-beta.44/tutorials/helloworld.mdx new file mode 100644 index 000000000..8edde09f7 --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-beta.44/tutorials/helloworld.mdx @@ -0,0 +1,113 @@ +--- +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: + +
+ +
+
+ +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: + +
+ +
+
diff --git a/website/versioned_docs/version-v2.0.0-rc.1/appendix/_category_.json b/website/versioned_docs/version-v2.0.0-rc.1/appendix/_category_.json new file mode 100644 index 000000000..83af4ca28 --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-rc.1/appendix/_category_.json @@ -0,0 +1,4 @@ +{ + "label": "Appendix", + "position": 70 +} diff --git a/website/versioned_docs/version-v2.0.0-rc.1/community/_category_.json b/website/versioned_docs/version-v2.0.0-rc.1/community/_category_.json new file mode 100644 index 000000000..524986e1e --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-rc.1/community/_category_.json @@ -0,0 +1,4 @@ +{ + "label": "Community", + "position": 50 +} diff --git a/website/versioned_docs/version-v2.0.0-rc.1/community/links.mdx b/website/versioned_docs/version-v2.0.0-rc.1/community/links.mdx new file mode 100644 index 000000000..d081cb9b3 --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-rc.1/community/links.mdx @@ -0,0 +1,24 @@ +--- +sidebar_position: 2 +--- + +# Links + +This page serves as a list for community related links. Please submit a PR (click `Edit this page` at the bottom) +to submit links. + +## Awesome Wails + +The [definitive list](https://github.com/wailsapp/awesome-wails) of links related to Wails. + +## Support Channels + +- [Gophers Slack Channel](https://gophers.slack.com/messages/CJ4P9F7MZ/) +- [Gophers Slack Channel Invite](https://invite.slack.golangbridge.org/) +- [Github Issues](https://github.com/wailsapp/wails/issues) +- [v2 Beta Discussion Board](https://github.com/wailsapp/wails/discussions/828) + +## Social Media + +- [Twitter](https://twitter.com/wailsapp) +- [Wails Chinese Community QQ Group](https://qm.qq.com/cgi-bin/qm/qr?k=PmIURne5hFGNd7QWzW5qd6FV-INEjNJv&jump_from=webapi) - Group number: 1067173054 diff --git a/website/versioned_docs/version-v2.0.0-rc.1/community/showcase/_category_.json b/website/versioned_docs/version-v2.0.0-rc.1/community/showcase/_category_.json new file mode 100644 index 000000000..276e283b7 --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-rc.1/community/showcase/_category_.json @@ -0,0 +1,4 @@ +{ + "label": "Showcase", + "position": 1 +} diff --git a/website/versioned_docs/version-v2.0.0-rc.1/community/showcase/emailit.mdx b/website/versioned_docs/version-v2.0.0-rc.1/community/showcase/emailit.mdx new file mode 100644 index 000000000..4a1ebe835 --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-rc.1/community/showcase/emailit.mdx @@ -0,0 +1,8 @@ +# EmailIt + +

+ +
+

+ +[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 builtin [Node-Red](https://nodered.org/) server, scripts terminal, and the [ScriptBar](https://github.com/raguay/ScriptBarApp) program for displaying results from Node-Red or a script on your system. Documentation is very scarce, but the programs works. It’s built using Wails2 and Svelte, and the download is a universal macOS application. diff --git a/website/versioned_docs/version-v2.0.0-rc.1/community/showcase/encrypteasy.mdx b/website/versioned_docs/version-v2.0.0-rc.1/community/showcase/encrypteasy.mdx new file mode 100644 index 000000000..13c2d8345 --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-rc.1/community/showcase/encrypteasy.mdx @@ -0,0 +1,10 @@ +# EncryptEasy + +

+ +
+

+ +**[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. diff --git a/website/versioned_docs/version-v2.0.0-rc.1/community/showcase/filehound.mdx b/website/versioned_docs/version-v2.0.0-rc.1/community/showcase/filehound.mdx new file mode 100644 index 000000000..741c14034 --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-rc.1/community/showcase/filehound.mdx @@ -0,0 +1,22 @@ +# FileHound Export Utility + +

+ +
+

+ +[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 diff --git a/website/versioned_docs/version-v2.0.0-rc.1/community/showcase/minecraftupdater.mdx b/website/versioned_docs/version-v2.0.0-rc.1/community/showcase/minecraftupdater.mdx new file mode 100644 index 000000000..11247339d --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-rc.1/community/showcase/minecraftupdater.mdx @@ -0,0 +1,10 @@ +# Minecraft Updater + +

+ +
+

+ +[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. diff --git a/website/versioned_docs/version-v2.0.0-rc.1/community/showcase/modalfilemanager.mdx b/website/versioned_docs/version-v2.0.0-rc.1/community/showcase/modalfilemanager.mdx new file mode 100644 index 000000000..a7ae8c492 --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-rc.1/community/showcase/modalfilemanager.mdx @@ -0,0 +1,12 @@ +# Modal File Manager + +

+ +
+

+ +[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. 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. diff --git a/website/versioned_docs/version-v2.0.0-rc.1/community/showcase/mollywallet.mdx b/website/versioned_docs/version-v2.0.0-rc.1/community/showcase/mollywallet.mdx new file mode 100644 index 000000000..534b097ca --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-rc.1/community/showcase/mollywallet.mdx @@ -0,0 +1,8 @@ +# Molley Wallet + +

+ +
+

+ +[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. diff --git a/website/versioned_docs/version-v2.0.0-rc.1/community/showcase/october.mdx b/website/versioned_docs/version-v2.0.0-rc.1/community/showcase/october.mdx new file mode 100644 index 000000000..889d2dd9e --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-rc.1/community/showcase/october.mdx @@ -0,0 +1,12 @@ +# October + +

+ +
+

+ +[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. diff --git a/website/versioned_docs/version-v2.0.0-rc.1/community/showcase/optimus.mdx b/website/versioned_docs/version-v2.0.0-rc.1/community/showcase/optimus.mdx new file mode 100644 index 000000000..c3eb79507 --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-rc.1/community/showcase/optimus.mdx @@ -0,0 +1,8 @@ +# Optimus + +

+ +
+

+ +[Optimus](https://github.com/splode/optimus) is a desktop image optimization application. It supports conversion and compression between WebP, JPEG, and PNG image formats. diff --git a/website/versioned_docs/version-v2.0.0-rc.1/community/showcase/portfall.mdx b/website/versioned_docs/version-v2.0.0-rc.1/community/showcase/portfall.mdx new file mode 100644 index 000000000..4cc2c63c9 --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-rc.1/community/showcase/portfall.mdx @@ -0,0 +1,8 @@ +# Portfall + +

+ +
+

+ +[Portfall](https://github.com/rekon-oss/portfall) - A desktop k8s port-forwarding portal for easy access to all your cluster UIs diff --git a/website/versioned_docs/version-v2.0.0-rc.1/community/showcase/restic-browser.mdx b/website/versioned_docs/version-v2.0.0-rc.1/community/showcase/restic-browser.mdx new file mode 100644 index 000000000..1505ce07a --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-rc.1/community/showcase/restic-browser.mdx @@ -0,0 +1,10 @@ +# Restic Browser + +

+ +
+

+ +[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. diff --git a/website/versioned_docs/version-v2.0.0-rc.1/community/showcase/riftshare.mdx b/website/versioned_docs/version-v2.0.0-rc.1/community/showcase/riftshare.mdx new file mode 100644 index 000000000..5223e88cf --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-rc.1/community/showcase/riftshare.mdx @@ -0,0 +1,19 @@ +# RiftShare + +

+ +
+

+ +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! diff --git a/website/versioned_docs/version-v2.0.0-rc.1/community/showcase/scriptbar.mdx b/website/versioned_docs/version-v2.0.0-rc.1/community/showcase/scriptbar.mdx new file mode 100644 index 000000000..aaa556f92 --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-rc.1/community/showcase/scriptbar.mdx @@ -0,0 +1,8 @@ +# ScriptBar + +

+ +
+

+ +[ScriptBar](https://GitHub.com/raguay/ScriptBarApp) is a program to show the output of the embedded [Node-Red](https://nodered.org) server in the [EmailIt](https://GitHub.com/raguay/EmailIt) application. 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. diff --git a/website/versioned_docs/version-v2.0.0-rc.1/community/showcase/surge.mdx b/website/versioned_docs/version-v2.0.0-rc.1/community/showcase/surge.mdx new file mode 100644 index 000000000..2d895dc29 --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-rc.1/community/showcase/surge.mdx @@ -0,0 +1,8 @@ +# Surge + +

+ +
+

+ +[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. diff --git a/website/versioned_docs/version-v2.0.0-rc.1/community/showcase/wally.mdx b/website/versioned_docs/version-v2.0.0-rc.1/community/showcase/wally.mdx new file mode 100644 index 000000000..2a2498f40 --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-rc.1/community/showcase/wally.mdx @@ -0,0 +1,8 @@ +# Wally + +

+ +
+

+ +[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. diff --git a/website/versioned_docs/version-v2.0.0-rc.1/community/showcase/wombat.mdx b/website/versioned_docs/version-v2.0.0-rc.1/community/showcase/wombat.mdx new file mode 100644 index 000000000..54cedacea --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-rc.1/community/showcase/wombat.mdx @@ -0,0 +1,8 @@ +# Wombat + +

+ +
+

+ +[Wombat](https://github.com/rogchap/wombat) is a cross platform gRPC client. diff --git a/website/versioned_docs/version-v2.0.0-rc.1/community/showcase/ytd.mdx b/website/versioned_docs/version-v2.0.0-rc.1/community/showcase/ytd.mdx new file mode 100644 index 000000000..178ff0529 --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-rc.1/community/showcase/ytd.mdx @@ -0,0 +1,8 @@ +# Ytd + +

+ +
+

+ +[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. diff --git a/website/versioned_docs/version-v2.0.0-rc.1/community/templates.mdx b/website/versioned_docs/version-v2.0.0-rc.1/community/templates.mdx new file mode 100644 index 000000000..80551784c --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-rc.1/community/templates.mdx @@ -0,0 +1,53 @@ +--- +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) - A template using Vite,Vue and Vue-Router(Support both JavaScript and TypeScript) +- [wails-vite-vue-ts](https://github.com/codydbentley/wails-vite-vue-ts) - Vue 3 TypeScript with Vite (and instructions to add features) +- [wails-vite-vue-the-works](https://github.com/codydbentley/wails-vite-vue-the-works) - Vue 3 TypeScript with Vite, Vuex, Vue Router, Sass, and ESLint + Prettier + +## Angular + +- [wails-angular-template](https://github.com/TAINCER/wails-angular-template) - Angular with TypeScript, Sass, Hot-Reload, Code-Splitting and i18n + +## React + +- [wails-react-template](https://github.com/AlienRecall/wails-react-template) - A template using reactjs +- [wails-react-template](https://github.com/flin7/wails-react-template) - A minimal template for React that supports live development +- [wails-template-nextjs](https://github.com/LGiki/wails-template-nextjs) - A template using Next.js and TypeScript + +## Svelte + +- [wails-svelte-template](https://github.com/raitonoberu/wails-svelte-template) - A template using Svelte +- [wails-vite-svelte-template](https://github.com/BillBuilt/wails-vite-svelte-template) - A template using Svelte and Vite +- [wails-vite-svelte-tailwind-template](https://github.com/BillBuilt/wails-vite-svelte-tailwind-template) - A template using Svelte and Vite with TailwindCSS v3 +- [wails-sveltekit-template](https://github.com/h8gi/wails-sveltekit-template) - A template using SvelteKit + +## 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: + +## 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 \ No newline at end of file diff --git a/website/versioned_docs/version-v2.0.0-rc.1/gettingstarted/_category_.json b/website/versioned_docs/version-v2.0.0-rc.1/gettingstarted/_category_.json new file mode 100644 index 000000000..597b920df --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-rc.1/gettingstarted/_category_.json @@ -0,0 +1,4 @@ +{ + "label": "Getting Started", + "position": 10 +} diff --git a/website/versioned_docs/version-v2.0.0-rc.1/gettingstarted/building.mdx b/website/versioned_docs/version-v2.0.0-rc.1/gettingstarted/building.mdx new file mode 100644 index 000000000..33e19b144 --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-rc.1/gettingstarted/building.mdx @@ -0,0 +1,21 @@ +--- +sidebar_position: 6 +--- + +# Compiling your Project + +From the project directory, run `wails build`. +This will compile your project and save the production-ready binary in the `build/bin` directory. + +If you run the binary, you should see the default application: + +
+ +
+
+ +For more details on compilation options, please refer to the [CLI Reference](../reference/cli.mdx#build). diff --git a/website/versioned_docs/version-v2.0.0-rc.1/gettingstarted/development.mdx b/website/versioned_docs/version-v2.0.0-rc.1/gettingstarted/development.mdx new file mode 100644 index 000000000..54dda5faa --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-rc.1/gettingstarted/development.mdx @@ -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 diff --git a/website/versioned_docs/version-v2.0.0-rc.1/gettingstarted/firstproject.mdx b/website/versioned_docs/version-v2.0.0-rc.1/gettingstarted/firstproject.mdx new file mode 100644 index 000000000..883b3dde6 --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-rc.1/gettingstarted/firstproject.mdx @@ -0,0 +1,134 @@ +--- +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: + + + +import Tabs from "@theme/Tabs"; +import TabItem from "@theme/TabItem"; + + + + Generate a Svelte project using Javascript with:

+ + wails init -n myproject -t svelte + +If you would rather use Typescript:
+ + wails init -n myproject -t svelte-ts + + + + Generate a React project using Javascript with:

+ + wails init -n myproject -t react + +If you would rather use Typescript:
+ + wails init -n myproject -t react-ts + + + + Generate a Vue project using Javascript with:

+ + wails init -n myproject -t vue + +If you would rather use Typescript:
+ + wails init -n myproject -t vue-ts + + + + Generate a Preact project using Javascript with:

+ + wails init -n myproject -t preact + +If you would rather use Typescript:
+ + wails init -n myproject -t preact-ts + + + + Generate a Lit project using Javascript with:

+ + wails init -n myproject -t lit + +If you would rather use Typescript:
+ + wails init -n myproject -t lit-ts + + + + Generate a Vanilla project using Javascript with:

+ + wails init -n myproject -t vanilla + +If you would rather use Typescript:
+ + wails init -n myproject -t vanilla-ts + + + + + + +
+ +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. + +The default module name in `go.mod` is "changeme". You should change this to something more appropriate. diff --git a/website/versioned_docs/version-v2.0.0-rc.1/gettingstarted/installation.mdx b/website/versioned_docs/version-v2.0.0-rc.1/gettingstarted/installation.mdx new file mode 100644 index 000000000..98d3032cd --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-rc.1/gettingstarted/installation.mdx @@ -0,0 +1,98 @@ +--- +sidebar_position: 1 +--- + +# Installation + +## Supported Platforms + +- Windows 10/11 AMD64/ARM64 +- MacOS 10.13+ AMD64 +- MacOS 11.0+ ARM64 +- Linux AMD64/ARM64 + +## Dependencies + +Wails has a number of common dependencies that are required before installation: + +- Go 1.17+ +- NPM (Node 15+) + +### Go + +Download Go from the [Go Downloads Page](https://go.dev/doc/install). + +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: + + + +import Tabs from "@theme/Tabs"; +import TabItem from "@theme/TabItem"; + + + + Wails requires that the xcode command line tools are installed. This can be + done by running:
+ xcode-select --install + + + Wails requires that the{" "} + + WebView2 + {" "} + runtime is installed. Some Windows installations will already have this + installed. You can check using the wails doctor command (see + below). + + + 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. + + + + + +## Optional Dependencies + +- [UPX](https://upx.github.io/) for compressing your applications. + +## Installing Wails + +Run `go install github.com/wailsapp/wails/v2/cmd/wails@latest` to install the Wails CLI. + +## System Check + +Running `wails doctor` will check if you have the correct dependencies installed. If not, it will advise on what is missing and help on how to rectify any problems. + +## 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. diff --git a/website/versioned_docs/version-v2.0.0-rc.1/guides/_category_.json b/website/versioned_docs/version-v2.0.0-rc.1/guides/_category_.json new file mode 100644 index 000000000..5935dad93 --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-rc.1/guides/_category_.json @@ -0,0 +1,4 @@ +{ + "label": "Guides", + "position": 50 +} diff --git a/website/versioned_docs/version-v2.0.0-rc.1/guides/application-development.mdx b/website/versioned_docs/version-v2.0.0-rc.1/guides/application-development.mdx new file mode 100644 index 000000000..f8074d150 --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-rc.1/guides/application-development.mdx @@ -0,0 +1,228 @@ +# 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) + } +} +``` + +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 specifiy `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/). +For [create-react-app](https://create-react-app.dev/), it's possible to use +[this script](https://gist.github.com/int128/e0cdec598c5b3db728ff35758abdbafd) to achieve a similar result. + +## Go Module + +The default Wails templates generate a `go.mod` file that contains the module name "changeme". You should change this +to something more appropriate after project generation. diff --git a/website/versioned_docs/version-v2.0.0-rc.1/guides/bleeding-edge.mdx b/website/versioned_docs/version-v2.0.0-rc.1/guides/bleeding-edge.mdx new file mode 100644 index 000000000..908242edd --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-rc.1/guides/bleeding-edge.mdx @@ -0,0 +1,61 @@ +# Bleeding Edge + +## Overview + +Wails is in constant development and new releases are regularly "tagged". This usually happens when all the newer code +on `master` has been tested and confirmed working. If you need a bugfix or feature that has not yet made it to a release, +it's possible to use the latest "bleeding edge" version using the following steps: + +- `git clone https://github.com/wailsapp/wails` +- `cd wails/v2/cmd/wails` +- `go install` + +NOTE: The directory that you cloned the project into will now be called "clonedir". + +The Wails CLI will now be at the very latest version. + +### 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 => ` + +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. diff --git a/website/versioned_docs/version-v2.0.0-rc.1/guides/dynamic-assets.mdx b/website/versioned_docs/version-v2.0.0-rc.1/guides/dynamic-assets.mdx new file mode 100644 index 000000000..62a807167 --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-rc.1/guides/dynamic-assets.mdx @@ -0,0 +1,133 @@ +# 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: 255}, + 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: + +

+ +

+ +However, if we request `go.mod`, we will see the following output: + +

+ +

+ +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 + +``` + +with: + +```html + +``` + +Then we would see the following: + +

+ +

+ +:::warning +Exposing your filesystem in this way is a security risk. It is recommended that you properly manage access +to your filesystem. +::: diff --git a/website/versioned_docs/version-v2.0.0-rc.1/guides/frameless.mdx b/website/versioned_docs/version-v2.0.0-rc.1/guides/frameless.mdx new file mode 100644 index 000000000..fa34bc380 --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-rc.1/guides/frameless.mdx @@ -0,0 +1,89 @@ +# 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 + + + + + + + +
+ + +
+
+ + + + +``` + +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" +) + +//go:embed 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, + Assets: assets, + Frameless: true, + CSSDragProperty: "widows", + CSSDragValue: "1", + Bind: []interface{}{ + app, + }, + }) + + if err != nil { + println("Error:", err) + } +} +``` + +```html title=index.html + + + + + + alwaysontop + + +
+ + + + +``` + +:::info Fullscreen +If you allow your application to go fullscreen, this drag functionality will be disabled. +::: diff --git a/website/versioned_docs/version-v2.0.0-rc.1/guides/frontend.mdx b/website/versioned_docs/version-v2.0.0-rc.1/guides/frontend.mdx new file mode 100644 index 000000000..1384087da --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-rc.1/guides/frontend.mdx @@ -0,0 +1,73 @@ +# Frontend + +## Script Injection + +When Wails serves your `index.html`, by default, it will inject 2 script entries into the `` 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 + + + injection example + + + + + + + +
Please enter your name below 👇
+
+ + +
+ + + + +``` + +### Overriding Default Script Injection + +To provide more flexibility to developers, there is a meta tag that may be used to customise this behaviour: + +```html + +``` + +The options are as follows: + +| Value | Description | +| ------------------- | ------------------------------------------------ | +| noautoinjectruntime | Disable the autoinjection of `/wails/runtime.js` | +| noautoinjectipc | Disable the autoinjection of `/wails/ipc.js` | +| noautoinject | Disable all autoinjection of scripts | + +Multiple options may be used provided they are comma seperated. + +This code is perfectly valid and operates the same as the autoinjection version: + +```html + + + injection example + + + + + + +
Please enter your name below 👇
+
+ + +
+ + + + + + +``` diff --git a/website/versioned_docs/version-v2.0.0-rc.1/guides/ides.mdx b/website/versioned_docs/version-v2.0.0-rc.1/guides/ides.mdx new file mode 100644 index 000000000..aa6841879 --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-rc.1/guides/ides.mdx @@ -0,0 +1,129 @@ +# IDEs + +Wails aims to provide a great development experience. To that aim, we now support generating IDE specific configuration +to provide smoother project setup. + +Currently, we support [Visual Studio Code](https://code.visualstudio.com/) but aim to support other IDEs such as Goland. + +## Visual Studio Code + +

+ +

+ +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. + +::: diff --git a/website/versioned_docs/version-v2.0.0-rc.1/guides/linux-distro-support.mdx b/website/versioned_docs/version-v2.0.0-rc.1/guides/linux-distro-support.mdx new file mode 100644 index 000000000..5ec628f2e --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-rc.1/guides/linux-distro-support.mdx @@ -0,0 +1,108 @@ +# 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 `.go`, where `` 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! +::: diff --git a/website/versioned_docs/version-v2.0.0-rc.1/guides/linux.mdx b/website/versioned_docs/version-v2.0.0-rc.1/guides/linux.mdx new file mode 100644 index 000000000..fa74fe6cf --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-rc.1/guides/linux.mdx @@ -0,0 +1,20 @@ +# 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) diff --git a/website/versioned_docs/version-v2.0.0-rc.1/guides/manual-builds.mdx b/website/versioned_docs/version-v2.0.0-rc.1/guides/manual-builds.mdx new file mode 100644 index 000000000..41cbfd1dc --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-rc.1/guides/manual-builds.mdx @@ -0,0 +1,98 @@ +# 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/.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. diff --git a/website/versioned_docs/version-v2.0.0-rc.1/guides/migrating.mdx b/website/versioned_docs/version-v2.0.0-rc.1/guides/migrating.mdx new file mode 100644 index 000000000..b00859935 --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-rc.1/guides/migrating.mdx @@ -0,0 +1,204 @@ +# 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, + 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 +the 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 frontend/dist +var assets embed.FS + +func main() { + err := wails.Run(&options.App{ + /* Other Options */ + Assets: assets, + }) +} +``` + +Of course, bundlers can be used if you wish to. The only requirement is to pass +the final application assets directory to Wails using an `embed.FS` in the `Assets` +key of the [application options](../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: + +

+ +| 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/versioned_docs/version-v2.0.0-rc.1/guides/mouse-buttons.mdx b/website/versioned_docs/version-v2.0.0-rc.1/guides/mouse-buttons.mdx new file mode 100644 index 000000000..5244ce015 --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-rc.1/guides/mouse-buttons.mdx @@ -0,0 +1,27 @@ +# 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/versioned_docs/version-v2.0.0-rc.1/guides/obfuscated.mdx b/website/versioned_docs/version-v2.0.0-rc.1/guides/obfuscated.mdx new file mode 100644 index 000000000..7d0e78def --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-rc.1/guides/obfuscated.mdx @@ -0,0 +1,43 @@ +# 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 -obfuscate +``` +To customise the obfuscation settings, you can use the `-garbleargs` flag: + +```bash +wails build -obfuscate -garbleargs "-literals -tiny -seed=myrandomseed" +``` + +These settings may be persisted in your [project config](/guides/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. \ No newline at end of file diff --git a/website/versioned_docs/version-v2.0.0-rc.1/guides/overscroll.mdx b/website/versioned_docs/version-v2.0.0-rc.1/guides/overscroll.mdx new file mode 100644 index 000000000..afe93de41 --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-rc.1/guides/overscroll.mdx @@ -0,0 +1,11 @@ +# Overscroll + +[Overscroll](https://developer.mozilla.org/en-US/docs/Web/CSS/overscroll-behavior) is the "bounce effect" you sometimes +get when you scroll beyond a page's content boundaries. This is common in mobile apps. This can be disabled using CSS: + +```css +html { + height: 100%; + overflow: hidden; +} +``` diff --git a/website/versioned_docs/version-v2.0.0-rc.1/guides/routing.mdx b/website/versioned_docs/version-v2.0.0-rc.1/guides/routing.mdx new file mode 100644 index 000000000..c35cc1c8a --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-rc.1/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( + + {/* The rest of your app goes here */} + + } exact /> + } /> + } /> + {/* more... */} + + , + root +); +``` diff --git a/website/versioned_docs/version-v2.0.0-rc.1/guides/signing.mdx b/website/versioned_docs/version-v2.0.0-rc.1/guides/signing.mdx new file mode 100644 index 000000000..349ae123a --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-rc.1/guides/signing.mdx @@ -0,0 +1,411 @@ +# 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@v2 + - 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 /t /f certificate\certificate.pfx /p '${{ secrets.WIN_SIGNING_CERT_PASSWORD }}' + +``` + +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@v2 + - 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@v2 + - 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/mitchellh/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 mitchellh/gon/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": "@env:APPLE_PASSWORD" + }, + "sign": { + "application_identity": "Developer ID Application: My Name" + } +} +``` + +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 +``` + +2. entitlements.plist: + +```plist + + + + + com.apple.security.app-sandbox + + com.apple.security.network.client + + com.apple.security.network.server + + com.apple.security.files.user-selected.read-write + + com.apple.security.files.downloads.read-write + + + +``` + +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 + + + CFBundlePackageTypeAPPL + CFBundleNameMyApp + CFBundleExecutableapp + CFBundleIdentifierapp.myapp + CFBundleVersion0.1.0 + CFBundleGetInfoStringMy app is cool and nice and chill and + CFBundleShortVersionString0.1.0 + CFBundleIconFileiconfile + LSMinimumSystemVersion10.13.0 + NSHighResolutionCapabletrue + LSApplicationCategoryTypepublic.app-category.utilities + NSHumanReadableCopyright© Me + +``` + +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@v2 + - 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 mitchellh/gon/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). diff --git a/website/versioned_docs/version-v2.0.0-rc.1/guides/templates.mdx b/website/versioned_docs/version-v2.0.0-rc.1/guides/templates.mdx new file mode 100644 index 000000000..923b10d6b --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-rc.1/guides/templates.mdx @@ -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: + +
+ +
+ +## 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 diff --git a/website/versioned_docs/version-v2.0.0-rc.1/guides/troubleshooting.mdx b/website/versioned_docs/version-v2.0.0-rc.1/guides/troubleshooting.mdx new file mode 100644 index 000000000..8f768e0a1 --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-rc.1/guides/troubleshooting.mdx @@ -0,0 +1,159 @@ +# 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 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 +NSAppTransportSecurity + + NSAllowsLocalNetworking + + +``` + +Reference: https://github.com/wailsapp/wails/issues/1504#issuecomment-1174317433 + +## Mac application not valid + +If your built application looks like this in finder: + +

+ +

+ +it's likely that your application's `info.plist` is invalid. Update the file in `build/.app/Contents/info.plist` +and check if the data is valid, EG check the binary name is correct. To persist the changes, copy the file back to +the `build/darwin` directory. + +## Cannot call backend method from frontend with variadic arguments + +If you have a backend method defined with variadic parameters, eg: + +```go +func (a *App) TestFunc(msg string, args ...interface{}) error { + // Code +} +``` + +calling this method from the frontend like this will fail: + +```js +var msg = "Hello: "; +var args = ["Go", "JS"]; +window.go.main.App.TestFunc(msg, ...args) + .then((result) => { + //do things here + }) + .catch((error) => { + //handle error + }); +``` + +Workaround: + +```js +var msg = "Hello "; +var args = ["Go", "JS"]; +window.go.main.App.TestFunc(msg, args) + .then((result) => { + //without the 3 dots + //do things here + }) + .catch((error) => { + //handle error + }); +``` + +Credit: https://github.com/wailsapp/wails/issues/1186 + +## I'm having getting proxy errors when trying to install Wails + +If you are getting errors like this: + +``` +"https://proxy.golang.org/github.com/wailsapp/wails/cmd/wails/@v/list": dial tcp 172.217.163.49:443: connectex: A connection attempt failed because the connected party did not properly respond after a period of time, or established connection failed because connected host has failed to respond. +``` + +it's probably because the official Go Proxy is being blocked (Users in China have reported this). +The solution is to set up the proxy manually, eg: + +``` +go env -w GO111MODULE=on +go env -w GOPROXY=https://goproxy.cn,direct +``` + +Source: https://github.com/wailsapp/wails/issues/1233 + +## 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 `` section of any new page you navigate to: + +```html + + + + +``` + +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. + +Source: https://github.com/wailsapp/wails/issues/1806 \ No newline at end of file diff --git a/website/versioned_docs/version-v2.0.0-rc.1/guides/vscode.mdx b/website/versioned_docs/version-v2.0.0-rc.1/guides/vscode.mdx new file mode 100644 index 000000000..e3d3e1f02 --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-rc.1/guides/vscode.mdx @@ -0,0 +1,85 @@ + +# 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. diff --git a/website/versioned_docs/version-v2.0.0-rc.1/guides/windows-installer.mdx b/website/versioned_docs/version-v2.0.0-rc.1/guides/windows-installer.mdx new file mode 100644 index 000000000..cb31d0527 --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-rc.1/guides/windows-installer.mdx @@ -0,0 +1,58 @@ +# NSIS installer + +

+ +
+

+ +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. + +If you use the chocolatey package manager, run the following script: + +``` +choco install nsis +``` + +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. diff --git a/website/versioned_docs/version-v2.0.0-rc.1/guides/windows.mdx b/website/versioned_docs/version-v2.0.0-rc.1/guides/windows.mdx new file mode 100644 index 000000000..7d7167ecd --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-rc.1/guides/windows.mdx @@ -0,0 +1,71 @@ +# 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. + +## 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). diff --git a/website/versioned_docs/version-v2.0.0-rc.1/howdoesitwork.mdx b/website/versioned_docs/version-v2.0.0-rc.1/howdoesitwork.mdx new file mode 100644 index 000000000..62fafb685 --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-rc.1/howdoesitwork.mdx @@ -0,0 +1,405 @@ +--- +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. + +
+ +
+ +## The Main Application + +### Overview + +The main application consists of a single call to `wails.Run()`. It accepts the +application configuration which describes the size of the application window, the window title, +what assets to use, etc. A basic application might look like this: + +```go title="main.go" +package main + +import ( + "embed" + "log" + + "github.com/wailsapp/wails/v2" + "github.com/wailsapp/wails/v2/pkg/options" +) + +//go:embed frontend/dist +var assets embed.FS + +func main() { + + app := &App{} + + err := wails.Run(&options.App{ + Title: "Basic Demo", + Width: 1024, + Height: 768, + Assets: &assets, + OnStartup: app.startup, + OnShutdown: app.shutdown, + Bind: []interface{}{ + app, + }, + }) + if err != nil { + log.Fatal(err) + } +} + + +type App struct { + ctx context.Context +} + +func (b *App) startup(ctx context.Context) { + b.ctx = ctx +} + +func (b *App) shutdown(ctx context.Context) {} + +func (b *App) Greet(name string) string { + return fmt.Sprintf("Hello %s!", name) +} +``` + +### Options rundown + +This example has the following options set: + +- `Title` - The text that should appear in the window's title bar +- `Width` & `Height` - The dimensions of the window +- `Assets` - The application's frontend assets +- `OnStartup` - A callback for when the window is created and is about to start loading the frontend assets +- `OnShutdown` - A callback for when the application is about to quit +- `Bind` - A slice of struct instances that we wish to expose to the frontend + +A full list of application options can be found in the [Options Reference](reference/options). + +#### Assets + +The `Assets` option is mandatory as you can't have a Wails application without frontend assets. Those assets can be +any files you would expect to find in a web application - html, js, css, svg, png, etc. **There is no requirement to +generate asset bundles** - plain files will do. When the application starts, it will attempt to load `index.html` +from your assets and the frontend will essentially work as a browser from that point on. It is worth noting that +there is no requirement on where in the `embed.FS` the files live. It is likely that the embed path uses a nested +directory relative to your main application code, such as `frontend/dist`: + +```go title="main.go" +//go:embed frontend/dist +var assets embed.FS +``` + +At startup, Wails will iterate the embedded files looking for the directory containing `index.html`. All other assets will be loaded relative +to this directory. + +As production binaries use the files contained in `embed.FS`, there are no external files required to be shipped with +the application. + +When running in development mode using the `wails dev` command, the assets are loaded off disk, and any changes result +in a "live reload". The location of the assets will be inferred from the `embed.FS`. + +More details can be found in the [Application Development Guide](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 {16,24} title="main.go" +package main + +import ( + "embed" + "log" + + "github.com/wailsapp/wails/v2" + "github.com/wailsapp/wails/v2/pkg/options" +) + +//go:embed frontend/dist +var assets embed.FS + +func main() { + + app := &App{} + + err := wails.Run(&options.App{ + Title: "Basic Demo", + Width: 1024, + Height: 768, + Assets: &assets, + 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 {8-10} + //... + err := wails.Run(&options.App{ + Title: "Basic Demo", + Width: 1024, + Height: 768, + Assets: &assets, + Bind: []interface{}{ + app, + &mystruct1{}, + &mystruct2{}, + }, + }) + +``` + +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 + +[^1]: + There is a very small subset of libraries that use features unsupported in WebViews. There are often alternatives and + workarounds for such cases. + +### Calling bound Go methods + +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; +``` + +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. Note: If you wish to use structs, you **must** define +`json` struct tags for your fields! + +:::info Note +Anonymous nested structs are not supported at this time. +::: + +It is 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; +``` + +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) { + 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). diff --git a/website/versioned_docs/version-v2.0.0-rc.1/introduction.mdx b/website/versioned_docs/version-v2.0.0-rc.1/introduction.mdx new file mode 100644 index 000000000..6ef1e7523 --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-rc.1/introduction.mdx @@ -0,0 +1,90 @@ +--- +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://vite.net/) +- Powerful CLI to easily Create, Build and Package applications +- A rich [runtime library](/docs/next/reference/runtime) +- Applications built with Wails are Apple & Microsoft Store compliant + + +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. + +

+ + + +

+ +### 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 is resource efficient. Instead, it uses the native rendering engine for the +platform. On Windows, this is the new Microsoft Webview2 library, built on Chromium. + +### Go & Javascript Interoperability + +Wails automatically makes your Go methods available to Javascript, so you can call them by name from your frontend! +It even generates Typescript 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! diff --git a/website/versioned_docs/version-v2.0.0-rc.1/reference/_category_.json b/website/versioned_docs/version-v2.0.0-rc.1/reference/_category_.json new file mode 100644 index 000000000..ebb337b83 --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-rc.1/reference/_category_.json @@ -0,0 +1,4 @@ +{ + "label": "Reference", + "position": 40 +} diff --git a/website/versioned_docs/version-v2.0.0-rc.1/reference/cli.mdx b/website/versioned_docs/version-v2.0.0-rc.1/reference/cli.mdx new file mode 100644 index 000000000..011ffb8e4 --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-rc.1/reference/cli.mdx @@ -0,0 +1,226 @@ +--- +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 ` + +## init + +`wails init` is used for generating projects. + +| Flag | Description | Default | +| :----------------- | :---------------------------------------------------------------------------------------------------------------------- | :-----------------: | +| -n "project name" | Name of the project. **Mandatory**. | | +| -d "project dir" | Project directory to create | Name of the project | +| -g | Initialise git repository | | +| -l | List available project templates | | +| -q | Suppress output to console | | +| -t "template name" | The project template to use. This can be the name of a default template or a URL to a remote template hosted on github. | vanilla | +| -ide | Generate IDE project files | | +| -f | Force build application | false | + +Example: +`wails init -n test -d mytestproject -g -ide vscode -q` + +This will generate a a project called "test" in the "mytestproject" directory, initialise git, +generate vscode project files and do so silently. + +More information on using IDEs with Wails can be found [here](../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 | +| :------------------- |:----------------------------------------------------------------------------------------------------------------------------------------------------------------------------| :-------------------------------------------------------------------------------------------------------------------------------------------- | +| -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`.
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 | false | +| -f | Force build application | false | +| -tags "extra tags" | Build tags to pass to Go compiler. Must be quoted. Space or comma (but not both) separated | | +| -upx | Compress final binary using "upx" | | +| -upxflags | Flags to pass to upx | | +| -v int | Verbosity level (0 - silent, 1 - default, 2 - verbose) | 1 | +| -webview2 | WebView2 installer strategy: download,embed,browser,error | download | +| -u | Updates your project's `go.mod` to use the same version of Wails as the CLI | | +| -debug | Retains debug information in the application. 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. + +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 UPX on Apple Silicon + +There are [issues](https://github.com/upx/upx/issues/446) with using UPX with Apple Silicon. + +::: + +:::info UPX on Windows + +Some Antivirus vendors false positively mark `upx` compressed binaries as virus, see [issue](https://github.com/upx/upx/issues/437). + +::: + +### Platforms + +Supported platforms are: + +| Platform | Description | +| :--------------- | :-------------------------------------------- | +| darwin | MacOS + architecture of build machine | +| darwin/amd64 | MacOS 10.13+ AMD64 | +| darwin/arm64 | MacOS 11.0+ ARM64 | +| darwin/universal | MacOS AMD64+ARM64 universal application | +| windows | Windows 10/11 + architecture of build machine | +| windows/amd64 | Windows 10/11 AMD64 | +| windows/arm64 | Windows 10/11 ARM64 | +| linux | Linux + architecture of build machine | +| linux/amd64 | Linux AMD64 | +| linux/arm64 | Linux ARM64 | + +## doctor + +`wails doctor` will run diagnostics to ensure that your system is ready for development. + +Example: + +``` +Wails CLI v2.0.0-beta + +Scanning system - Please wait (this may take a long time)...Done. + +System +------ +OS: Windows 10 Pro +Version: 2009 (Build: 19043) +ID: 21H1 +Go Version: go1.17 +Platform: windows +Architecture: amd64 + +Dependency Package Name Status Version +---------- ------------ ------ ------- +WebView2 N/A Installed 93.0.961.52 +npm N/A Installed 6.14.15 +*upx N/A Installed upx 3.96 + +* - Optional Dependency + +Diagnosis +--------- +Your system is ready for Wails development! + +``` + +## dev + +`wails dev` is used to run your application in a "live development" mode. This means: + +- The application's `go.mod` will be updated to use the same version of Wails as the CLI +- The application is compiled and run automatically +- A watcher is started and will trigger a rebuild of your dev app if it detects changes to your go files +- A webserver is started on `http://localhost:34115` which serves your application (not just frontend) over http. This allows you to use your favourite browser development extensions +- All application assets are loaded from disk. If they are changed, the application will automatically reload (not rebuild). All connected browsers will also reload +- A JS module is generated that provides the following: + - Javascript wrappers of your Go methods with autogenerated JSDoc, providing code hinting + - TypeScript versions of your Go structs, that can be constructed and passed to your go methods +- A second JS module is generated that provides a wrapper + TS declaration for the runtime + +| Flag | Description | Default | +| :--------------------------- | :---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | :-------------------- | +| -assetdir "./path/to/assets" | Serve assets from the given directory instead of using the provided asset FS | Value in `wails.json` | +| -browser | Opens a browser to `http://localhost:34115` on startup | | +| -compiler "compiler" | Use a different go compiler to build, eg go1.15beta1 | go | +| -e | Extensions to trigger rebuilds (comma separated) | go | +| -reloaddirs | Additional directories to trigger reloads (comma separated) | Value in `wails.json` | +| -ldflags "flags" | Additional ldflags to pass to the compiler | | +| -tags "extra tags" | Build tags to pass to compiler (quoted and space separated) | | +| -loglevel "loglevel" | Loglevel to use - Trace, Debug, Info, Warning, Error | Debug | +| -noreload | Disable automatic reload when assets change | | +| -nogen | Disable generate module | | +| -v | Verbosity level (0 - silent, 1 - standard, 2 - verbose) | 1 | +| -wailsjsdir | The directory to generate the generated Wails JS modules | Value in `wails.json` | +| -debounce | The time to wait for reload after an asset change is detected | 100 (milliseconds) | +| -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 | | +| -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: + +`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. + +## 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. diff --git a/website/versioned_docs/version-v2.0.0-rc.1/reference/menus.mdx b/website/versioned_docs/version-v2.0.0-rc.1/reference/menus.mdx new file mode 100644 index 000000000..608b392bb --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-rc.1/reference/menus.mdx @@ -0,0 +1,271 @@ +--- +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 + AppMenu := menu.NewMenu() + FileMenu := AppMenu.AddSubmenu("File") + FileMenu.AddText("&Open", keys.CmdOrCtrl("o"), openFile) + FileMenu.AddSeparator() + FileMenu.AddText("Quit", keys.CmdOrCtrl("q"), func(_ *menu.CallbackData) { + runtime.Quit() + }) + + if runtime.GOOS == "darwin" { + AppMenu.Append(menu.EditMenu()) // on macos platform, we should append EditMenu to enable Cmd+C,Cmd+V,Cmd+Z... shortcut + } + + err := wails.Run(&options.App{ + Title: "Menus Demo", + Width: 800, + Height: 600, + Menu: AppMenu, + 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` +- `tab` +- `return` +- `enter` +- `escape` +- `left` +- `right` +- `up` +- `down` +- `space` +- `delete` +- `home` +- `end` +- `page up` +- `page down` +- `f1` +- `f2` +- `f3` +- `f4` +- `f5` +- `f6` +- `f7` +- `f8` +- `f9` +- `f10` +- `f11` +- `f12` +- `f13` +- `f14` +- `f15` +- `f16` +- `f17` +- `f18` +- `f19` +- `f20` +- `f21` +- `f22` +- `f23` +- `f24` +- `f25` +- `f26` +- `f27` +- `f28` +- `f29` +- `f30` +- `f31` +- `f32` +- `f33` +- `f34` +- `f35` +- `numlock` + +Wails also supports parsing accelerators using the same syntax as Electron. This is useful for storing accelerators in +config files. + +Example: + +```go title="Package: github.com/wailsapp/wails/v2/pkg/menu/keys" + // Defines cmd+o on Mac and ctrl-o on Window/Linux + myShortcut, err := keys.Parse("Ctrl+Option+A") +``` + +#### Modifier + +The following modifiers are keys that may be used in combination with the accelerator key: + +```go title="Package: github.com/wailsapp/wails/v2/pkg/menu/keys" +const ( + // CmdOrCtrlKey represents Command on Mac and Control on other platforms + CmdOrCtrlKey Modifier = "cmdorctrl" + // OptionOrAltKey represents Option on Mac and Alt on other platforms + OptionOrAltKey Modifier = "optionoralt" + // ShiftKey represents the shift key on all systems + ShiftKey Modifier = "shift" + // ControlKey represents the control key on all systems + ControlKey Modifier = "ctrl" +) +``` + +A number of helper methods are available to create Accelerators using modifiers: + +```go title="Package: github.com/wailsapp/wails/v2/pkg/menu/keys" +func CmdOrCtrl(key string) *Accelerator +func OptionOrAlt(key string) *Accelerator +func Shift(key string) *Accelerator +func Control(key string) *Accelerator +``` + +Modifiers can be combined using `keys.Combo(key string, modifier1 Modifier, modifier2 Modifier, rest ...Modifier)`: + +```go title="Package: github.com/wailsapp/wails/v2/pkg/menu/keys" + // Defines "Ctrl+Option+A" on Mac and "Ctrl+Alt+A" on Window/Linux + myShortcut := keys.Combo("a", ControlKey, OptionOrAltKey) +``` + +### Type + +Each menu item must have a type and there are 5 types available: + +```go title="Package: github.com/wailsapp/wails/v2/pkg/menu" +const ( + TextType Type = "Text" + SeparatorType Type = "Separator" + SubmenuType Type = "Submenu" + CheckboxType Type = "Checkbox" + RadioType Type = "Radio" +) +``` + +For convenience, helper methods are provided to quickly create a menu item: + +```go title="Package: github.com/wailsapp/wails/v2/pkg/menu" +func Text(label string, accelerator *keys.Accelerator, click Callback) *MenuItem +func Separator() *MenuItem +func Radio(label string, selected bool, accelerator *keys.Accelerator, click Callback) *MenuItem +func Checkbox(label string, checked bool, accelerator *keys.Accelerator, click Callback) *MenuItem +func SubMenu(label string, menu *Menu) *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()` | diff --git a/website/versioned_docs/version-v2.0.0-rc.1/reference/options.mdx b/website/versioned_docs/version-v2.0.0-rc.1/reference/options.mdx new file mode 100644 index 000000000..5371ed964 --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-rc.1/reference/options.mdx @@ -0,0 +1,668 @@ +--- +sidebar_position: 3 +--- + +# Options + +## Application Options + +The `Options.App` struct contains the application configuration. +It is passed to the `wails.Run()` method: + +```go title="Example" +import "github.com/wailsapp/wails/v2/pkg/options" + +func main() { + + err := wails.Run(&options.App{ + Title: "Menus Demo", + Width: 800, + Height: 600, + DisableResize: false, + Fullscreen: false, + Frameless: true, + MinWidth: 400, + MinHeight: 400, + MaxWidth: 1280, + MaxHeight: 1024, + StartHidden: false, + HideWindowOnClose: false, + BackgroundColour: &options.RGBA{R: 0, G: 0, B: 0, A: 255}, + AlwaysOnTop: false, + Assets: assets, + AssetsHandler: assetsHandler, + Menu: app.applicationMenu(), + Logger: nil, + LogLevel: logger.DEBUG, + LogLevelProduction: logger.ERROR, + OnStartup: app.startup, + OnDomReady: app.domready, + OnShutdown: app.shutdown, + OnBeforeClose: app.beforeClose, + WindowStartState: options.Maximised, + CSSDragProperty: "--wails-draggable", + CSSDragValue: "drag", + Bind: []interface{}{ + app, + }, + Windows: &windows.Options{ + WebviewIsTransparent: false, + WindowIsTranslucent: 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), + }, + // User messages that can be customised + Messages *windows.Messages + }, + Mac: &mac.Options{ + TitleBar: &mac.TitleBar{ + TitlebarAppearsTransparent: true, + HideTitle: false, + HideTitleBar: false, + FullSizeContent: false, + UseToolbar: false, + HideToolbarSeparator: true, + }, + Appearance: mac.NSAppearanceNameDarkAqua, + WebviewIsTransparent: true, + WindowIsTranslucent: false, + About: &mac.AboutInfo{ + Title: "My Application", + Message: "© 2021 Me", + Icon: icon, + }, + }, + Linux: &linux.Options{ + Icon: icon, + }, + }) + if err != nil { + log.Fatal(err) + } +} + +``` + +### Title + +The text shown in the window's title bar. + +Type: `string` + +### Width + +The initial width of the window. + +Type: `int`
+Default: 1024. + +### Height + +The initial height of the window. + +Type: `int`
+Default: 768 + +### DisableResize + +By default, the main window is resizable. Setting this to `true` will keep it a fixed size. + +Type: `bool` + +### Fullscreen + +Setting this to `true` will make the window fullscreen at startup. + +Type: `bool` + +### Frameless + +When set to `true`, the window will have no borders or title bar. +Also see [Frameless Windows](../guides/frameless.mdx). + +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. + +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. + +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. + +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. + +Type: `int` + +### StartHidden + +When set to `true`, the application will be hidden until [WindowShow](../reference/runtime/window.mdx#windowshow) +is called. + +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. + +Type: `bool` + +### BackgroundColour + +This value is the default background colour of the window. +Example: options.NewRGBA(255,0,0,128) - Red at 50% transparency + +Type: `*options.RGBA`
+Default: white + +### AlwaysOnTop + +Indicates that the window should stay above other windows when losing focus. + +Type: `bool` + +### Assets + +The frontend assets to be used by the application. Requires an `index.html` file. + +Type: `embed.FS` + +### AssetsHandler + + + +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. + +| Value | 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. + +Type: `http.Handler` + +### 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. +::: + +Type: `*menu.Menu` + +### Logger + +The logger to be used by the application. More details about logging in the [Log Reference](../reference/runtime/log.mdx). + +Type: `logger.Logger`
+Default: Logs to Stdout + +### LogLevel + +The default log level. More details about logging in the [Log Reference](../reference/runtime/log.mdx). + +Type: `logger.LogLevel`
+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). + +Type: `logger.LogLevel`
+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. + +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. + +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. + +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{ + Title: "Quit?", + Message: "Are you sure you want to quit?", + + Type: ` runtime`.QuestionDialog, + + }) + + if err != nil { + return false + } + return dialog != "Yes" +} +``` + +Type: `func(ctx context.Context) bool` + +### WindowStartState + +Defines how the window should present itself at startup. + +| Value | Win | Mac | Lin | +| ---------- | --- | --- | --- | +| Fullscreen | ✅ | ✅ | ✅ | +| Maximised | ✅ | ✅ | ✅ | +| Minimised | ✅ | ❌ | ✅ | + +Type: `options.WindowStartState` + +### CSSDragProperty + +Indicates the CSS property to use to identify which elements can be used to drag the window. Default: `--wails-draggable`. + +Type: `string` + +### CSSDragValue + +Indicates what value the `CSSDragProperty` style should have to drag the window. Default: `drag`. + +Type: `string` + +### Bind + +A slice of struct instances defining methods that need to be bound to the frontend. + +Type: `[]interface{}` + +### Windows + +This defines [Windows specific options](#windows-specific-options). + +Type: `*windows.Options` + +### Mac + +This defines [Mac specific options](#mac-specific-options). + +Type: `*mac.Options` + +### Linux + +This defines [Linux specific options](#linux-specific-options). + +Type: `*linux.Options` + +## Windows Specific 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. + +Type: `bool` + +### WindowIsTranslucent + +Setting this to `true` will make the window background translucent. Often combined +with [WebviewIsTransparent](#WebviewIsTransparent) to make frosty-looking applications. + +Type: `bool` + +### DisableWindowIcon + +Setting this to `true` will remove the icon in the top left corner of the title bar. + +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. + +Type: `bool` + +### WebviewUserDataPath + +This defines the path where the WebView2 stores the user data. If empty `%APPDATA%\[BinaryName.exe]` will be used. + +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) + +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 | + +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. + +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. + +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. + +Type: `uint16` + +### OnSuspend + +If set, this function will be called when windows initiates a switch to low power mode (suspend/hibernate) + +Type: `func()` + +### OnResume + +If set, this function will be called when windows resumes from low power mode (suspend/hibernate) + +Type: `func()` + +## Mac Specific Options + +### TitleBar + +The TitleBar struct provides the ability to configure the look and feel of the title bar. + +Type: [`*mac.TitleBar`](#titlebar-struct) + + +### 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. + +Type: [`AppearanceType`](#appearance-type) + +### 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. + +Type: `bool` + +### WindowIsTranslucent + +Setting this to `true` will make the window background translucent. Often combined +with [WebviewIsTransparent](#WebviewIsTransparent) to make frosty-looking applications. + +Type: `bool` + +### 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. + +Type: [`About`](#about-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 type + +You can specify the application's [appearance](https://developer.apple.com/documentation/appkit/nsappearance?language=objc). + +| Value | Description | +| ----------------------------------------------------- | --------------------------------------------------------------- | +| DefaultAppearance | DefaultAppearance uses the default system value | +| NSAppearanceNameAqua | The standard light system appearance | +| NSAppearanceNameDarkAqua | The standard dark system appearance | +| NSAppearanceNameVibrantLight | The light vibrant appearance | +| NSAppearanceNameAccessibilityHighContrastAqua | A high-contrast version of the standard light system appearance | +| NSAppearanceNameAccessibilityHighContrastDarkAqua | A high-contrast version of the standard dark system appearance | +| NSAppearanceNameAccessibilityHighContrastVibrantLight | A high-contrast version of the light vibrant appearance | +| NSAppearanceNameAccessibilityHighContrastVibrantDark | A high-contrast version of the dark vibrant appearance | + +Example: + +```go +Mac: &mac.Options{ + Appearance: mac.NSAppearanceNameDarkAqua, +} +``` + +#### About struct + +```go +type AboutInfo struct { + Title string + Message string + Icon []byte +} +``` + +If these settings are provided, an "About" menu item will appear in the app menu (when using the `AppMenu` role). +Given this configuration: + +```go +//go:embed build/appicon.png +var icon []byte + +func main() { + err := wails.Run(&options.App{ + ... + Mac: &mac.Options{ + About: &mac.AboutInfo{ + Title: "My Application", + Message: "© 2021 Me", + Icon: icon, + }, + }, + }) +``` + +The "About" menu item will appear in the app menu: + +
+ +
+
+ +When clicked, that will open an about message box: + +
+ +
+
+ +## Linux Specific Options + +### Icon + +Sets up the icon representing the window. This icon is used when the window is minimized (also known as iconified). + +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. diff --git a/website/versioned_docs/version-v2.0.0-rc.1/reference/project-config.mdx b/website/versioned_docs/version-v2.0.0-rc.1/reference/project-config.mdx new file mode 100644 index 000000000..7a243da9e --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-rc.1/reference/project-config.mdx @@ -0,0 +1,54 @@ +--- +sidebar_position: 5 +--- + +# Project Config + +The project config resides in the `wails.json` file in the project directory. The structure of the config is: + +```json +{ + "name": "[The project name]", + "assetdir": "[Relative path to the directory containing the compiled assets, this is normally inferred and could be left empty]", + "reloaddirs": "[Additional directories to trigger reloads (comma separated), this is only used for some advanced asset configurations]", + "frontend:install": "[The command to install node dependencies, run in the frontend directory - often `npm install`]", + "frontend:build": "[The command to build the assets, run in the frontend directory - often `npm run build`]", + "frontend:dev": "[This command has been replaced by frontend:dev:build. If frontend:dev:build is not specified will falls back to this command. If this command is also not specified will falls back to frontend:build]", + "frontend:dev:build": "[This command is the dev equivalent of frontend:build. If not specified falls back to frontend:dev]", + "frontend:dev:install": "[This command is the dev equivalent of frontend:install. If not specified falls back to frontend:install]", + "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. 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]", + "debounceMS": 100, // The default time the dev server waits to reload when it detects a change in assets + "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.]", + "*/*": "[The command that will be executed after every build: ${platform} is replaced with the "GOOS/GOARCH" and ${bin} with the path to the compiled binary.]" + }, + "info": { // Data used to populate manifests and version info. + "companyName": "[The company name. Default: [The project name]]", + "productName": "[The product name. Default: [The project name]]", + "productVersion": "[The version of the product. Default: '1.0.0']", + "copyright": "[The copyright of the product. Default: 'Copyright.........']", + "comments": "[A short comment of the app. Default: 'Built using Wails (https://wails.app)']" + }, + "nsisType": "['multiple': One installer per architecture. 'single': Single universal installer for all architectures being built. Default: 'multiple']", + "obfuscated": "[Whether the app should be obfuscated. Default: false]", + "garbleargs": "[The arguments to pass to the garble command when using the obfuscated flag]" +} +``` + +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. diff --git a/website/versioned_docs/version-v2.0.0-rc.1/reference/runtime/_category_.json b/website/versioned_docs/version-v2.0.0-rc.1/reference/runtime/_category_.json new file mode 100644 index 000000000..ac6d55488 --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-rc.1/reference/runtime/_category_.json @@ -0,0 +1,4 @@ +{ + "label": "Runtime", + "position": 1 +} diff --git a/website/versioned_docs/version-v2.0.0-rc.1/reference/runtime/browser.mdx b/website/versioned_docs/version-v2.0.0-rc.1/reference/runtime/browser.mdx new file mode 100644 index 000000000..263c5897c --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-rc.1/reference/runtime/browser.mdx @@ -0,0 +1,15 @@ +--- +sidebar_position: 7 +--- + +# Browser + +These methods are related to the system browser. + +### BrowserOpenURL + +Opens the given URL in the system browser. + +Go: `BrowserOpenURL(ctx context.Context, url string)`
+JS: `BrowserOpenURL(url string)` + diff --git a/website/versioned_docs/version-v2.0.0-rc.1/reference/runtime/dialog.mdx b/website/versioned_docs/version-v2.0.0-rc.1/reference/runtime/dialog.mdx new file mode 100644 index 000000000..5f679b1b2 --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-rc.1/reference/runtime/dialog.mdx @@ -0,0 +1,284 @@ +--- +sidebar_position: 5 +--- + +# Dialog + +This part of the runtime provides access to native dialogs, such as File Selectors and Message boxes. + +:::info Javascript +Dialog is currently unsupported in the JS runtime. +::: + +### OpenDirectoryDialog + +Opens a dialog that prompts the user to select a directory. Can be customised using [OpenDialogOptions](#opendialogoptions). + +Go: `OpenDirectoryDialog(ctx context.Context, dialogOptions OpenDialogOptions) (string, error)` + +Returns: Selected directory (blank if the user cancelled) or an error + +### OpenFileDialog + +Opens a dialog that prompts the user to select a file. Can be customised using [OpenDialogOptions](#opendialogoptions). + +Go: `OpenFileDialog(ctx context.Context, dialogOptions OpenDialogOptions) (string, error)` + +Returns: Selected file (blank if the user cancelled) or an error + +### OpenMultipleFilesDialog + +Opens a dialog that prompts the user to select multiple files. Can be customised using [OpenDialogOptions](#opendialogoptions). + +Go: `OpenMultipleFilesDialog(ctx context.Context, dialogOptions OpenDialogOptions) ([]string, error)` + +Returns: Selected files (nil if the user cancelled) or an error + +### SaveFileDialog + +Opens a dialog that prompts the user to select a filename for the purposes of saving. Can be customised using [SaveDialogOptions](#savedialogoptions). + +Go: `SaveFileDialog(ctx context.Context, dialogOptions SaveDialogOptions) (string, error)` + +Returns: The selected file (blank if the user cancelled) or an error + +### MessageDialog + +Displays a message using a message dialog. Can be customised using [MessageDialogOptions](#messagedialogoptions). + +Go: `MessageDialog(ctx context.Context, dialogOptions MessageDialogOptions) (string, error)` + +Returns: The text of the selected button or an error + +## Options + +### OpenDialogOptions + +```go +type OpenDialogOptions struct { + DefaultDirectory string + DefaultFilename string + Title string + Filters []FileFilter + ShowHiddenFiles bool + CanCreateDirectories bool + ResolvesAliases bool + TreatPackagesAsDirectories bool +} +``` + +| Field | Description | Win | Mac | Lin | +| -------------------------- | ---------------------------------------------- | --- | --- | --- | +| DefaultDirectory | The directory the dialog will show when opened | ✅ | ✅ | ✅ | +| DefaultFilename | The default filename | ✅ | ✅ | ✅ | +| Title | Title for the dialog | ✅ | ✅ | ✅ | +| [Filters](#filefilter) | A list of file filters | ✅ | ✅ | ✅ | +| ShowHiddenFiles | Show files hidden by the system | | ✅ | ✅ | +| CanCreateDirectories | Allow user to create directories | | ✅ | | +| ResolvesAliases | If true, returns the file not the alias | | ✅ | | +| TreatPackagesAsDirectories | Allow navigating into packages | | ✅ | | + +### SaveDialogOptions + +```go +type SaveDialogOptions struct { + DefaultDirectory string + DefaultFilename string + Title string + Filters []FileFilter + ShowHiddenFiles bool + CanCreateDirectories bool + TreatPackagesAsDirectories bool +} +``` + +| Field | Description | Win | Mac | Lin | +| -------------------------- | ---------------------------------------------- | --- | --- | --- | +| DefaultDirectory | The directory the dialog will show when opened | ✅ | ✅ | ✅ | +| DefaultFilename | The default filename | ✅ | ✅ | ✅ | +| Title | Title for the dialog | ✅ | ✅ | ✅ | +| [Filters](#filefilter) | A list of file filters | ✅ | ✅ | ✅ | +| ShowHiddenFiles | Show files hidden by the system | | ✅ | ✅ | +| CanCreateDirectories | Allow user to create directories | | ✅ | | +| TreatPackagesAsDirectories | Allow navigating into packages | | ✅ | | + +### MessageDialogOptions + +```go +type MessageDialogOptions struct { + Type DialogType + Title string + Message string + Buttons []string + DefaultButton string + CancelButton string +} +``` + +| Field | Description | Win | Mac | Lin | +| ------------- | ------------------------------------------------------------------------- | --- | --- | --- | +| Type | The type of message dialog, eg question, info... | ✅ | ✅ | ✅ | +| Title | Title for the dialog | ✅ | ✅ | ✅ | +| Message | The message to show the user | ✅ | ✅ | ✅ | +| Buttons | A list of button titles | | ✅ | | +| DefaultButton | The button with this text should be treated as default. Bound to `return` | | ✅ | | +| CancelButton | The button with this text should be treated as cancel. Bound to `escape` | | ✅ | | + +#### Windows + +Windows has standard dialog types in which the buttons are not customisable. +The value returned will be one of: "Ok", "Cancel", "Abort", "Retry", "Ignore", "Yes", "No", "Try Again" or "Continue" + +#### Linux + +Linux has standard dialog types in which the buttons are not customisable. +The value returned will be one of: "Ok", "Cancel", "Yes", "No" + +#### Mac + +A message dialog on Mac may specify up to 4 buttons. If no `DefaultButton` or `CancelButton` is given, the first button +is considered default and is bound to the `return` key. + +For the following code: + +```go +selection, err := runtime.MessageDialog(b.ctx, runtime.MessageDialogOptions{ + Title: "It's your turn!", + Message: "Select a number", + Buttons: []string{"one", "two", "three", "four"}, +}) +``` + +the first button is shown as default: + +
+ +
+
+ +And if we specify `DefaultButton` to be "two": + +```go +selection, err := runtime.MessageDialog(b.ctx, runtime.MessageDialogOptions{ + Title: "It's your turn!", + Message: "Select a number", + Buttons: []string{"one", "two", "three", "four"}, + DefaultButton: "two", +}) +``` + +the second button is shown as default. When `return` is pressed, the value "two" is returned. + +
+ +
+
+ +If we now specify `CancelButton` to be "three": + +```go +selection, err := runtime.MessageDialog(b.ctx, runtime.MessageDialogOptions{ + Title: "It's your turn!", + Message: "Select a number", + Buttons: []string{"one", "two", "three", "four"}, + DefaultButton: "two", + CancelButton: "three", +}) +``` + +the button with "three" is shown at the bottom of the dialog. When `escape` is pressed, the value "three" is returned: + +
+ +
+
+
+
+ +#### DialogType + +```go +const ( + InfoDialog DialogType = "info" + WarningDialog DialogType = "warning" + ErrorDialog DialogType = "error" + QuestionDialog DialogType = "question" + ) +``` + +### FileFilter + +```go +type FileFilter struct { + DisplayName string // Filter information EG: "Image Files (*.jpg, *.png)" + Pattern string // semi-colon separated list of extensions, EG: "*.jpg;*.png" +} +``` + +#### Windows + +Windows allows you to use multiple file filters in dialog boxes. Each FileFilter will show up as a separate entry in the +dialog: + +
+ +
+
+
+
+ +#### Linux + +Linux allows you to use multiple file filters in dialog boxes. Each FileFilter will show up as a separate entry in the +dialog: + +
+ +
+
+
+
+ +#### Mac + +Mac dialogs only have the concept of a single set of patterns to filter files. If multiple FileFilters are provided, +Wails will use all the Patterns defined. + +Example: + +```go + selection, err := runtime.OpenFileDialog(b.ctx, runtime.OpenDialogOptions{ + Title: "Select File", + Filters: []runtime.FileFilter{ + { + DisplayName: "Images (*.png;*.jpg)", + Pattern: "*.png;*.jpg", + }, { + DisplayName: "Videos (*.mov;*.mp4)", + Pattern: "*.mov;*.mp4", + }, + }, + }) +``` + +This will result in the Open File dialog using `*.png,*.jpg,*.mov,*.mp4` as a filter. diff --git a/website/versioned_docs/version-v2.0.0-rc.1/reference/runtime/events.mdx b/website/versioned_docs/version-v2.0.0-rc.1/reference/runtime/events.mdx new file mode 100644 index 000000000..6fc64cf47 --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-rc.1/reference/runtime/events.mdx @@ -0,0 +1,45 @@ +--- +sidebar_position: 2 +--- + +# Events + +The Wails runtime provides a unified events system, where events can be emitted or received by either Go or Javascript. +Optionally, data may be passed with the events. Listeners will receive the data in the local data types. + +### EventsOn + +This method sets up a listener for the given event name. When an event of type `eventName` is [emitted](#EventsEmit), +the callback is triggered. Any additional data sent with the emitted event will be passed to the callback. + +Go: `EventsOn(ctx context.Context, eventName string, callback func(optionalData ...interface{}))`
+JS: `EventsOn(eventName string, callback function(optionalData?: any))` + +### EventsOff + +This method unregisters the listener for the given event name, optionally multiple listeneres can be unregistered via `additionalEventNames`. + +Go: `EventsOff(ctx context.Context, eventName string, additionalEventNames ...string)`
+JS: `EventsOff(eventName string, ...additionalEventNames)` + +### EventsOnce + +This method sets up a listener for the given event name, but will only trigger once. + +Go: `EventsOnce(ctx context.Context, eventName string, callback func(optionalData ...interface{}))`
+JS: `EventsOnce(eventName string, callback function(optionalData?: any))` + +### EventsOnMultiple + +This method sets up a listener for the given event name, but will only trigger a maximum of `counter` times. + +Go: `EventsOnMultiple(ctx context.Context, eventName string, callback func(optionalData ...interface{}), counter int)`
+JS: `EventsOnMultiple(eventName string, callback function(optionalData?: any), counter int)` + +### EventsEmit + +This method emits the given event. Optional data may be passed with the event. This will trigger any event listeners. + +Go: `EventsEmit(ctx context.Context, eventName string, optionalData ...interface{})`
+JS: `EventsEmit(ctx context, optionalData function(optionalData?: any))` + diff --git a/website/versioned_docs/version-v2.0.0-rc.1/reference/runtime/intro.mdx b/website/versioned_docs/version-v2.0.0-rc.1/reference/runtime/intro.mdx new file mode 100644 index 000000000..4310bab57 --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-rc.1/reference/runtime/intro.mdx @@ -0,0 +1,92 @@ +--- +sidebar_position: 1 +--- + +# Introduction + +The runtime is a library that provides utility methods for your application. There is both a Go and Javascript runtime +and the aim is to try and keep them at parity where possible. + +It has utility methods for: + +- [Window](window.mdx) +- [Menu](menu.mdx) +- [Dialog](dialog.mdx) +- [Events](events.mdx) +- [Browser](browser.mdx) +- [Log](log.mdx) + +The Go Runtime is available through importing `github.com/wailsapp/wails/v2/pkg/runtime`. All methods in this package +take a context as the first parameter. This context should be obtained from the [OnStartup](../options.mdx#onstartup) +or [OnDomReady](../options.mdx#ondomready) hooks. + +:::info Note + +Whilst the context will be provided to the +[OnStartup](../options.mdx#onstartup) method, there's no guarantee the runtime will work in this method as +the window is initialising in a different thread. If +you wish to call runtime methods at startup, use [OnDomReady](../options.mdx#ondomready). + +::: + +The Javascript library is available to the frontend via the `window.runtime` map. There is a runtime package generated when using `dev` +mode that provides Typescript declarations for the runtime. This should be located in the `wailsjs` directory in your +frontend directory. + +### Hide + +Go: `Hide(ctx context.Context)`
+JS: `Hide()` + +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 + +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`. +::: + +Go: `Show(ctx context.Context)`
+JS: `Show()` + +### Quit + +Quits the application. + +Go: `Quit(ctx context.Context)`
+JS: `Quit()` + +### Environment + +Returns details of the current environment. + +Go: `Environment(ctx context.Context) EnvironmentInfo`
+JS: `Environment(): Promise` + +#### EnvironmentInfo + +Go: +```go +type EnvironmentInfo struct { + BuildType string + Platform string + Arch string +} +``` +JS: +```ts +interface EnvironmentInfo { + buildType: string; + platform: string; + arch: string; +} +``` diff --git a/website/versioned_docs/version-v2.0.0-rc.1/reference/runtime/log.mdx b/website/versioned_docs/version-v2.0.0-rc.1/reference/runtime/log.mdx new file mode 100644 index 000000000..d38ee9526 --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-rc.1/reference/runtime/log.mdx @@ -0,0 +1,142 @@ +--- +sidebar_position: 3 +--- + +# Log + +The Wails runtime provides a logging mechanism that may be called from Go or Javascript. Like most +loggers, there are a number of log levels: + +- Trace +- Debug +- Info +- Warning +- Error +- Fatal + +The logger will output any log message at the current, or higher, log level. Example: The `Debug` log +level will output all messages except `Trace` messages. + +### LogPrint + +Logs the given message as a raw message. + +Go: `LogPrint(ctx context.Context, message string)`
+JS: `LogPrint(message: string)` + +### LogPrintf + +Logs the given message as a raw message. + +Go: `LogPrintf(ctx context.Context, format string, args ...interface{})`
+ +### LogTrace + +Logs the given message at the `Trace` log level. + +Go: `LogTrace(ctx context.Context, message string)`
+JS: `LogTrace(message: string)` + +### LogTracef + +Logs the given message at the `Trace` log level. + +Go: `LogTracef(ctx context.Context, format string, args ...interface{})`
+ +### LogDebug + +Logs the given message at the `Debug` log level. + +Go: `LogDebug(ctx context.Context, message string)`
+JS: `LogDebug(message: string)` + +### LogDebugf + +Logs the given message at the `Debug` log level. + +Go: `LogDebugf(ctx context.Context, format string, args ...interface{})`
+ +### LogInfo + +Logs the given message at the `Info` log level. + +Go: `LogInfo(ctx context.Context, message string)`
+JS: `LogInfo(message: string)` + +### LogInfof + +Logs the given message at the `Info` log level. + +Go: `LogInfof(ctx context.Context, format string, args ...interface{})`
+ +### LogWarning + +Logs the given message at the `Warning` log level. + +Go: `LogWarning(ctx context.Context, message string)`
+JS: `LogWarning(message: string)` + +### LogWarningf + +Logs the given message at the `Warning` log level. + +Go: `LogWarningf(ctx context.Context, format string, args ...interface{})`
+ +### LogError + +Logs the given message at the `Error` log level. + +Go: `LogError(ctx context.Context, message string)`
+JS: `LogError(message: string)` + +### LogErrorf + +Logs the given message at the `Error` log level. + +Go: `LogErrorf(ctx context.Context, format string, args ...interface{})`
+ +### LogFatal + +Logs the given message at the `Fatal` log level. + +Go: `LogFatal(ctx context.Context, message string)`
+JS: `LogFatal(message: string)` + +### LogFatalf + +Logs the given message at the `Fatal` log level. + +Go: `LogFatalf(ctx context.Context, format string, args ...interface{})`
+ +### LogSetLogLevel + +Sets the log level. In Javascript, the number relates to the following log levels: + +| Value | Log Level | +| ----- | --------- | +| 1 | Trace | +| 2 | Debug | +| 3 | Info | +| 4 | Warning | +| 5 | Error | + +Go: `LogSetLogLevel(ctx context.Context, level logger.LogLevel)`
+JS: `LogSetLogLevel(level: number)` + +## Using a Custom Logger + +A custom logger may be used by providing it using the [Logger](../options.mdx#logger) +application option. The only requirement is that the logger implements the `logger.Logger` interface +defined in `github.com/wailsapp/wails/v2/pkg/logger`: + +```go title="logger.go" +type Logger interface { + Print(message string) + Trace(message string) + Debug(message string) + Info(message string) + Warning(message string) + Error(message string) + Fatal(message string) +} +``` diff --git a/website/versioned_docs/version-v2.0.0-rc.1/reference/runtime/menu.mdx b/website/versioned_docs/version-v2.0.0-rc.1/reference/runtime/menu.mdx new file mode 100644 index 000000000..6a7e06cf9 --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-rc.1/reference/runtime/menu.mdx @@ -0,0 +1,23 @@ +--- +sidebar_position: 6 +--- + +# Menu + +These methods are related to the application menu. + +:::info Javascript +Menu is currently unsupported in the JS runtime. +::: + +### MenuSetApplicationMenu + +Sets the application menu to the given [menu](../menus.mdx). + +Go: `MenuSetApplicationMenu(ctx context.Context, menu *menu.Menu)` + +### MenuUpdateApplicationMenu + +Updates the application menu, picking up any changes to the menu passed to `MenuSetApplicationMenu`. + +Go: `MenuUpdateApplicationMenu(ctx context.Context)` diff --git a/website/versioned_docs/version-v2.0.0-rc.1/reference/runtime/window.mdx b/website/versioned_docs/version-v2.0.0-rc.1/reference/runtime/window.mdx new file mode 100644 index 000000000..3ddceea4c --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-rc.1/reference/runtime/window.mdx @@ -0,0 +1,243 @@ +--- +sidebar_position: 4 +--- + +# Window + +These methods give control of the application window. + +### WindowSetTitle + +Sets the text in the window title bar. + +Go: `WindowSetTitle(ctx context.Context, title string)`
+JS: `WindowSetTitle(title: string)` + +### WindowFullscreen + +Makes the window full screen. + +Go: `WindowFullscreen(ctx context.Context)`
+JS: `WindowFullscreen()` + +### WindowUnfullscreen + +Restores the previous window dimensions and position prior to full screen. + +Go: `WindowUnfullscreen(ctx context.Context)`
+JS: `WindowUnfullscreen()` + +### WindowIsFullscreen + +Returns true if the window is full screen. + +Go: `WindowIsFullscreen(ctx context.Context) bool` +JS: `WindowIsFullscreen() bool` + +### WindowCenter + +Centers the window on the monitor the window is currently on. + +Go: `WindowCenter(ctx context.Context)`
+JS: `WindowCenter()` + +### WindowReload + +Performs a "reload" (Reloads current page). + +Go: `WindowReload(ctx context.Context)`
+JS: `WindowReload()` + +### WindowReloadApp + +Reloads the application frontend. + +Go: `WindowReloadApp(ctx context.Context)`
+JS: `WindowReloadApp()` + +### WindowSetSystemDefaultTheme + +Windows only. + +Go: `WindowSetSystemDefaultTheme(ctx context.Context)`
+JS: `WindowSetSystemDefaultTheme()` + +Sets window theme to system default (dark/light). + +### WindowSetLightTheme + +Windows only. + +Go: `WindowSetLightTheme(ctx context.Context)`
+JS: `WindowSetLightTheme()` + +Sets window theme to light. + +### WindowSetDarkTheme + +Windows only. + +Go: `WindowSetDarkTheme(ctx context.Context)`
+JS: `WindowSetDarkTheme()` + +Sets window theme to dark. + +### WindowShow + +Shows the window, if it is currently hidden. + +Go: `WindowShow(ctx context.Context)`
+JS: `WindowShow()` + +### WindowHide + +Hides the window, if it is currently visible. + +Go: `WindowHide(ctx context.Context)`
+JS: `WindowHide()` + +### WindowIsNormal + +Returns true if the window not minimised, maximised or fullscreen. + +Go: `WindowIsNormal(ctx context.Context) bool` +JS: `WindowIsNormal() bool` + +### WindowSetSize + +Sets the width and height of the window. + +Go: `WindowSetSize(ctx context.Context, width int, height int)`
+JS: `WindowSetSize(size: Size)` + +### WindowGetSize + +Gets the width and height of the window. + +Go: `WindowGetSize(ctx context.Context) (width int, height int)`
+JS: `WindowGetSize() : Size` + +### WindowSetMinSize + +Sets the minimum window size. +Will resize the window if the window is currently smaller than the given dimensions. + +Setting a size of `0,0` will disable this constraint. + +Go: `WindowSetMinSize(ctx context.Context, width int, height int)`
+JS: `WindowSetMinSize(size: Size)` + +### WindowSetMaxSize + +Sets the maximum window size. +Will resize the window if the window is currently larger than the given dimensions. + +Setting a size of `0,0` will disable this constraint. + +Go: `WindowSetMaxSize(ctx context.Context, width int, height int)`
+JS: `WindowSetMaxSize(size: Size)` + +### WindowSetAlwaysOnTop + +Sets the window AlwaysOnTop or not on top. + +Go: `WindowSetAlwaysOnTop(ctx context.Context, b bool)`
+JS: `WindowSetAlwaysOnTop(b: Boolen)` + +### WindowSetPosition + +Sets the window position relative to the monitor the window is currently on. + +Go: `WindowSetPosition(ctx context.Context, x int, y int)`
+JS: `WindowSetPosition(position: Position)` + +### WindowGetPosition + +Gets the window position relative to the monitor the window is currently on. + +Go: `WindowGetPosition(ctx context.Context) (x int, y int)`
+JS: `WindowGetPosition() : Position` + +### WindowMaximise + +Maximises the window to fill the screen. + +Go: `WindowMaximise(ctx context.Context)`
+JS: `WindowMaximise()` + +### WindowUnmaximise + +Restores the window to the dimensions and position prior to maximising. + +Go: `WindowUnmaximise(ctx context.Context)`
+JS: `WindowUnmaximise()` + +### WindowIsMaximised + +Returns true if the window is maximised. + +Go: `WindowIsMaximised(ctx context.Context) bool` +JS: `WindowIsMaximised() bool` + +### WindowToggleMaximise + +Toggles between Maximised and UnMaximised. + +Go: `WindowToggleMaximise(ctx context.Context)`
+JS: `WindowToggleMaximise()` + +### WindowMinimise + +Minimises the window. + +Go: `WindowMinimise(ctx context.Context)`
+JS: `WindowMinimise()` + +### WindowUnminimise + +Restores the window to the dimensions and position prior to minimising. + +Go: `WindowUnminimise(ctx context.Context)`
+JS: `WindowUnminimise()` + +### WindowIsMinimised + +Returns true if the window is minimised. + +Go: `WindowIsMinimised(ctx context.Context) bool` +JS: `WindowIsMinimised() bool` + +### WindowSetBackgroundColour + +Sets the background colour of the window to the given RGBA colour definition. +This colour will show through for all transparent pixels. + +Valid values for R, G, B and A are 0-255. + +:::info Windows +On Windows, only alpha values of 0 or 255 are supported. +Any value that is not 0 will be considered 255. +::: + +Go: `WindowSetBackgroundColour(ctx context.Context, R, G, B, A uint8)`
+JS: `WindowSetBackgroundColour(R, G, B, A)` + +## Typescript Object Definitions + +### Position + +```ts +interface Position { + x: number; + y: number; +} +``` + +### Size + +```ts +interface Size { + w: number; + h: number; +} +``` diff --git a/website/versioned_docs/version-v2.0.0-rc.1/tutorials/_category_.json b/website/versioned_docs/version-v2.0.0-rc.1/tutorials/_category_.json new file mode 100644 index 000000000..dfac1d175 --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-rc.1/tutorials/_category_.json @@ -0,0 +1,4 @@ +{ + "label": "Tutorials", + "position": 70 +} diff --git a/website/versioned_docs/version-v2.0.0-rc.1/tutorials/dogsapi.mdx b/website/versioned_docs/version-v2.0.0-rc.1/tutorials/dogsapi.mdx new file mode 100644 index 000000000..4a5f9c88a --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-rc.1/tutorials/dogsapi.mdx @@ -0,0 +1,248 @@ +--- +sidebar_position: 20 +--- + +# Dogs API + +
+ +
+
+ +:::note +This tutorial has been kindly provided by [@tatadan](https://twitter.com/tatadan) and forms part of +their [Wails Examples Repository](https://github.com/tataDan/wails-v2-examples). +::: + +In this tutorial we are going to develop an application that retrieves photos of dogs from the web +and then displays them. + +### Create the project + +Let's create the application. From a terminal enter: +```wails init -n dogs-api -t svelte``` + +Note: We could optionally add `-ide vscode` or `-ide goland` to the end of this command if you wanted +to add IDE support. + +Now let's `cd dogs-api` and start editing the project files. + +### Remove unused code + +We will start by removing some elements that we know we will not use: + +- Open `app.go` and remove the following lines: + +```go +// Greet returns a greeting for the given name +func (a *App) Greet(name string) string { + return fmt.Sprintf("Hello %s, It's show time!", name) +} +``` + +- Open `frontend/src/App.svelte` and delete all lines. +- Delete the `frontend/src/assets/images/logo-universal.png` file + +### Creating our application + +Now let's add our new Go code. + +Add the following struct declarations to `app.go` before the function definitions: + +```go +type RandomImage struct { + Message string + Status string +} + +type AllBreeds struct { + Message map[string]map[string][]string + Status string +} + +type ImagesByBreed struct { + Message []string + Status string +} +``` + +Add the following functions to `app.go` (perhaps after the existing function definitions): + +```go +func (a *App) GetRandomImageUrl() string { + response, err := http.Get("https://dog.ceo/api/breeds/image/random") + if err != nil { + log.Fatal(err) + } + + responseData, err := ioutil.ReadAll(response.Body) + if err != nil { + log.Fatal(err) + } + + var data RandomImage + json.Unmarshal(responseData, &data) + + return data.Message +} + +func (a *App) GetBreedList() []string { + var breeds []string + + response, err := http.Get("https://dog.ceo/api/breeds/list/all") + if err != nil { + log.Fatal(err) + } + + responseData, err := ioutil.ReadAll(response.Body) + if err != nil { + log.Fatal(err) + } + + var data AllBreeds + json.Unmarshal(responseData, &data) + + for k := range data.Message { + breeds = append(breeds, k) + } + + sort.Strings(breeds) + + return breeds +} + +func (a *App) GetImageUrlsByBreed(breed string) []string { + + url := fmt.Sprintf("%s%s%s%s", "https://dog.ceo/api/", "breed/", breed, "/images") + response, err := http.Get(url) + if err != nil { + log.Fatal(err) + } + + responseData, err := ioutil.ReadAll(response.Body) + if err != nil { + log.Fatal(err) + } + + var data ImagesByBreed + json.Unmarshal(responseData, &data) + + return data.Message +} +``` + +Modify the `import` section of `app.go` to look like this: + +```go +import ( + "context" + "fmt" + "encoding/json" + "io/ioutil" + "log" + "net/http" + "sort" +) +``` + +Add the following lines to `frontend/src/App.svelte`: + +```html + + +

Dogs API

+
+ + Click on down arrow to select a breed + + +
+
+{#if showRandomPhoto} + No dog found +{/if} +{#if showBreedPhotos} + {#each photos as photo} + No dog found + {/each} +{/if} + + +``` + +### Testing the application + +To generate the bindings and test the application, run `wails dev`. + +### Compiling the application + +To compile the application to a single, production grade binary, run `wails build`. + + + + + diff --git a/website/versioned_docs/version-v2.0.0-rc.1/tutorials/helloworld.mdx b/website/versioned_docs/version-v2.0.0-rc.1/tutorials/helloworld.mdx new file mode 100644 index 000000000..50d76f35c --- /dev/null +++ b/website/versioned_docs/version-v2.0.0-rc.1/tutorials/helloworld.mdx @@ -0,0 +1,120 @@ +--- +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: + +
+ +
+
+ +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: + +
+ +
+
diff --git a/website/versioned_sidebars/version-v2.0.0-beta.44-sidebars.json b/website/versioned_sidebars/version-v2.0.0-beta.44-sidebars.json new file mode 100644 index 000000000..caea0c03b --- /dev/null +++ b/website/versioned_sidebars/version-v2.0.0-beta.44-sidebars.json @@ -0,0 +1,8 @@ +{ + "tutorialSidebar": [ + { + "type": "autogenerated", + "dirName": "." + } + ] +} diff --git a/website/versioned_sidebars/version-v2.0.0-rc.1-sidebars.json b/website/versioned_sidebars/version-v2.0.0-rc.1-sidebars.json new file mode 100644 index 000000000..76a5e0116 --- /dev/null +++ b/website/versioned_sidebars/version-v2.0.0-rc.1-sidebars.json @@ -0,0 +1,13 @@ +{ + "docs": [ + { + "type": "autogenerated", + "dirName": "." + }, + { + "type": "link", + "label": "Contributing", + "href": "/community-guide#ways-of-contributing" + } + ] +} diff --git a/website/versions.json b/website/versions.json index fe51488c7..d538c3047 100644 --- a/website/versions.json +++ b/website/versions.json @@ -1 +1,4 @@ -[] +[ + "v2.0.0-rc.1", + "v2.0.0-beta.44" +]