mirror of
https://github.com/wailsapp/wails.git
synced 2025-05-02 19:50:15 +08:00
docs: translate and correct documents (#1525)
* feat(website): write english translations * docs(website): delete unnecessary files * feat(website): update term translations * docs(website): add Chinese documents * chore(crowdin): update crowdin config * docs(filename): keep the new document filename consistent with the old filename style * chore: add documentation issue template
This commit is contained in:
Misite Bao
GitHub
parent
b9a62b0224
commit
ecdda0154f
39
.github/ISSUE_TEMPLATE/documentation.yml
vendored
Normal file
39
.github/ISSUE_TEMPLATE/documentation.yml
vendored
Normal file
@ -0,0 +1,39 @@
|
|||||||
|
name: Documentation
|
||||||
|
description: Report an issue related to documentation.
|
||||||
|
# title: ""
|
||||||
|
labels: ["documentation"]
|
||||||
|
|
||||||
|
body:
|
||||||
|
- type: markdown
|
||||||
|
attributes:
|
||||||
|
value: |
|
||||||
|
This template is only used for documentation related requests, including:
|
||||||
|
|
||||||
|
- Log undocumented APIs
|
||||||
|
- Update link
|
||||||
|
- Documentation other than non-project code
|
||||||
|
|
||||||
|
If you followed the documentation but things don't work, take some time to consider if it's the documentation or the code that's wrong. In the latter, prefer using the "[Bug Report](https://github.com/wailsapp/wails/issues/new?assignees=&labels=bug&template=bug_report.yml)" template.
|
||||||
|
|
||||||
|
- type: checkboxes
|
||||||
|
attributes:
|
||||||
|
label: Have you read the Documentation Contribution Guidelines?
|
||||||
|
options:
|
||||||
|
- label: I have read the [Documentation Contribution Guidelines](https://wails.io/docs/next/contributing/documenting).
|
||||||
|
required: true
|
||||||
|
|
||||||
|
- type: textarea
|
||||||
|
attributes:
|
||||||
|
label: Description
|
||||||
|
description: A clear and concise description of what the issue is.
|
||||||
|
validations:
|
||||||
|
required: true
|
||||||
|
|
||||||
|
- type: checkboxes
|
||||||
|
attributes:
|
||||||
|
label: Self-service
|
||||||
|
description: |
|
||||||
|
If you feel like you could contribute to this issue, please check the box below. This would tell us and other people looking for contributions that someone's working on it.
|
||||||
|
If you do check this box, please send a pull request within 7 days so we can still delegate this to someone else.
|
||||||
|
options:
|
||||||
|
- label: I'd be willing to address this documentation request myself.
|
||||||
38
crowdin.yml
38
crowdin.yml
@ -1,9 +1,33 @@
|
|||||||
|
project_id: 527906
|
||||||
|
api_token_env: CROWDIN_PERSONAL_TOKEN
|
||||||
|
|
||||||
files:
|
files:
|
||||||
- source: website/docs
|
# Docs
|
||||||
translation: /website/i18n/%locale%/docusaurus-plugin-content-docs/current/%original_file_name%
|
- source: /website/docs/**/*
|
||||||
- source: website/blog
|
translation: /website/i18n/%locale%/docusaurus-plugin-content-docs/current/**/%original_file_name%
|
||||||
|
ignore: [/**/*.json]
|
||||||
|
|
||||||
|
# Blog
|
||||||
|
- source: /website/blog/*
|
||||||
translation: /website/i18n/%locale%/docusaurus-plugin-content-blog/%original_file_name%
|
translation: /website/i18n/%locale%/docusaurus-plugin-content-blog/%original_file_name%
|
||||||
- source: website/src/pages
|
|
||||||
translation: /website/i18n/%locale%/docusaurus-plugin-content-pages/%original_file_name%
|
# Pages
|
||||||
- source: website/i18n/en/docusaurus-theme-classic
|
- source: /website/src/pages/**/*
|
||||||
translation: /website/i18n/%locale%/docusaurus-theme-classic/%original_file_name%s
|
translation: /website/i18n/%locale%/docusaurus-plugin-content-pages/**/%original_file_name%
|
||||||
|
ignore: [/**/*.json, /**/*.js, /**/*.jsx, /**/*.ts, /**/*.tsx, /**/*.css]
|
||||||
|
|
||||||
|
# Configuration files
|
||||||
|
# - source: /website/i18n/en/docusaurus-plugin-content-blog/*
|
||||||
|
# translation: /website/i18n/%locale%/docusaurus-plugin-content-blog/%original_file_name%
|
||||||
|
|
||||||
|
# - source: /website/i18n/en/docusaurus-plugin-content-docs/*
|
||||||
|
# translation: /website/i18n/%locale%/docusaurus-plugin-content-docs/%original_file_name%
|
||||||
|
|
||||||
|
# - source: /website/i18n/en/docusaurus-theme-classic/*
|
||||||
|
# translation: /website/i18n/%locale%/docusaurus-theme-classic/%original_file_name%
|
||||||
|
|
||||||
|
# - source: /website/i18n/en/*
|
||||||
|
# translation: /website/i18n/%locale%/%original_file_name%
|
||||||
|
|
||||||
|
- source: /website/i18n/en/**/*.json
|
||||||
|
translation: /website/i18n/%locale%/**/%original_file_name%
|
||||||
|
|||||||
@ -5,7 +5,7 @@ leaanthony:
|
|||||||
image_url: https://github.com/leaanthony.png
|
image_url: https://github.com/leaanthony.png
|
||||||
|
|
||||||
misitebao:
|
misitebao:
|
||||||
name: Misitebao
|
name: Misite Bao
|
||||||
title: Architect
|
title: Architect
|
||||||
url: https://github.com/misitebao
|
url: https://github.com/misitebao
|
||||||
image_url: https://github.com/misitebao.png
|
image_url: https://github.com/misitebao.png
|
||||||
|
|||||||
@ -287,5 +287,17 @@
|
|||||||
"theme.tags.tagsPageTitle": {
|
"theme.tags.tagsPageTitle": {
|
||||||
"message": "Tags",
|
"message": "Tags",
|
||||||
"description": "The title of the tag list page"
|
"description": "The title of the tag list page"
|
||||||
|
},
|
||||||
|
"theme.docs.breadcrumbs.home": {
|
||||||
|
"message": "Home page",
|
||||||
|
"description": "The ARIA label for the home page in the breadcrumbs"
|
||||||
|
},
|
||||||
|
"theme.docs.breadcrumbs.navAriaLabel": {
|
||||||
|
"message": "Breadcrumbs",
|
||||||
|
"description": "The ARIA label for the breadcrumbs"
|
||||||
|
},
|
||||||
|
"theme.CodeBlock.wordWrapToggle": {
|
||||||
|
"message": "Toggle word wrap",
|
||||||
|
"description": "The title attribute for toggle word wrapping button of code block lines"
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@ -26,5 +26,13 @@
|
|||||||
"sidebar.tutorialSidebar.category.Guides": {
|
"sidebar.tutorialSidebar.category.Guides": {
|
||||||
"message": "Guides",
|
"message": "Guides",
|
||||||
"description": "The label for category Guides in sidebar tutorialSidebar"
|
"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"
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@ -1,30 +1,30 @@
|
|||||||
{
|
{
|
||||||
"version.label": {
|
"version.label": {
|
||||||
"message": "v2.0.0-beta.34",
|
"message": "v2.0.0-beta.38",
|
||||||
"description": "The label for version v2.0.0-beta.34"
|
"description": "The label for version v2.0.0-beta.38"
|
||||||
},
|
},
|
||||||
"sidebar.tutorialSidebar.category.Getting Started": {
|
"sidebar.tutorialSidebar.category.Getting Started": {
|
||||||
"message": "快速入门",
|
"message": "Getting Started",
|
||||||
"description": "The label for category Getting Started in sidebar tutorialSidebar"
|
"description": "The label for category Getting Started in sidebar tutorialSidebar"
|
||||||
},
|
},
|
||||||
"sidebar.tutorialSidebar.category.Reference": {
|
"sidebar.tutorialSidebar.category.Reference": {
|
||||||
"message": "参考",
|
"message": "Reference",
|
||||||
"description": "The label for category Reference in sidebar tutorialSidebar"
|
"description": "The label for category Reference in sidebar tutorialSidebar"
|
||||||
},
|
},
|
||||||
"sidebar.tutorialSidebar.category.Runtime": {
|
"sidebar.tutorialSidebar.category.Runtime": {
|
||||||
"message": "运行时",
|
"message": "Runtime",
|
||||||
"description": "The label for category Runtime in sidebar tutorialSidebar"
|
"description": "The label for category Runtime in sidebar tutorialSidebar"
|
||||||
},
|
},
|
||||||
"sidebar.tutorialSidebar.category.Community": {
|
"sidebar.tutorialSidebar.category.Community": {
|
||||||
"message": "社区",
|
"message": "Community",
|
||||||
"description": "The label for category Community in sidebar tutorialSidebar"
|
"description": "The label for category Community in sidebar tutorialSidebar"
|
||||||
},
|
},
|
||||||
"sidebar.tutorialSidebar.category.Showcase": {
|
"sidebar.tutorialSidebar.category.Showcase": {
|
||||||
"message": "项目展示",
|
"message": "Showcase",
|
||||||
"description": "The label for category Showcase in sidebar tutorialSidebar"
|
"description": "The label for category Showcase in sidebar tutorialSidebar"
|
||||||
},
|
},
|
||||||
"sidebar.tutorialSidebar.category.Guides": {
|
"sidebar.tutorialSidebar.category.Guides": {
|
||||||
"message": "指南",
|
"message": "Guides",
|
||||||
"description": "The label for category Guides in sidebar tutorialSidebar"
|
"description": "The label for category Guides in sidebar tutorialSidebar"
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@ -0,0 +1,38 @@
|
|||||||
|
{
|
||||||
|
"version.label": {
|
||||||
|
"message": "v2.0.0-beta.39",
|
||||||
|
"description": "The label for version v2.0.0-beta.39"
|
||||||
|
},
|
||||||
|
"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"
|
||||||
|
}
|
||||||
|
}
|
||||||
@ -46,5 +46,9 @@
|
|||||||
"copyright": {
|
"copyright": {
|
||||||
"message": "Copyright © 2022 Lea Anthony. Built with Docusaurus.",
|
"message": "Copyright © 2022 Lea Anthony. Built with Docusaurus.",
|
||||||
"description": "The footer copyright"
|
"description": "The footer copyright"
|
||||||
|
},
|
||||||
|
"link.item.label.Awesome": {
|
||||||
|
"message": "Awesome",
|
||||||
|
"description": "The label of footer link with label=Awesome linking to https://github.com/wailsapp/awesome-wails"
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@ -14,5 +14,29 @@
|
|||||||
"item.label.GitHub": {
|
"item.label.GitHub": {
|
||||||
"message": "GitHub",
|
"message": "GitHub",
|
||||||
"description": "Navbar item with label GitHub"
|
"description": "Navbar item with label GitHub"
|
||||||
|
},
|
||||||
|
"item.label.About": {
|
||||||
|
"message": "About",
|
||||||
|
"description": "Navbar item with label About"
|
||||||
|
},
|
||||||
|
"item.label.FAQ": {
|
||||||
|
"message": "FAQ",
|
||||||
|
"description": "Navbar item with label FAQ"
|
||||||
|
},
|
||||||
|
"item.label.Changelog": {
|
||||||
|
"message": "Changelog",
|
||||||
|
"description": "Navbar item with label Changelog"
|
||||||
|
},
|
||||||
|
"item.label.Community Guide": {
|
||||||
|
"message": "Community Guide",
|
||||||
|
"description": "Navbar item with label Community Guide"
|
||||||
|
},
|
||||||
|
"item.label.Credits": {
|
||||||
|
"message": "Credits",
|
||||||
|
"description": "Navbar item with label Credits"
|
||||||
|
},
|
||||||
|
"item.label.Stats": {
|
||||||
|
"message": "Stats",
|
||||||
|
"description": "Navbar item with label Stats"
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@ -287,5 +287,17 @@
|
|||||||
"theme.tags.tagsPageTitle": {
|
"theme.tags.tagsPageTitle": {
|
||||||
"message": "标签",
|
"message": "标签",
|
||||||
"description": "The title of the tag list page"
|
"description": "The title of the tag list page"
|
||||||
|
},
|
||||||
|
"theme.docs.breadcrumbs.home": {
|
||||||
|
"message": "主页面",
|
||||||
|
"description": "The ARIA label for the home page in the breadcrumbs"
|
||||||
|
},
|
||||||
|
"theme.docs.breadcrumbs.navAriaLabel": {
|
||||||
|
"message": "页面路径",
|
||||||
|
"description": "The ARIA label for the breadcrumbs"
|
||||||
|
},
|
||||||
|
"theme.CodeBlock.wordWrapToggle": {
|
||||||
|
"message": "切换自动换行",
|
||||||
|
"description": "The title attribute for toggle word wrapping button of code block lines"
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@ -5,7 +5,7 @@ leaanthony:
|
|||||||
image_url: https://github.com/leaanthony.png
|
image_url: https://github.com/leaanthony.png
|
||||||
|
|
||||||
misitebao:
|
misitebao:
|
||||||
name: Misitebao
|
name: 米司特包
|
||||||
title: 架构师
|
title: 架构师
|
||||||
url: https://github.com/misitebao
|
url: https://github.com/misitebao
|
||||||
image_url: https://github.com/misitebao.png
|
image_url: https://github.com/misitebao.png
|
||||||
|
|||||||
@ -26,5 +26,13 @@
|
|||||||
"sidebar.tutorialSidebar.category.Guides": {
|
"sidebar.tutorialSidebar.category.Guides": {
|
||||||
"message": "指南",
|
"message": "指南",
|
||||||
"description": "The label for category Guides in sidebar tutorialSidebar"
|
"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"
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@ -0,0 +1,11 @@
|
|||||||
|
# October
|
||||||
|
|
||||||
|
<p style={{"text-align": "center"}}>
|
||||||
|
<img src="/img/showcase/october.png"></img><br/>
|
||||||
|
</p>
|
||||||
|
|
||||||
|
[October](https://october.utf9k.net) is a small Wails application that makes it really easy to extract highlights from [Kobo eReaders](https://en.wikipedia.org/wiki/Kobo_eReader) and then forward them to [Readwise](https://readwise.io).
|
||||||
|
|
||||||
|
It has a relatively small scope with all platform versions weighing in under 10MB, and that's without enabling [UPX compression](https://upx.github.io/)!
|
||||||
|
|
||||||
|
In contrast, the author's previous attempts with Electron quickly bloated to several hundred megabytes.
|
||||||
@ -0,0 +1,11 @@
|
|||||||
|
|
||||||
|
# Restic Browser
|
||||||
|
|
||||||
|
<p style={{"text-align": "center"}}>
|
||||||
|
<img src="/img/showcase/restic-browser-2.png"></img><br/>
|
||||||
|
</p>
|
||||||
|
|
||||||
|
[Restic-Browser](https://github.com/emuell/restic-browser) - A simple, cross-platform [restic](https://github.com/restic/restic) backup GUI for browsing and restoring restic repositories.
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
@ -0,0 +1,4 @@
|
|||||||
|
{
|
||||||
|
"label": "Contributing",
|
||||||
|
"position": 99
|
||||||
|
}
|
||||||
@ -0,0 +1,35 @@
|
|||||||
|
---
|
||||||
|
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:
|
||||||
|
|
||||||
|
- Pick an enhancement ticket with the "TODO" label. It's preferable to select one from the current
|
||||||
|
[Backlog](https://github.com/orgs/wailsapp/projects/1/views/1) but the choice is yours.
|
||||||
|
- Before developing, check that the ticket includes the following information:
|
||||||
|
- The purpose of the enhancement
|
||||||
|
- What is out of scope for the enhancement
|
||||||
|
- What platforms the enhancement targets (most features should be cross-platform unless there's a very specific reason)
|
||||||
|
- If the ticket does not include this information, feel free to request the information from the
|
||||||
|
person who opened the ticket. Sometimes placeholder tickets are created and require more details
|
||||||
|
- Comment on the ticket stating you wish to develop the feature
|
||||||
|
- Clone the repository and create a branch with the format `feature/<ticket_number>_<ticket_title>`
|
||||||
|
- New features often require documentation so please ensure you have also added or updated the documentation as part of
|
||||||
|
the changes
|
||||||
|
- Once the feature is ready for testing, create a draft PR. Please ensure the PR description has the test scenarios and
|
||||||
|
test cases listed with checkmarks, so that others can know what still needs to be tested.
|
||||||
|
- Once all the testing is completed, please update the status of the PR from draft and leave a message.
|
||||||
|
|
||||||
|
:::note
|
||||||
|
There is nothing stopping you from opening a ticket and working on it yourself, but please be aware that all
|
||||||
|
enhancement requests are reviewed for good fit. Not all ideas will be selected so it's best to have discussion
|
||||||
|
on the ticket first.
|
||||||
|
:::
|
||||||
|
|
||||||
|
:::warning
|
||||||
|
Any PRs opened without a corresponding ticket may be rejected.
|
||||||
|
:::
|
||||||
|
|
||||||
@ -0,0 +1,39 @@
|
|||||||
|
---
|
||||||
|
sidebar_position: 40
|
||||||
|
---
|
||||||
|
|
||||||
|
# 文档
|
||||||
|
|
||||||
|
This website is also the main documentation site for the project. Sometimes this gets
|
||||||
|
out of date and needs some slight adjustments. Some of the documentation isn't written
|
||||||
|
to the best standards either. Developing documentation is hard and so any contribution
|
||||||
|
to this is greatly appreciated. Features without documentation are unfinished so to the
|
||||||
|
project, it's *as important* as the code.
|
||||||
|
|
||||||
|
We generally do not create tickets for updating documentation so if there is text you
|
||||||
|
think should be updated or rephrased then feel free to submit a PR for that. This site
|
||||||
|
is in the main repository under the `website` directory. We use [Docusaurus](https://docusaurus.io/) to create
|
||||||
|
the site so there is plenty of existing documentation and tutorials around to get started.
|
||||||
|
|
||||||
|
To set up a local documentation development environment, do the following:
|
||||||
|
|
||||||
|
- [Install npm](https://docs.npmjs.com/cli/v8/configuring-npm/install)
|
||||||
|
- `cd website`
|
||||||
|
- `npm install`
|
||||||
|
- `npm run start`
|
||||||
|
|
||||||
|
After it has all installed and is running, you should see the site at [`http://localhost:3000`](http://localhost:3000).
|
||||||
|
Any changes made to the site text will be immediately reflected in the browser.
|
||||||
|
|
||||||
|
## Versioning
|
||||||
|
|
||||||
|
We employ a versioning system where we have the "latest" documentation AKA "Next Version" which
|
||||||
|
has all the changes that have occurred since the last release. We also keep the last release
|
||||||
|
documentation as well as the version before that.
|
||||||
|
|
||||||
|
There isn't usually a reason to update released documentation so we don't generally update
|
||||||
|
the documents in the `versioned_docs` or `versioned_sidebars` directories.
|
||||||
|
|
||||||
|
The "next version" docs are mainly in `website/docs` with some "version independent" documents
|
||||||
|
in `src/pages`. Any updates should be made in the `website/docs` directory.
|
||||||
|
|
||||||
@ -0,0 +1,30 @@
|
|||||||
|
---
|
||||||
|
sidebar_position: 30
|
||||||
|
---
|
||||||
|
|
||||||
|
# 修复漏洞
|
||||||
|
|
||||||
|
The process for fixing bugs are as follows:
|
||||||
|
|
||||||
|
- Check the current [Backlog](https://github.com/orgs/wailsapp/projects/1/views/1) and select a bug to fix
|
||||||
|
- Before developing, check that the ticket includes the following information:
|
||||||
|
- The scope of the issue including platforms affected
|
||||||
|
- The steps to reproduce. Sometimes bugs are opened that are not Wails issues and the onus is on the reporter to
|
||||||
|
prove that it is a Wails issue with a minimal reproducible example
|
||||||
|
- The output of `wails doctor`
|
||||||
|
- If the ticket does not include this information, feel free to request the information from the
|
||||||
|
person who opened the ticket.
|
||||||
|
- Comment on the ticket stating you wish to develop a fix
|
||||||
|
- Clone the repository and create a branch with the format `bugfix/<ticket_number>_<ticket_title>`
|
||||||
|
- Once the fix is ready for testing, create a draft PR. Please ensure the PR description has the test scenarios and
|
||||||
|
test cases listed with checkmarks, so that others can know what still needs to be tested.
|
||||||
|
- Once all the testing is completed, please update the status of the PR from draft and leave a message.
|
||||||
|
|
||||||
|
:::note
|
||||||
|
There is nothing stopping you from opening a ticket and working on it yourself, but please be aware that all
|
||||||
|
bugfixes should be discussed as the approach may have unintended side effects.
|
||||||
|
:::
|
||||||
|
|
||||||
|
:::warning
|
||||||
|
Any PRs opened without a corresponding ticket may be rejected.
|
||||||
|
:::
|
||||||
@ -0,0 +1,17 @@
|
|||||||
|
---
|
||||||
|
sidebar_position: 50
|
||||||
|
---
|
||||||
|
|
||||||
|
# 帮助其他人
|
||||||
|
|
||||||
|
A great way to contribute to the project is to help others who are experiencing difficulty.
|
||||||
|
This is normally reported as a ticket or a message on the Wails slack channel. Even just
|
||||||
|
clarifying the issue can really help out. Sometimes, when an issue is discussed and gets
|
||||||
|
resolved, we create a guide out of it to help others who face the same issues.
|
||||||
|
|
||||||
|
To join the Wails slack channel, accept the invite [here](https://gophers.slack.com/join/shared_invite/zt-197vymgt3-sJt4oyakb6nqlVKjXTyeVw#/shared-invite/email)
|
||||||
|
and join us on the channel by following [this link](https://gophers.slack.com/?redir=%2Fmessages%2FCJ4P9F7MZ%2F).
|
||||||
|
|
||||||
|
:::note
|
||||||
|
Work In Progress
|
||||||
|
:::
|
||||||
@ -0,0 +1,34 @@
|
|||||||
|
---
|
||||||
|
sidebar_position: 10
|
||||||
|
---
|
||||||
|
|
||||||
|
# 设置开发环境
|
||||||
|
|
||||||
|
You can set up a development environment by doing the following:
|
||||||
|
|
||||||
|
- Install the latest versions of Go and Git
|
||||||
|
- `git clone https://github.com/wailsapp/wails`
|
||||||
|
- `cd wails/v2/cmd/wails`
|
||||||
|
- `go install`
|
||||||
|
|
||||||
|
NOTE: The directory that you cloned the project into will now be called "clonedir".
|
||||||
|
|
||||||
|
The Wails CLI will now be at the very latest version.
|
||||||
|
|
||||||
|
To update projects to use the latest version, update the project's `go.mod` and
|
||||||
|
ensure the following line is at the bottom of the file:
|
||||||
|
|
||||||
|
`replace github.com/wailsapp/wails/v2 => <clonedir>`
|
||||||
|
|
||||||
|
Example:
|
||||||
|
|
||||||
|
On Windows:
|
||||||
|
`replace github.com/wailsapp/wails/v2 => C:\Users\leaan\Documents\wails-v2-beta\wails\v2`
|
||||||
|
|
||||||
|
On 'nix:
|
||||||
|
`replace github.com/wailsapp/wails/v2 => /home/me/projects/wails/v2`
|
||||||
|
|
||||||
|
To revert back to a stable version, run:
|
||||||
|
|
||||||
|
`go install github.com/wailsapp/wails/v2/cmd/wails@latest`
|
||||||
|
|
||||||
@ -0,0 +1,21 @@
|
|||||||
|
---
|
||||||
|
sidebar_position: 35
|
||||||
|
---
|
||||||
|
|
||||||
|
# 测试
|
||||||
|
|
||||||
|
Testing is vitally important to ensure quality in the project. There are a couple of
|
||||||
|
scenarios where testing can really help the project:
|
||||||
|
|
||||||
|
- Testing if a bug is reproducible on your local system
|
||||||
|
- Testing PRs to ensure that they work correctly
|
||||||
|
|
||||||
|
If you chose to test if someone's bug report is reproducible on your local system, then
|
||||||
|
feel free to add a comment on the ticket confirming this with the output of `wails doctor`.
|
||||||
|
|
||||||
|
To test PRs, choose a PR to test and check if the PR description has the testing scenarios
|
||||||
|
listed. If not, please ask the person who opened the PR to provide that list. Once you have
|
||||||
|
determined a valid test scenario, please report your findings on the PR.
|
||||||
|
|
||||||
|
If you ever need more clarity or help on testing, please ask a question in the [Contributing to Wails](https://github.com/wailsapp/wails/discussions/1520)
|
||||||
|
discussion or on slack.
|
||||||
@ -0,0 +1,22 @@
|
|||||||
|
---
|
||||||
|
sidebar_position: 1
|
||||||
|
---
|
||||||
|
|
||||||
|
# 贡献方式
|
||||||
|
|
||||||
|
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.
|
||||||
@ -1,29 +0,0 @@
|
|||||||
# 参与贡献
|
|
||||||
|
|
||||||
这个页面是关于如何贡献 Wails 项目的指南。
|
|
||||||
|
|
||||||
首先，有一个警告：Wails v2 已经经历了多次迭代和调整。有很多代码要么被搁置要么被弃用。阅读整个项目并试图理解它可能会令人困惑。本文档旨在关注当前的内容以及如何理解当前内容。
|
|
||||||
|
|
||||||
## 漏洞
|
|
||||||
|
|
||||||
对于提出漏洞，请在 GitHub 上打开一个 Issue 并给出[v2]标签。在 Issue 中包含`wails doctor`的输出以帮助我们了解您的环境。
|
|
||||||
|
|
||||||
对于修复漏洞，请在您想要接受的 Issue 上发表评论，我们将在 Issue 上贴上标签。最好使用 Windows，因为它是使用纯 Go 中完成的，调试更容易。
|
|
||||||
|
|
||||||
## 功能
|
|
||||||
|
|
||||||
要请求新功能，请提出一个 Issue 以便讨论。Issue 应带有“Feature Request”标签。这些将被讨论，如果被选中进行开发，将被贴上“Ready for Development”的标签。
|
|
||||||
|
|
||||||
要实现新功能，请按上述方式提出 Issue 或选择带有“Ready for Development”标签的工单。
|
|
||||||
|
|
||||||
在提出 PR 时，请注意说明 PR 已在哪些平台上进行过测试。除非它适用于所有平台（如果可以）,否则任何新功能都不会被接受。
|
|
||||||
|
|
||||||
:::warning 不应该做的
|
|
||||||
|
|
||||||
没有 Issue 的新功能 PR 是没有帮助的，因为 PR 没有上下文，也不会被优先考虑。
|
|
||||||
|
|
||||||
:::
|
|
||||||
|
|
||||||
## 文档
|
|
||||||
|
|
||||||
通过单击任何页面上的“编辑此页”链接，可以轻松地为文档做出贡献。文档更新可以随时完成，无需 Issue。
|
|
||||||
@ -0,0 +1,123 @@
|
|||||||
|
# 动态资源
|
||||||
|
|
||||||
|
If you want to load or generate assets for your frontend dynamically, you can achieve that using the
|
||||||
|
[AssetsHandler](../reference/options#assetshandler) option. The AssetsHandler is a generic `http.Handler` which will
|
||||||
|
be called for any non GET request on the assets server and for GET requests which can not be served from the
|
||||||
|
bundled assets because the file is not found.
|
||||||
|
|
||||||
|
By installing a custom AssetsHandler, you can serve your own assets using a custom asset server.
|
||||||
|
|
||||||
|
## Example
|
||||||
|
|
||||||
|
In our example project, we will create a simple assets handler which will load files off disk:
|
||||||
|
|
||||||
|
```go title=main.go {16-35,49}
|
||||||
|
package main
|
||||||
|
|
||||||
|
import (
|
||||||
|
"embed"
|
||||||
|
"fmt"
|
||||||
|
"github.com/wailsapp/wails/v2"
|
||||||
|
"github.com/wailsapp/wails/v2/pkg/options"
|
||||||
|
"net/http"
|
||||||
|
"os"
|
||||||
|
"strings"
|
||||||
|
)
|
||||||
|
|
||||||
|
//go:embed frontend/dist
|
||||||
|
var assets embed.FS
|
||||||
|
|
||||||
|
type FileLoader struct {
|
||||||
|
http.Handler
|
||||||
|
}
|
||||||
|
|
||||||
|
func NewFileLoader() *FileLoader {
|
||||||
|
return &FileLoader{}
|
||||||
|
}
|
||||||
|
|
||||||
|
func (h *FileLoader) ServeHTTP(res http.ResponseWriter, req *http.Request) {
|
||||||
|
var err error
|
||||||
|
requestedFilename := strings.TrimPrefix(req.URL.Path, "/")
|
||||||
|
println("Requesting file:", requestedFilename)
|
||||||
|
fileData, err := os.ReadFile(requestedFilename)
|
||||||
|
if err != nil {
|
||||||
|
res.WriteHeader(http.StatusBadRequest)
|
||||||
|
res.Write([]byte(fmt.Sprintf("Could not load file %s", requestedFilename)))
|
||||||
|
}
|
||||||
|
|
||||||
|
res.Write(fileData)
|
||||||
|
}
|
||||||
|
|
||||||
|
func main() {
|
||||||
|
// Create an instance of the app structure
|
||||||
|
app := NewApp()
|
||||||
|
|
||||||
|
// Create application with options
|
||||||
|
err := wails.Run(&options.App{
|
||||||
|
Title: "helloworld",
|
||||||
|
Width: 1024,
|
||||||
|
Height: 768,
|
||||||
|
Assets: assets,
|
||||||
|
BackgroundColour: &options.RGBA{R: 27, G: 38, B: 54, A: 1},
|
||||||
|
OnStartup: app.startup,
|
||||||
|
AssetsHandler: NewFileLoader(),
|
||||||
|
Bind: []interface{}{
|
||||||
|
app,
|
||||||
|
},
|
||||||
|
})
|
||||||
|
|
||||||
|
if err != nil {
|
||||||
|
println("Error:", err)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
```
|
||||||
|
|
||||||
|
When we run the application in dev mode using `wails dev`, we will see the following output:
|
||||||
|
|
||||||
|
```
|
||||||
|
DEB | [ExternalAssetHandler] Loading 'http://localhost:3001/favicon.ico'
|
||||||
|
DEB | [ExternalAssetHandler] Loading 'http://localhost:3001/favicon.ico' failed, using AssetHandler
|
||||||
|
Requesting file: favicon.ico
|
||||||
|
```
|
||||||
|
As you can see, the assets handler is called when the default assets server is unable to serve
|
||||||
|
the `favicon.ico` file.
|
||||||
|
|
||||||
|
If you right click the main application and select "inspect" to bring up the devtools, you can test
|
||||||
|
this feature out by typing the following into the console:
|
||||||
|
|
||||||
|
```
|
||||||
|
let response = await fetch('does-not-exist.txt');
|
||||||
|
```
|
||||||
|
This will generate an error in the devtools. We can see that the error is what we expect, returned by
|
||||||
|
our custom assets handler:
|
||||||
|
|
||||||
|
<p className="text--center">
|
||||||
|
<img src="/img/assetshandler-does-not-exist.png"></img>
|
||||||
|
</p>
|
||||||
|
|
||||||
|
However, if we request `go.mod`, we will see the following output:
|
||||||
|
|
||||||
|
<p className="text--center">
|
||||||
|
<img src="/img/assetshandler-go-mod.png"></img>
|
||||||
|
</p>
|
||||||
|
|
||||||
|
This technique can be used to load images directly into the page. If we updated our default vanilla template and
|
||||||
|
replaced the logo image:
|
||||||
|
```html
|
||||||
|
<img id="logo" class="logo">
|
||||||
|
```
|
||||||
|
with:
|
||||||
|
```html
|
||||||
|
<img src="build/appicon.png" style="width: 300px">
|
||||||
|
```
|
||||||
|
Then we would see the following:
|
||||||
|
|
||||||
|
<p className="text--center">
|
||||||
|
<img src="/img/assetshandler-image.png" style={{"width": "75%"}}></img>
|
||||||
|
</p>
|
||||||
|
|
||||||
|
:::warning
|
||||||
|
Exposing your filesystem in this way is a security risk. It is recommended that you properly manage access
|
||||||
|
to your filesystem.
|
||||||
|
:::
|
||||||
|
|
||||||
@ -0,0 +1,28 @@
|
|||||||
|
# 鼠标按钮
|
||||||
|
|
||||||
|
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
|
||||||
@ -0,0 +1,4 @@
|
|||||||
|
{
|
||||||
|
"label": "Tutorials",
|
||||||
|
"position": 70
|
||||||
|
}
|
||||||
@ -0,0 +1,120 @@
|
|||||||
|
---
|
||||||
|
sidebar_position: 10
|
||||||
|
---
|
||||||
|
|
||||||
|
# 你好世界
|
||||||
|
|
||||||
|
The aim of this tutorial is to get you up and running with the most basic
|
||||||
|
application using Wails. You will be able to:
|
||||||
|
|
||||||
|
- Create a new Wails application
|
||||||
|
- Build the application
|
||||||
|
- Run the application
|
||||||
|
|
||||||
|
:::note
|
||||||
|
This tutorial uses Windows as the target platform. Output will vary slightly
|
||||||
|
depending on your operating system.
|
||||||
|
:::
|
||||||
|
|
||||||
|
## Create a new Wails application
|
||||||
|
|
||||||
|
To create a new Wails application using the default vanilla JS template,
|
||||||
|
you need to run the following command:
|
||||||
|
|
||||||
|
```bash
|
||||||
|
wails init -n helloworld
|
||||||
|
```
|
||||||
|
|
||||||
|
You should see something similar to the following:
|
||||||
|
|
||||||
|
```
|
||||||
|
Wails CLI v2.0.0
|
||||||
|
|
||||||
|
Initialising Project 'helloworld'
|
||||||
|
---------------------------------
|
||||||
|
|
||||||
|
Project Name: helloworld
|
||||||
|
Project Directory: C:\Users\leaan\tutorial\helloworld
|
||||||
|
Project Template: vanilla
|
||||||
|
Template Support: https://wails.io
|
||||||
|
|
||||||
|
Initialised project 'helloworld' in 232ms.
|
||||||
|
```
|
||||||
|
|
||||||
|
This will create a new directory called `helloworld` in the current directory.
|
||||||
|
In this directory, you will find a number of files:
|
||||||
|
|
||||||
|
```
|
||||||
|
build/ - Contains the build files + compiled application
|
||||||
|
frontend/ - Contains the frontend files
|
||||||
|
app.go - Contains the application code
|
||||||
|
main.go - The main program with the application configuration
|
||||||
|
wails.json - The project configuration file
|
||||||
|
go.mod - The go module file
|
||||||
|
go.sum - The go module checksum file
|
||||||
|
```
|
||||||
|
|
||||||
|
## Build the application
|
||||||
|
|
||||||
|
To build the application, change to the new `helloworld` project directory and run the following command:
|
||||||
|
|
||||||
|
```bash
|
||||||
|
wails build
|
||||||
|
```
|
||||||
|
|
||||||
|
You should see something like the following:
|
||||||
|
|
||||||
|
```
|
||||||
|
Wails CLI v2.0.0
|
||||||
|
|
||||||
|
App Type: desktop
|
||||||
|
Platforms: windows/amd64
|
||||||
|
Compiler: C:\Users\leaan\go\go1.18.3\bin\go.exe
|
||||||
|
Build Mode: Production
|
||||||
|
Skip Frontend: false
|
||||||
|
Compress: false
|
||||||
|
Package: true
|
||||||
|
Clean Build Dir: false
|
||||||
|
LDFlags: ""
|
||||||
|
Tags: []
|
||||||
|
Race Detector: false
|
||||||
|
|
||||||
|
Building target: windows/amd64
|
||||||
|
------------------------------
|
||||||
|
- Installing frontend dependencies: Done.
|
||||||
|
- Compiling frontend: Done.
|
||||||
|
- Generating bundle assets: Done.
|
||||||
|
- Compiling application: Done.
|
||||||
|
Built 'C:\Users\leaan\tutorial\helloworld\build\bin\helloworld.exe' in 10.616s.
|
||||||
|
```
|
||||||
|
|
||||||
|
This has compiled the application and saved it in the `build/bin` directory.
|
||||||
|
|
||||||
|
## Run the application
|
||||||
|
|
||||||
|
If we view the `build/bin` directory in Windows Explorer, we should see our project binary:
|
||||||
|
|
||||||
|
<div class="text--center">
|
||||||
|
<img src="/img/helloworld-app-icon.png" width="134px" />
|
||||||
|
</div>
|
||||||
|
<br />
|
||||||
|
|
||||||
|
We can run it by simply double-clicking the `helloworld.exe` file.
|
||||||
|
|
||||||
|
On Mac, Wails generates a `helloworld.app` file which can be run by double-clicking it.
|
||||||
|
|
||||||
|
On Linux, you can run the application using `./helloworld` from the `build/bin` directory.
|
||||||
|
|
||||||
|
You should see the application working as expected:
|
||||||
|
|
||||||
|
<div class="text--center">
|
||||||
|
<img
|
||||||
|
src="/img/windows-default-app.png"
|
||||||
|
width="50%"
|
||||||
|
style={{
|
||||||
|
"box-shadow":
|
||||||
|
"rgb(255 255 255 / 20%) 0px 1px 2px 0px, rgb(104 104 104) 0px 1px 5px 0px",
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<br />
|
||||||
@ -1,4 +0,0 @@
|
|||||||
{
|
|
||||||
"label": "Appendix",
|
|
||||||
"position": 70
|
|
||||||
}
|
|
||||||
@ -1,4 +0,0 @@
|
|||||||
{
|
|
||||||
"label": "Community",
|
|
||||||
"position": 50
|
|
||||||
}
|
|
||||||
@ -1,23 +0,0 @@
|
|||||||
---
|
|
||||||
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
|
|
||||||
@ -1,4 +0,0 @@
|
|||||||
{
|
|
||||||
"label": "Showcase",
|
|
||||||
"position": 1
|
|
||||||
}
|
|
||||||
@ -1,10 +0,0 @@
|
|||||||
|
|
||||||
# EncryptEasy
|
|
||||||
|
|
||||||
<p style={{"text-align": "center"}}>
|
|
||||||
<img src="/img/showcase/encrypteasy.jpg"></img><br/>
|
|
||||||
</p>
|
|
||||||
|
|
||||||
**[EncryptEasy](https://www.encrypteasy.app) is a simple and easy to use PGP encryption tool, managing all your and your contacts keys. Encryption should be simple. Developed with Wails.**
|
|
||||||
|
|
||||||
Encrypting messages using PGP is the industry standard. Everyone has a private and a public key. Your private key, well, needs to be kept private so only you can read messages. Your public key is distributed to anyone who wants to send you secret, encrypted messages. Managing keys, encrypting messages and decrypting messages should be a smooth experience. EncryptEasy is all about making it easy.
|
|
||||||
@ -1,23 +0,0 @@
|
|||||||
|
|
||||||
# FileHound Export Utility
|
|
||||||
|
|
||||||
<p style={{"text-align": "center"}}>
|
|
||||||
<img src="/img/showcase/filehound.jpg"></img><br/>
|
|
||||||
</p>
|
|
||||||
|
|
||||||
|
|
||||||
[FileHound Export Utility](https://www.filehound.co.uk/) FileHound is a cloud document management platform made for secure file retention, business process automation and SmartCapture capabilities.
|
|
||||||
|
|
||||||
The FileHound Export Utility allows FileHound Administrators the ability to run a secure document and data extraction tasks for alternative back-up and recovery purposes. This application will download all documents and/or meta data saved in FileHound based on the filters you choose. The metadata will be exported in both JSON and XML formats.
|
|
||||||
|
|
||||||
Backend built with:
|
|
||||||
Go 1.15
|
|
||||||
Wails 1.11.0
|
|
||||||
go-sqlite3 1.14.6
|
|
||||||
go-linq 3.2
|
|
||||||
|
|
||||||
Frontend with:
|
|
||||||
Vue 2.6.11
|
|
||||||
Vuex 3.4.0
|
|
||||||
Typescript
|
|
||||||
Tailwind 1.9.6
|
|
||||||
@ -1,9 +0,0 @@
|
|||||||
|
|
||||||
# Molly Wallet
|
|
||||||
|
|
||||||
<p style={{"text-align": "center"}}>
|
|
||||||
<img src="/img/showcase/mollywallet.png"></img><br/>
|
|
||||||
</p>
|
|
||||||
|
|
||||||
[Molly Wallet](https://github.com/grvlle/constellation_wallet/) the official $DAG wallet of the Constellation Network. It'll let users interact with the Hypergraph Network in various ways, not limited to producing $DAG transactions.
|
|
||||||
|
|
||||||
@ -1,9 +0,0 @@
|
|||||||
|
|
||||||
# Optimus
|
|
||||||
|
|
||||||
<p style={{"text-align": "center"}}>
|
|
||||||
<img src="/img/showcase/optimus.png"></img><br/>
|
|
||||||
</p>
|
|
||||||
|
|
||||||
[Optimus](https://github.com/splode/optimus) is a desktop image optimization application. It supports conversion and compression between WebP, JPEG, and PNG image formats.
|
|
||||||
|
|
||||||
@ -1,9 +0,0 @@
|
|||||||
|
|
||||||
# Portfall
|
|
||||||
|
|
||||||
<p style={{"text-align": "center"}}>
|
|
||||||
<img src="/img/showcase/portfall.gif"></img><br/>
|
|
||||||
</p>
|
|
||||||
|
|
||||||
[Portfall](https://github.com/rekon-oss/portfall) - A desktop k8s port-forwarding portal for easy access to all your cluster UIs
|
|
||||||
|
|
||||||
@ -1,19 +0,0 @@
|
|||||||
|
|
||||||
# RiftShare
|
|
||||||
|
|
||||||
<p style={{"text-align": "center"}}>
|
|
||||||
<img src="/img/showcase/riftshare-main.webp"></img><br/>
|
|
||||||
</p>
|
|
||||||
|
|
||||||
Easy, Secure, and Free file sharing for everyone. Learn more at [Riftshare.app](https://riftshare.app)
|
|
||||||
|
|
||||||
## Features
|
|
||||||
|
|
||||||
* Easy secure file sharing between computers both in the local network and through the internet
|
|
||||||
* Supports sending files or directories securely through the [magic wormhole protocol](https://magic-wormhole.readthedocs.io/en/latest/)
|
|
||||||
* Compatible with all other apps using magic wormhole (magic-wormhole or wormhole-william CLI, wormhole-gui, etc.)
|
|
||||||
* Automatic zipping of multiple selected files to send at once
|
|
||||||
* Full animations, progress bar, and cancellation support for sending and receiving
|
|
||||||
* Native OS File Selection
|
|
||||||
* Open files in one click once received
|
|
||||||
* Auto Update - don't worry about having the latest release!
|
|
||||||
@ -1,9 +0,0 @@
|
|||||||
|
|
||||||
# Surge
|
|
||||||
|
|
||||||
<p style={{"text-align": "center"}}>
|
|
||||||
<img src="/img/showcase/surge.png"></img><br/>
|
|
||||||
</p>
|
|
||||||
|
|
||||||
[Surge](https://surge.rule110.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.
|
|
||||||
|
|
||||||
@ -1,9 +0,0 @@
|
|||||||
|
|
||||||
# Wally
|
|
||||||
|
|
||||||
<p style={{"text-align": "center"}}>
|
|
||||||
<img src="/img/showcase/wally.png"></img><br/>
|
|
||||||
</p>
|
|
||||||
|
|
||||||
[Wally](https://ergodox-ez.com/pages/wally) is the official firmware flasher for [Ergodox](https://ergodox-ez.com/) keyboards. It looks great and is a fantastic example of what you can achieve with Wails: the ability to combine the power of Go and the rich graphical tools of the web development world.
|
|
||||||
|
|
||||||
@ -1,10 +0,0 @@
|
|||||||
|
|
||||||
# Wombat
|
|
||||||
|
|
||||||
<p style={{"text-align": "center"}}>
|
|
||||||
<img src="/img/showcase/wombat.png"></img><br/>
|
|
||||||
</p>
|
|
||||||
|
|
||||||
|
|
||||||
[Wombat](https://github.com/rogchap/wombat) is a cross platform gRPC client.
|
|
||||||
|
|
||||||
@ -1,10 +0,0 @@
|
|||||||
|
|
||||||
# Ytd
|
|
||||||
|
|
||||||
<p>
|
|
||||||
<img src="/img/showcase/ytd.png"></img><br/>
|
|
||||||
</p>
|
|
||||||
|
|
||||||
|
|
||||||
[Ytd](https://github.com/marcio199226/ytd/tree/v2-wails) is an app for downloading tracks from youtube, creating offline playlists and share them with your friends, your friends will be able to playback your playlists or download them for offline listening, has an built-in player.
|
|
||||||
|
|
||||||
@ -1,44 +0,0 @@
|
|||||||
---
|
|
||||||
sidebar_position: 1
|
|
||||||
---
|
|
||||||
|
|
||||||
# 模板
|
|
||||||
|
|
||||||
此页面用作社区支持的模板列表。请提交一个包含您的模板的 PR（点击页面底部的`编辑此页`）。要构建您自己的模板，请参考[模板](../guides/templates)指南。
|
|
||||||
|
|
||||||
要使用这些模板，请运行 `wails init -n "您的项目名" -t [下面的链接[@版本]]`
|
|
||||||
|
|
||||||
如果不带版本后缀，默认使用的是主分支代码模板，如果带有版本后缀，则使用该版本对应标签的代码模板。
|
|
||||||
|
|
||||||
示例：`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 的模板
|
|
||||||
- [wails-template-nextjs](https://github.com/LGiki/wails-template-nextjs) - 基于 Next.js + 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 的模板
|
|
||||||
@ -1,4 +0,0 @@
|
|||||||
{
|
|
||||||
"label": "Getting Started",
|
|
||||||
"position": 10
|
|
||||||
}
|
|
||||||
@ -1,24 +0,0 @@
|
|||||||
---
|
|
||||||
title: 编译您的项目
|
|
||||||
sidebar_position: 6
|
|
||||||
---
|
|
||||||
|
|
||||||
# 编译您的项目
|
|
||||||
|
|
||||||
从项目目录，运行`wails build`。 这将编译您的项目并将构建的可用于生产的二进制文件保存在 `build/bin` 目录中。
|
|
||||||
|
|
||||||
如果您运行二进制文件，您应该会看到默认应用程序：
|
|
||||||
|
|
||||||
<div class="text--center">
|
|
||||||
<img
|
|
||||||
src="/img/defaultproject.png"
|
|
||||||
width="50%"
|
|
||||||
style={{
|
|
||||||
"box-shadow":
|
|
||||||
"rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px",
|
|
||||||
}}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<br />
|
|
||||||
|
|
||||||
有关编译选项的更多详细信息，请参阅[构建命令](../reference/cli#构建)。
|
|
||||||
@ -1,16 +0,0 @@
|
|||||||
---
|
|
||||||
title: 开发您的应用程序
|
|
||||||
sidebar_position: 5
|
|
||||||
---
|
|
||||||
|
|
||||||
# 开发您的应用程序
|
|
||||||
|
|
||||||
您可以通过运行`wails dev`从项目目录在开发模式下运行您的应用程序。这将执行以下操作：
|
|
||||||
|
|
||||||
- 构建您的应用程序并运行它
|
|
||||||
- 监听 Go 文件中的修改并在更改时重新构建/重新运行
|
|
||||||
- 设置将通过浏览器为您的应用程序提供服务的[网络服务器](http://localhost:34115)。这允许您使用您喜欢的浏览器扩展。您甚至可以从控制台调用 Go 代码。
|
|
||||||
|
|
||||||
首先，在项目目录中运行`wails dev`。可以在[此处](../reference/cli#开发)找到有关这方面的更多信息。
|
|
||||||
|
|
||||||
即将提供：教程
|
|
||||||
@ -1,51 +0,0 @@
|
|||||||
---
|
|
||||||
title: 创建项目
|
|
||||||
sidebar_position: 2
|
|
||||||
---
|
|
||||||
|
|
||||||
# 创建项目
|
|
||||||
|
|
||||||
## 项目生成
|
|
||||||
|
|
||||||
现在 CLI 已安装，您可以使用该`wails init`命令生成一个新项目。
|
|
||||||
|
|
||||||
为了快速启动和运行，您可以通过运行`wails init -n myproject`生成一个默认项目。这将创建一个名为`myproject`的目录，并使用默认模板填充它。
|
|
||||||
|
|
||||||
其他可用的项目模板可以使用 `wails init -l`列出。这里也有提供不同功能和框架的[社区模板](../community/templates)。
|
|
||||||
|
|
||||||
要查看其他可用选项，您可以运行 `wails init -help`。 更多详细信息可以在 [初始化命令](../reference/cli#初始化)中找到。
|
|
||||||
|
|
||||||
## 项目布局
|
|
||||||
|
|
||||||
Wails 项目具有以下布局：
|
|
||||||
|
|
||||||
```
|
|
||||||
.
|
|
||||||
├── build/
|
|
||||||
│ ├── appicon.png
|
|
||||||
│ ├── darwin/
|
|
||||||
│ └── windows/
|
|
||||||
├── frontend/
|
|
||||||
├── go.mod
|
|
||||||
├── go.sum
|
|
||||||
├── main.go
|
|
||||||
└── wails.json
|
|
||||||
```
|
|
||||||
|
|
||||||
### 项目结构概要
|
|
||||||
|
|
||||||
- `/main.go` - 主应用
|
|
||||||
- `/frontend/` - 前端项目文件
|
|
||||||
- `/build/` - 项目构建目录
|
|
||||||
- `/build/appicon.png` - 应用程序图标
|
|
||||||
- `/build/darwin/` - Mac 特定的项目文件
|
|
||||||
- `/build/windows/` - Windows 特定的项目文件
|
|
||||||
- `/wails.json` - 项目配置
|
|
||||||
- `/go.mod` - Go mod 文件
|
|
||||||
- `/go.sum` - Go mod 校验文件
|
|
||||||
|
|
||||||
`frontend`目录没有特定于 Wails 的内容，可以是您选择的任何前端项目。
|
|
||||||
|
|
||||||
`build`目录在构建过程中使用。这些文件可以修改以自定义您的构建。如果文件从构建目录中删除，将重新生成默认版本。
|
|
||||||
|
|
||||||
`go.mod`中的默认模块名称是“changeme”。您应该将其更改为更合适的内容。
|
|
||||||
@ -1,84 +0,0 @@
|
|||||||
---
|
|
||||||
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";
|
|
||||||
|
|
||||||
<Tabs
|
|
||||||
defaultValue="Windows"
|
|
||||||
values={[
|
|
||||||
{ label: "Windows", value: "Windows" },
|
|
||||||
{ label: "MacOS", value: "MacOS" },
|
|
||||||
{ label: "Linux", value: "Linux" },
|
|
||||||
]}
|
|
||||||
>
|
|
||||||
<TabItem value="Windows">
|
|
||||||
Wails 要求安装
|
|
||||||
<a href="https://developer.microsoft.com/zh-cn/microsoft-edge/webview2/">
|
|
||||||
WebView2
|
|
||||||
</a>
|
|
||||||
运行时。一些 Windows 已经默认安装了这个。您可以使用{" "}
|
|
||||||
<code>wails doctor</code>
|
|
||||||
命令进行检查（见下文）。
|
|
||||||
</TabItem>
|
|
||||||
<TabItem value="MacOS">
|
|
||||||
Wails 要求安装 xcode 命令行工具。这可以通过运行以下命令来完成：
|
|
||||||
<br />
|
|
||||||
<code>xcode-select --install</code>
|
|
||||||
</TabItem>
|
|
||||||
<TabItem value="Linux">
|
|
||||||
Linux 需要标准的<code>gcc</code>构建工具以及 <code>libgtk3</code>和
|
|
||||||
<code>libwebkit</code>。与其为不同的发行版列出大量命令，Wails
|
|
||||||
可以尝试确定针对您的特定发行版的安装命令。安装后运行
|
|
||||||
<code>wails doctor</code>
|
|
||||||
以显示如何安装依赖项。如果您的发行版/包管理器不受支持，请参阅<a href="../guides/linux-distro-support">添加Linux发行版</a>指南。
|
|
||||||
</TabItem>
|
|
||||||
</Tabs>
|
|
||||||
|
|
||||||
## 可选依赖
|
|
||||||
|
|
||||||
- [UPX](https://upx.github.io/) 用于压缩您的应用程序。
|
|
||||||
|
|
||||||
## 安装 Wails
|
|
||||||
|
|
||||||
运行 `go install github.com/wailsapp/wails/v2/cmd/wails@latest` 安装 Wails CLI。
|
|
||||||
|
|
||||||
## 系统检查
|
|
||||||
|
|
||||||
运行 `wails doctor` 将检查您是否安装了正确的依赖项。如果没有，它会就缺少的内容提供建议以帮助纠正问题。
|
|
||||||
@ -1,4 +0,0 @@
|
|||||||
{
|
|
||||||
"label": "Guides",
|
|
||||||
"position": 50
|
|
||||||
}
|
|
||||||
@ -1,165 +0,0 @@
|
|||||||
# 应用开发
|
|
||||||
|
|
||||||
使用 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`。如果此方法返回错误，则应用程序将终止。在开发模式下，错误会输出到控制台。
|
|
||||||
- `shutdown`方法会在应用程序关闭进程时调用，这是释放内存和执行任何关闭任务的好地方。
|
|
||||||
|
|
||||||
`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 方法)。
|
|
||||||
|
|
||||||
可以在[此处](../howdoesitwork#方法绑定)找到有关绑定的更多信息。
|
|
||||||
|
|
||||||
## 应用程序菜单
|
|
||||||
|
|
||||||
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`， 如何做到这一点完全取决于您。您可以像 vanilla 模板一样使用 vanilla html/css/js 文件。您可能有一些复杂的构建系统，但这并不影响。
|
|
||||||
|
|
||||||
当运行`wails build`时，它会检查项目根目录的`wails.json`文件。文件中有 2 个字段会被读取：
|
|
||||||
|
|
||||||
- "frontend:install"
|
|
||||||
- "frontend:build"
|
|
||||||
|
|
||||||
第一个，如果有给定，将在`frontend`目录中执行以安装 node 模块。第二个，如果有给定，将在`frontend`目录中执行以构建前端项目。
|
|
||||||
|
|
||||||
如果没有给出这两个字段，那么 Wails 不会对前端做任何操作。它仅仅被用作`embed.FS`。
|
|
||||||
|
|
||||||
## 内置开发服务器
|
|
||||||
|
|
||||||
运行`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`文件。您应该在项目生成后将其更改为更合适的内容。
|
|
||||||
@ -1,36 +0,0 @@
|
|||||||
# 前沿风险技术
|
|
||||||
|
|
||||||
## 概述
|
|
||||||
|
|
||||||
Wails 一直在开发中，新版本会定期“标记”。这通常发生在`master`分支上所有较新的代码都经过测试并确认有效时。如果您需要尚未发布的错误修复或功能，可以通过以下步骤使用最新的“前沿风险”版本：
|
|
||||||
|
|
||||||
- `git clone https://github.com/wailsapp/wails`
|
|
||||||
- `cd wails/v2/cmd/wails`
|
|
||||||
- `go install`
|
|
||||||
|
|
||||||
注意：您将项目克隆到的目录现在将被称为“clonedir”。
|
|
||||||
|
|
||||||
Wails CLI 现在将是最新版本。要更新项目以使用最新版本，请更新项目并确保以下行位于`go.mod`文件底部：
|
|
||||||
|
|
||||||
`replace github.com/wailsapp/wails/v2 => <clonedir>`
|
|
||||||
|
|
||||||
示例：
|
|
||||||
|
|
||||||
在 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`
|
|
||||||
|
|
||||||
要恢复到稳定版本，请运行：
|
|
||||||
|
|
||||||
`go install github.com/wailsapp/wails/v2/cmd/wails@latest`
|
|
||||||
|
|
||||||
## 测试一个分支
|
|
||||||
|
|
||||||
如果要测试一个分支，请按照上面的说明进行操作，但请确保在安装之前切换要测试的分支：
|
|
||||||
|
|
||||||
- `git clone https://github.com/wailsapp/wails`
|
|
||||||
- `git checkout -b branch-to-test --track origin/branch-to-test`
|
|
||||||
- `cd wails/v2/cmd/wails`
|
|
||||||
- `go install`
|
|
||||||
@ -1,29 +0,0 @@
|
|||||||
# 参与贡献
|
|
||||||
|
|
||||||
这个页面是关于如何贡献 Wails 项目的指南。
|
|
||||||
|
|
||||||
首先，有一个警告：Wails v2 已经经历了多次迭代和调整。有很多代码要么被搁置要么被弃用。阅读整个项目并试图理解它可能会令人困惑。本文档旨在关注当前的内容以及如何理解当前内容。
|
|
||||||
|
|
||||||
## 漏洞
|
|
||||||
|
|
||||||
对于提出漏洞，请在 GitHub 上打开一个 Issue 并给出[v2]标签。在 Issue 中包含`wails doctor`的输出以帮助我们了解您的环境。
|
|
||||||
|
|
||||||
对于修复漏洞，请在您想要接受的 Issue 上发表评论，我们将在 Issue 上贴上标签。最好使用 Windows，因为它是使用纯 Go 中完成的，调试更容易。
|
|
||||||
|
|
||||||
## 功能
|
|
||||||
|
|
||||||
要请求新功能，请提出一个 Issue 以便讨论。Issue 应带有“Feature Request”标签。这些将被讨论，如果被选中进行开发，将被贴上“Ready for Development”的标签。
|
|
||||||
|
|
||||||
要实现新功能，请按上述方式提出 Issue 或选择带有“Ready for Development”标签的工单。
|
|
||||||
|
|
||||||
在提出 PR 时，请注意说明 PR 已在哪些平台上进行过测试。除非它适用于所有平台（如果可以）,否则任何新功能都不会被接受。
|
|
||||||
|
|
||||||
:::warning 不应该做的
|
|
||||||
|
|
||||||
没有 Issue 的新功能 PR 是没有帮助的，因为 PR 没有上下文，也不会被优先考虑。
|
|
||||||
|
|
||||||
:::
|
|
||||||
|
|
||||||
## 文档
|
|
||||||
|
|
||||||
通过单击任何页面上的“编辑此页”链接，可以轻松地为文档做出贡献。文档更新可以随时完成，无需 Issue。
|
|
||||||
@ -1,31 +0,0 @@
|
|||||||
# 无边框应用
|
|
||||||
|
|
||||||
Wails 支持无边框应用程序。这可以通过使用[应用程序参数选项](../reference/options#应用程序参数选项)中的[无边框](../reference/options#无边框)字段来实现。
|
|
||||||
|
|
||||||
Wails 为拖动窗口提供了一个简单的解决方案：任何具有“data-wails-drag”属性的 HTML 元素都将充当“拖动手柄”。
|
|
||||||
此属性适用于所有嵌套元素。如果您需要指定不应该拖动的嵌套元素，请在该元素上使用属性“data-wails-no-drag”。
|
|
||||||
|
|
||||||
默认的 vanilla 模板使用它，即使它不是无边框的。整个 body 元素被标记为可拖动。`<div id="input" data-wails-no-drag>`元素被标记为不可拖动。
|
|
||||||
|
|
||||||
```html
|
|
||||||
<html>
|
|
||||||
<head>
|
|
||||||
<link rel="stylesheet" href="/main.css" />
|
|
||||||
</head>
|
|
||||||
|
|
||||||
<body data-wails-drag>
|
|
||||||
<div id="logo"></div>
|
|
||||||
<div id="input" data-wails-no-drag>
|
|
||||||
<input id="name" type="text" />
|
|
||||||
<button onclick="greet()">Greet</button>
|
|
||||||
</div>
|
|
||||||
<div id="result"></div>
|
|
||||||
|
|
||||||
<script src="/main.js"></script>
|
|
||||||
</body>
|
|
||||||
</html>
|
|
||||||
```
|
|
||||||
|
|
||||||
:::info 全屏
|
|
||||||
如果您允许应用程序全屏显示，则此拖动功能将被禁用。
|
|
||||||
:::
|
|
||||||
@ -1,72 +0,0 @@
|
|||||||
# 前端
|
|
||||||
|
|
||||||
## 脚本注入
|
|
||||||
|
|
||||||
当 Wails 为您的`index.html`提供服务时，默认情况下，它会将 2 个脚本注入`<body>`标签以加载`/wails/ipc.js`和`/wails/runtime.js`。 这些文件分别安装绑定和运行时。
|
|
||||||
|
|
||||||
下面的代码显示了这些默认注入的位置：
|
|
||||||
|
|
||||||
```html
|
|
||||||
<html>
|
|
||||||
<head>
|
|
||||||
<title>injection example</title>
|
|
||||||
<link rel="stylesheet" href="/main.css" />
|
|
||||||
<!-- <script src="/wails/ipc.js"></script> -->
|
|
||||||
<!-- <script src="/wails/runtime.js"></script> -->
|
|
||||||
</head>
|
|
||||||
|
|
||||||
<body data-wails-drag>
|
|
||||||
<div class="logo"></div>
|
|
||||||
<div class="result" id="result">Please enter your name below 👇</div>
|
|
||||||
<div class="input-box" id="input" data-wails-no-drag>
|
|
||||||
<input class="input" id="name" type="text" autocomplete="off" />
|
|
||||||
<button class="btn" onclick="greet()">Greet</button>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<script src="/main.js"></script>
|
|
||||||
</body>
|
|
||||||
</html>
|
|
||||||
```
|
|
||||||
|
|
||||||
### 覆盖默认脚本注入
|
|
||||||
|
|
||||||
为了给开发人员提供更大的灵活性，有一个`meta`标签可用于自定义此行为：
|
|
||||||
|
|
||||||
```html
|
|
||||||
<meta name="wails-options" content="[options]" />
|
|
||||||
```
|
|
||||||
|
|
||||||
选项如下：
|
|
||||||
|
|
||||||
| 值 | 描述 |
|
|
||||||
| ------------------- | -------------------------------- |
|
|
||||||
| noautoinjectruntime | 禁用自动注入 `/wails/runtime.js` |
|
|
||||||
| noautoinjectipc | 禁用自动注入 `/wails/ipc.js` |
|
|
||||||
| noautoinject | 禁用所有脚本自动注入 |
|
|
||||||
|
|
||||||
可以使用多个选项，前提是它们以逗号分隔。
|
|
||||||
|
|
||||||
此代码完全有效并且与自动注入版本的操作相同：
|
|
||||||
|
|
||||||
```html
|
|
||||||
<html>
|
|
||||||
<head>
|
|
||||||
<title>injection example</title>
|
|
||||||
<meta name="wails-options" content="noautoinject" />
|
|
||||||
<link rel="stylesheet" href="/main.css" />
|
|
||||||
</head>
|
|
||||||
|
|
||||||
<body data-wails-drag>
|
|
||||||
<div class="logo"></div>
|
|
||||||
<div class="result" id="result">Please enter your name below 👇</div>
|
|
||||||
<div class="input-box" id="input" data-wails-no-drag>
|
|
||||||
<input class="input" id="name" type="text" autocomplete="off" />
|
|
||||||
<button class="btn" onclick="greet()">Greet</button>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<script src="/wails/ipc.js"></script>
|
|
||||||
<script src="/wails/runtime.js"></script>
|
|
||||||
<script src="/main.js"></script>
|
|
||||||
</body>
|
|
||||||
</html>
|
|
||||||
```
|
|
||||||
@ -1,107 +0,0 @@
|
|||||||
# 集成开发环境
|
|
||||||
|
|
||||||
Wails 旨在提供出色的开发体验。为此，我们现在支持生成 IDE 特定配置以提供更顺畅的项目设置。
|
|
||||||
|
|
||||||
目前，我们支持[Visual Studio Code](https://code.visualstudio.com/)，但我们希望尽快支持其他 IDE，例如 Goland。
|
|
||||||
|
|
||||||
## Visual Studio Code
|
|
||||||
|
|
||||||
<p className="text--center">
|
|
||||||
<img src="/img/vscode.png" style={{ width: "75%" }}></img>
|
|
||||||
</p>
|
|
||||||
|
|
||||||
使用`-ide vscode`标志生成项目时，IDE 文件将与其他项目文件一起创建。这些文件放置在`.vscode`目录中，并为调试应用程序提供正确的配置。
|
|
||||||
|
|
||||||
生成的 2 个文件是`tasks.json`和`launch.json`. 以下是为默认 vanilla 项目生成的文件：
|
|
||||||
|
|
||||||
```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`。
|
|
||||||
|
|
||||||
:::
|
|
||||||
@ -1,100 +0,0 @@
|
|||||||
# Linux 发行版支持
|
|
||||||
|
|
||||||
## 概述
|
|
||||||
|
|
||||||
Wails 提供 Linux 支持，但为所有可用发行版提供安装说明是一项不可能完成的任务。相反，Wails 会尝试确定您开发应用程序所需的包是否可以通过系统的包管理器获得。目前，我们支持以下包管理器：
|
|
||||||
|
|
||||||
- apt
|
|
||||||
- dnf
|
|
||||||
- emerge
|
|
||||||
- eopkg
|
|
||||||
- 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`中创建一个名为`<pm>.go`的新文件，其中`<pm>`是包管理器的名称。
|
|
||||||
- 定义一个符合`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 记住
|
|
||||||
如果您添加了对新包管理器的支持，请不要忘记更新此页面！
|
|
||||||
:::
|
|
||||||
@ -1,95 +0,0 @@
|
|||||||
# 手动构建
|
|
||||||
|
|
||||||
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/<projectname>.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]`以压缩应用程序。
|
|
||||||
@ -1,188 +0,0 @@
|
|||||||
# 从 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`。
|
|
||||||
|
|
||||||
### 应用程序生命周期
|
|
||||||
|
|
||||||
在 v1 中，绑定结构中有 2 个特殊方法：`WailsInit()`和`WailsShutdown()`. 这些已被替换为 3 个生命周期回调，作为[应用程序参数选项](../reference/options#应用程序参数选项)的一部分：
|
|
||||||
|
|
||||||
- [应用启动回调](../reference/options#应用启动回调)
|
|
||||||
- [应用退出回调](../reference/options#应用退出回调)
|
|
||||||
- [前端 Dom 加载完成回调](../reference/options#前端-dom-加载完成回调)
|
|
||||||
|
|
||||||
注意：[前端 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
|
|
||||||
}
|
|
||||||
...
|
|
||||||
```
|
|
||||||
|
|
||||||
### 运行时
|
|
||||||
|
|
||||||
v2 中的运行时比 v1 丰富得多，支持菜单、窗口操作和更好的对话框。方法的签名略有变化 - 请参阅[运行时](../reference/runtime/intro)。
|
|
||||||
|
|
||||||
在 v1 中，[运行时](../reference/runtime/intro)可通过传递给`WailsInit()`. 在 v2 中，运行时已移出到它自己的包。运行时中的每个方法都采用`context.Context`传递给了[应用启动回调](../reference/options#应用启动回调)方法。
|
|
||||||
|
|
||||||
```go title="运行时示例"
|
|
||||||
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="资源示例"
|
|
||||||
//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` 文件中。
|
|
||||||
|
|
||||||
文件的格式略有不同。下面是区别：
|
|
||||||
|
|
||||||
<p align="center">
|
|
||||||
|
|
||||||
| v1 | v2 | 注解 |
|
|
||||||
| ------------------ | ---------------- | ------------------------------------------------------------------------------------------------ |
|
|
||||||
| name | name | |
|
|
||||||
| description | | 移除 |
|
|
||||||
| author / name | author / name | |
|
|
||||||
| author / email | author / email | |
|
|
||||||
| version | version | |
|
|
||||||
| binaryname | outputfilename | 变更 |
|
|
||||||
| frontend / dir | | 移除 |
|
|
||||||
| frontend / install | frontend:install | 变更 |
|
|
||||||
| frontend / build | frontend:build | 变更 |
|
|
||||||
| frontend / bridge | | 移除 |
|
|
||||||
| frontend / serve | | 移除 |
|
|
||||||
| tags | | 移除 |
|
|
||||||
| | wailsjsdir | 生成 wailsjs 模块的目录 |
|
|
||||||
| | assetdir | `dev` 模式下前端资源文件目录 |
|
|
||||||
| | reloaddirs | 以逗号分隔的附加目录列表，用于监视更改并在开发模式下触发重新加载。这只需要一些更重要的资源配置。 |
|
|
||||||
|
|
||||||
</p>
|
|
||||||
@ -1,9 +0,0 @@
|
|||||||
# 滚动超出
|
|
||||||
|
|
||||||
[Overscroll](https://developer.mozilla.org/zh-CN/docs/Web/CSS/overscroll-behavior) 是当您滚动超出页面内容边界时有时会获得的“弹跳效果”。这在移动应用程序中很常见。这可以使用 CSS 禁用：
|
|
||||||
|
|
||||||
```css
|
|
||||||
body {
|
|
||||||
overscroll-behavior: none;
|
|
||||||
}
|
|
||||||
```
|
|
||||||
@ -1,26 +0,0 @@
|
|||||||
# 路由
|
|
||||||
|
|
||||||
路由是一种在应用程序中切换视图的流行方式。此页面提供了有关如何执行此操作的一些指导。
|
|
||||||
|
|
||||||
## 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 });
|
|
||||||
```
|
|
||||||
@ -1,412 +0,0 @@
|
|||||||
# 代码签名
|
|
||||||
|
|
||||||
这是有关如何在 MacOS 和 Windows 上对使用 Wails 生成的二进制文件进行签名的指南。该指南将针对 CI 环境，更具体地说是 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.
|
|
||||||
|
|
||||||
首先，您需要一个代码签名证书。如果您还没有，Microsoft 的信息页面会在[此处](https://docs.microsoft.com/en-us/windows-hardware/drivers/dashboard/get-a-code-signing-certificate)列出一些提供商。请注意，除非您需要编写内核级软件，例如设备驱动程序，否则不需要 EV 证书。为了签署你的 Wails 应用程序，一个标准的代码签名证书就可以了。
|
|
||||||
|
|
||||||
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 <signing algorithm> /t <timestamping server> /f certificate\certificate.pfx /p '${{ secrets.WIN_SIGNING_CERT_PASSWORD }}' <path to binary>
|
|
||||||
|
|
||||||
```
|
|
||||||
|
|
||||||
This script creates a new directory for your certificate file, creates the certificate file from our base64 secret, converts it to a .pfx file,
|
|
||||||
and finally signs the binary. The following variables needs to be replaced in the last line:
|
|
||||||
|
|
||||||
- **signing algorithm**: usually sha256.
|
|
||||||
- **timestamping server**: URL to the timestamping server to use with your certificate.
|
|
||||||
- **path to binary**: path to the binary you want to sign.
|
|
||||||
|
|
||||||
Given that our Wails config has `outputfilename` set to "app.exe" and that we have a certificate from SSL.com, this would be our workflow:
|
|
||||||
|
|
||||||
```yaml
|
|
||||||
name: "example"
|
|
||||||
on:
|
|
||||||
workflow_dispatch:
|
|
||||||
# This Action only starts when you go to Actions and manually run the workflow.
|
|
||||||
|
|
||||||
jobs:
|
|
||||||
package:
|
|
||||||
strategy:
|
|
||||||
matrix:
|
|
||||||
platform: [windows-latest, macos-latest]
|
|
||||||
go-version: [1.18]
|
|
||||||
runs-on: ${{ matrix.platform }}
|
|
||||||
steps:
|
|
||||||
- uses: actions/checkout@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
|
|
||||||
<?xml version="1.0" encoding="UTF-8"?>
|
|
||||||
<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
|
|
||||||
<plist version="1.0">
|
|
||||||
<dict>
|
|
||||||
<key>com.apple.security.app-sandbox</key>
|
|
||||||
<true/>
|
|
||||||
<key>com.apple.security.network.client</key>
|
|
||||||
<true/>
|
|
||||||
<key>com.apple.security.network.server</key>
|
|
||||||
<true/>
|
|
||||||
<key>com.apple.security.files.user-selected.read-write</key>
|
|
||||||
<true/>
|
|
||||||
<key>com.apple.security.files.downloads.read-write</key>
|
|
||||||
<true/>
|
|
||||||
</dict>
|
|
||||||
</plist>
|
|
||||||
```
|
|
||||||
|
|
||||||
In this file you configure the entitlements you need for you app, e.g. camera permissions if your app uses the camera. Read more about entitlements [here](https://developer.apple.com/documentation/bundleresources/entitlements).
|
|
||||||
|
|
||||||
Make sure you have updated your `Info.plist` file with the same bundle ID as you entered in `gon-sign.json`.
|
|
||||||
Here's an example `Info.plist` file:
|
|
||||||
|
|
||||||
```plist
|
|
||||||
<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
|
|
||||||
<plist version="1.0"><dict>
|
|
||||||
<key>CFBundlePackageType</key><string>APPL</string>
|
|
||||||
<key>CFBundleName</key><string>MyApp</string>
|
|
||||||
<key>CFBundleExecutable</key><string>app</string>
|
|
||||||
<key>CFBundleIdentifier</key><string>app.myapp</string>
|
|
||||||
<key>CFBundleVersion</key><string>0.1.0</string>
|
|
||||||
<key>CFBundleGetInfoString</key><string>My app is cool and nice and chill and</string>
|
|
||||||
<key>CFBundleShortVersionString</key><string>0.1.0</string>
|
|
||||||
<key>CFBundleIconFile</key><string>iconfile</string>
|
|
||||||
<key>LSMinimumSystemVersion</key><string>10.13.0</string>
|
|
||||||
<key>NSHighResolutionCapable</key><string>true</string>
|
|
||||||
<key>LSApplicationCategoryType</key><string>public.app-category.utilities</string>
|
|
||||||
<key>NSHumanReadableCopyright</key><string>© Me</string>
|
|
||||||
</dict></plist>
|
|
||||||
```
|
|
||||||
|
|
||||||
Now we're ready to add the signing step in our workflow after building the Wails app:
|
|
||||||
|
|
||||||
```yaml
|
|
||||||
- name: Import Code-Signing Certificates for macOS
|
|
||||||
if: matrix.platform == 'macos-latest'
|
|
||||||
uses: Apple-Actions/import-codesign-certs@v1
|
|
||||||
with:
|
|
||||||
# The certificates in a PKCS12 file encoded as a base64 string
|
|
||||||
p12-file-base64: ${{ secrets.APPLE_DEVELOPER_CERTIFICATE_P12_BASE64 }}
|
|
||||||
# The password used to import the PKCS12 file.
|
|
||||||
p12-password: ${{ secrets.APPLE_DEVELOPER_CERTIFICATE_PASSWORD }}
|
|
||||||
- name: Sign our macOS binary
|
|
||||||
if: matrix.platform == 'macos-latest'
|
|
||||||
run: |
|
|
||||||
echo "Signing Package"
|
|
||||||
gon -log-level=info ./build/darwin/gon-sign.json
|
|
||||||
```
|
|
||||||
|
|
||||||
Please note that signing binaries with Apple could take anywhere from minutes to hours.
|
|
||||||
|
|
||||||
## Combined workflow file:
|
|
||||||
|
|
||||||
Here is our GitHub workflow file with Windows + macOS combined:
|
|
||||||
|
|
||||||
```yaml
|
|
||||||
name: "example combined"
|
|
||||||
on:
|
|
||||||
workflow_dispatch:
|
|
||||||
# This Action only starts when you go to Actions and manually run the workflow.
|
|
||||||
|
|
||||||
jobs:
|
|
||||||
package:
|
|
||||||
strategy:
|
|
||||||
matrix:
|
|
||||||
platform: [windows-latest, macos-latest]
|
|
||||||
go-version: [1.18]
|
|
||||||
runs-on: ${{ matrix.platform }}
|
|
||||||
steps:
|
|
||||||
- uses: actions/checkout@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).
|
|
||||||
@ -1,92 +0,0 @@
|
|||||||
# 模板
|
|
||||||
|
|
||||||
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...
|
|
||||||
```
|
|
||||||
|
|
||||||
- 现在可以按照`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 应用程序：
|
|
||||||
|
|
||||||
<div className="text--center">
|
|
||||||
<img src="/img/vue3-template.png" width="50%" />
|
|
||||||
</div>
|
|
||||||
|
|
||||||
## 发布模板
|
|
||||||
|
|
||||||
发布模板只是将文件推送到 GitHub。鼓励以下最佳实践：
|
|
||||||
|
|
||||||
- 从前端目录中删除任何不需要的文件和目录（例如：.git）
|
|
||||||
- 确保`template.json`完整，尤其是`helpurl`
|
|
||||||
- 将文件推送到 GitHub
|
|
||||||
- 在[社区模板](../community/templates)页面上创建 PR
|
|
||||||
- 在[模板公告](https://github.com/wailsapp/wails/discussions/825)讨论板上发布模板
|
|
||||||
@ -1,82 +0,0 @@
|
|||||||
# 故障排除
|
|
||||||
|
|
||||||
各种故障排除技巧。
|
|
||||||
|
|
||||||
## 我的应用程序显示白色/空白屏幕
|
|
||||||
|
|
||||||
检查您的应用程序是否在正确目录中包含资源。在您的`main.go`文件中，您将拥有类似于以下代码的内容：
|
|
||||||
|
|
||||||
```go
|
|
||||||
//go:embed frontend/dist
|
|
||||||
var assets embed.FS
|
|
||||||
```
|
|
||||||
|
|
||||||
检查`frontend/dist`中是否包含您的应用程序资源。
|
|
||||||
|
|
||||||
## Mac 应用程序无效
|
|
||||||
|
|
||||||
如果您构建的应用程序在 finder 中如下所示：
|
|
||||||
|
|
||||||
<p className="text--center">
|
|
||||||
<img src="/img/troubleshooting/invalid_mac_app.png"></img>
|
|
||||||
</p>
|
|
||||||
|
|
||||||
您的应用程序的 `info.plist` 可能无效。更新 `build/<yourapp>.app/Contents/info.plist` 文件并检查数据是否有效，例如二进制文件名称是否正确。要保留更改，请将文件复制回 `build/darwin` 目录。
|
|
||||||
|
|
||||||
## 前端调用后端方法无法使用可变参数
|
|
||||||
|
|
||||||
如果您有使用可变参数定义的后端方法，例如：
|
|
||||||
|
|
||||||
```go
|
|
||||||
func (a *App) TestFunc(msg string, args ...interface{}) error {
|
|
||||||
// Code
|
|
||||||
}
|
|
||||||
```
|
|
||||||
|
|
||||||
像这样从前端调用此方法将失败：
|
|
||||||
|
|
||||||
```js
|
|
||||||
var msg = "Hello: ";
|
|
||||||
var args = ["Go", "JS"];
|
|
||||||
window.go.main.App.TestFunc(msg, ...args)
|
|
||||||
.then((result) => {
|
|
||||||
//do things here
|
|
||||||
})
|
|
||||||
.catch((error) => {
|
|
||||||
//handle error
|
|
||||||
});
|
|
||||||
```
|
|
||||||
|
|
||||||
解决办法：
|
|
||||||
|
|
||||||
```js
|
|
||||||
var msg = "Hello ";
|
|
||||||
var args = ["Go", "JS"];
|
|
||||||
window.go.main.App.TestFunc(msg, args)
|
|
||||||
.then((result) => {
|
|
||||||
// 不需要展开符
|
|
||||||
// do things here
|
|
||||||
})
|
|
||||||
.catch((error) => {
|
|
||||||
//handle error
|
|
||||||
});
|
|
||||||
```
|
|
||||||
|
|
||||||
归功于：https://github.com/wailsapp/wails/issues/1186
|
|
||||||
|
|
||||||
## 尝试安装 Wails 时遇到代理错误
|
|
||||||
|
|
||||||
如果您遇到这样的错误：
|
|
||||||
|
|
||||||
```
|
|
||||||
"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.
|
|
||||||
```
|
|
||||||
|
|
||||||
这可能是因为官方 Go Proxy 被阻止（中国用户反馈了这一点）。解决方案是手动设置代理，例如：
|
|
||||||
|
|
||||||
```
|
|
||||||
go env -w GO111MODULE=on
|
|
||||||
go env -w GOPROXY=https://goproxy.cn,direct
|
|
||||||
```
|
|
||||||
|
|
||||||
来源：https://github.com/wailsapp/wails/issues/1233
|
|
||||||
@ -1,53 +0,0 @@
|
|||||||
# NSIS 安装程序
|
|
||||||
|
|
||||||
<p style={{ "text-align": "center" }}>
|
|
||||||
<img src="/img/nsis.png" style={{ "max-width": "50%" }}></img>
|
|
||||||
<br />
|
|
||||||
</p>
|
|
||||||
|
|
||||||
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 配置文件：
|
|
||||||
|
|
||||||
```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`目录中。
|
|
||||||
@ -1,31 +0,0 @@
|
|||||||
# 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（错误）
|
|
||||||
|
|
||||||
### 下载
|
|
||||||
|
|
||||||
此选项将提示用户在未找到合适的运行时时，提供从 Microsoft 的 WebView2 官方站点下载并运行引导程序。如果用户继续，官方引导程序将被下载并运行。
|
|
||||||
|
|
||||||
### 内嵌
|
|
||||||
|
|
||||||
此选项将官方引导程序嵌入到应用程序中。如果没有找到合适的运行时，应用程序将提供并运行引导程序。这将使二进制大小增加约 150k。
|
|
||||||
|
|
||||||
### 浏览器
|
|
||||||
|
|
||||||
此选项将提示用户没有找到合适的运行时时，提供打开浏览器到 WebView2 官方页面，可以下载和安装引导程序。然后应用程序将会退出，安装的操作留给用户。
|
|
||||||
|
|
||||||
### 错误
|
|
||||||
|
|
||||||
如果未找到合适的运行时间，则会向用户显示错误并且不采取进一步措施。
|
|
||||||
@ -1,373 +0,0 @@
|
|||||||
---
|
|
||||||
title: 它是如何工作的？
|
|
||||||
sidebar_position: 20
|
|
||||||
---
|
|
||||||
|
|
||||||
# 它是如何工作的？
|
|
||||||
|
|
||||||
Wails 应用程序是一个带有一个 webkit 前端的标准的 Go 应用程序。 应用程序的 Go 部分由应用程序代码和一个运行时库组成，
|
|
||||||
该库提供了许多有用的操作，例如控制应用程序窗口。 前端是一个 webkit 窗口，将显示前端资源。 前端还可以使用运行时库的 Javascript 版本。
|
|
||||||
最后，可以将 Go 方法绑定到前端，这些将显示为可以调用的 Javascript 方法，就像它们是原生 Javascript 方法一样。
|
|
||||||
|
|
||||||
<div className="text--center">
|
|
||||||
<img src="/img/architecture.svg" width="75%" />
|
|
||||||
</div>
|
|
||||||
|
|
||||||
## 主应用程序
|
|
||||||
|
|
||||||
### 概述
|
|
||||||
|
|
||||||
主应用程序由对`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`命令在“开发”模式下，资源从磁盘加载，任何更改都会导致“实时重新加载”。资源的位置需要使用`-assetdir`传递给`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 应用程序中最重要的参数选项之一。它指定向前端暴露哪些结构方法。当应用程序启动时，它会检查 `Bind` 中列出的结构实例，
|
|
||||||
确定哪些方法是公开的（以大写字母开头），并将生成前端可以调用的那些方法的 Javascript 版本。
|
|
||||||
|
|
||||||
:::info 注意
|
|
||||||
|
|
||||||
Wails 要求您传入结构的 _实例_ 才能正确绑定它
|
|
||||||
|
|
||||||
:::
|
|
||||||
|
|
||||||
在此示例中，我们创建一个新`App`实例，然后将此实例添加到`wails.Run`中的`Bind`选项：
|
|
||||||
|
|
||||||
```go {16,26} 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)
|
|
||||||
}
|
|
||||||
```
|
|
||||||
|
|
||||||
您可以绑定任意数量的结构体。只需确保创建它的一个实例并将其传递给 `Bind`：
|
|
||||||
|
|
||||||
```go {10-12}
|
|
||||||
...
|
|
||||||
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{},
|
|
||||||
},
|
|
||||||
})
|
|
||||||
...
|
|
||||||
```
|
|
||||||
|
|
||||||
这些方法位于前端 `window.go.<packagename>.<struct>.<method>`。在上面的例子中，我们绑定 `app`，它有一个公开方法 `Greet`。这可以通过在 `Javascript` 中用 `window.go.main.App.Greet`调用。这些方法返回一个 Promise。成功的调用将导致 Go 调用的第一个返回值被传递给 `resolve` 处理程序。一个不成功的调用是将一个 Go 方法的第二个错误类型返回值通过`reject`传递回调用者。在上面的例子中，Greet 只返回一个字符串，所以 `Javascript` 调用永远不会`reject` - 除非将无效数据传递给它。
|
|
||||||
|
|
||||||
所有数据类型都在 Go 和 Javascript 之间正确转换。包括结构体。如果您从 Go 调用返回一个结构体，它将作为 `Javascript` Map 返回到您的前端。
|
|
||||||
注意：如果您想使用结构体，您必须为您的结构体字段定义`json` 标签！
|
|
||||||
|
|
||||||
:::info 注意
|
|
||||||
目前不支持嵌套匿名结构体。
|
|
||||||
:::
|
|
||||||
|
|
||||||
也可以将结构体发送回 Go。任何作为期望结构的参数传递的 Javascript Map 都将转换为该结构类型。
|
|
||||||
为了使这个过程更容易，在 `开发`模式下，会生成一个 TypeScript 模块，定义绑定方法中使用的所有结构类型。使用此模块，可以构建原生 Javascript 对象并将其发送到 Go 代码。
|
|
||||||
|
|
||||||
关于绑定的更多信息可以在[应用程序开发指南](./guides/application-development)的[绑定方法](./guides/application-development#绑定方法)一节中找到。
|
|
||||||
|
|
||||||
## 前端
|
|
||||||
|
|
||||||
### 概述
|
|
||||||
|
|
||||||
前端是由 webkit 渲染的文件集合。这就像浏览器和网络服务器合二为一。您可以使用的框架或库[^1]几乎没有限制。前端和 Go 代码之间的主要交互点是：
|
|
||||||
|
|
||||||
- 调用绑定的 Go 方法
|
|
||||||
- 调用运行时方法
|
|
||||||
|
|
||||||
[^1]: 有一小部分库使用了 WebView 中不支持的功能。对于这种情况，通常有替代方案和解决方法。
|
|
||||||
|
|
||||||
### 调用绑定的 Go 方法
|
|
||||||
|
|
||||||
所有绑定的 Go 方法都可以在`window.go.<package>.<struct>.<method>`调用. 如上一节所述，这些方法返回一个 Promise，
|
|
||||||
其中成功调用将值返回给 resolve 处理程序，错误将值返回给 reject 处理程序。
|
|
||||||
|
|
||||||
```go title="mycode.js"
|
|
||||||
window.go.main.App.Greet("Bill").then((result) => {
|
|
||||||
console.log("The greeting is: " + result);
|
|
||||||
})
|
|
||||||
```
|
|
||||||
|
|
||||||
在`开发`模式下运行应用程序时，会生成一个 javascript 模块，该模块用 JSDoc 注释包装这些方法。这确实有助于开发，尤其是因为大多数 IDE 将处理 JSDoc 以提供代码完成和类型提示。该模块名为`go` 并在`wailsjsdir`标志指定的目录中生成。在这个模块中有一个`bindings.js`的文件，其中包含这些包装器。对于上面的示例，该文件包含以下代码：
|
|
||||||
|
|
||||||
```js title="bindings.js"
|
|
||||||
const go = {
|
|
||||||
main: {
|
|
||||||
App: {
|
|
||||||
/**
|
|
||||||
* Greet
|
|
||||||
* @param {Person} arg1 - Go Type: string
|
|
||||||
* @returns {Promise<string>} - Go Type: string
|
|
||||||
*/
|
|
||||||
Greet: (arg1) => {
|
|
||||||
return window.go.main.App.Greet(arg1);
|
|
||||||
},
|
|
||||||
},
|
|
||||||
},
|
|
||||||
};
|
|
||||||
export default go;
|
|
||||||
```
|
|
||||||
|
|
||||||
#### 支持结构体
|
|
||||||
|
|
||||||
还额外支持在其签名中使用结构的 Go 方法。所有由绑定方法指定的 Go 结构体（作为参数或返回类型）都将自动生成 Typescript 版本作为 Go 代码包装器模块的一部分。
|
|
||||||
使用这些，可以在 Go 和 Javascript 之间共享相同的数据模型。这些模型与 JSDoc 注释一致，支持 IDE 代码自动完成。
|
|
||||||
|
|
||||||
示例：我们更新我们的`Gree`方法以接受一个`Person`而不是字符串：
|
|
||||||
|
|
||||||
```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)
|
|
||||||
}
|
|
||||||
```
|
|
||||||
|
|
||||||
我们的`bindings.js`文件现已更新以反映更改：
|
|
||||||
|
|
||||||
```js title="bindings.js"
|
|
||||||
const go = {
|
|
||||||
main: {
|
|
||||||
App: {
|
|
||||||
/**
|
|
||||||
* Greet
|
|
||||||
* @param {Person} arg1 - Go Type: main.Person
|
|
||||||
* @returns {Promise<string>} - Go Type: string
|
|
||||||
*/
|
|
||||||
Greet: (arg1) => {
|
|
||||||
return window.go.main.App.Greet(arg1);
|
|
||||||
},
|
|
||||||
},
|
|
||||||
},
|
|
||||||
};
|
|
||||||
export default go;
|
|
||||||
```
|
|
||||||
|
|
||||||
此外`bindings.js`，还有一个名为`models.ts`的文件. 这包含我们 Go 结构体的 TypeScript 形式：
|
|
||||||
|
|
||||||
```ts title="models.ts"
|
|
||||||
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;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
```
|
|
||||||
|
|
||||||
只要您将 TypeScript 作为前端构建配置的一部分，您就可以通过以下方式使用这些模型：
|
|
||||||
|
|
||||||
```js title="mycode.js"
|
|
||||||
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);
|
|
||||||
});
|
|
||||||
}
|
|
||||||
```
|
|
||||||
|
|
||||||
JSDoc 和 TypeScript 生成模型的组合构成了一个强大的开发环境。
|
|
||||||
|
|
||||||
### 调用运行时方法
|
|
||||||
|
|
||||||
Javascript 运行时位于`window.runtime`并包含许多方法来执行各种任务，例如发出事件或执行日志记录操作：
|
|
||||||
|
|
||||||
```js title="mycode.js"
|
|
||||||
window.runtime.EventsEmit("my-event", 1);
|
|
||||||
```
|
|
||||||
|
|
||||||
可以在[运行时参考](./reference/runtime/intro)中找到有关 JS 运行时的更多详细信息。
|
|
||||||
@ -1,57 +0,0 @@
|
|||||||
---
|
|
||||||
title: 简介
|
|
||||||
|
|
||||||
sidebar_position: 1
|
|
||||||
---
|
|
||||||
|
|
||||||
# 简介
|
|
||||||
|
|
||||||
## 概述
|
|
||||||
|
|
||||||
Wails 是一个可让您使用 Go 和 Web 技术编写桌面应用的项目。
|
|
||||||
|
|
||||||
将它看作为 Go 的快并且轻量的 Electron 替代品。 您可以使用 Go 的灵活性和强大功能，结合丰富的现代前端，轻松的构建应用程序。
|
|
||||||
|
|
||||||
Wails 一点也不弱！这是 [xbar](https://xbarapp.com) - 一个使用 Wails 编写的 MacOS 桌面应用。它使用 Mac 的系统原生菜单，支持浅色和深色桌面主题，主窗口使用半透明，使其具有原生应用的“冰霜” 效果。
|
|
||||||
|
|
||||||
<div class="text--center">
|
|
||||||
<a href="https://xbarapp.com">
|
|
||||||
<img src="/img/xbar-app-preview-2.png" />
|
|
||||||
</a>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
## 原生元素
|
|
||||||
|
|
||||||
Wails 使用专门构建的库来处理原生元素，例如窗口、菜单、对话框等，因此您可以构建美观、功能丰富的桌面应用程序。
|
|
||||||
|
|
||||||
**它不嵌入浏览器**，因此性能高。相反，它使用平台的原生渲染引擎。在 Windows 上，是基于 Chromium 构建的新 Microsoft Webview2 库。
|
|
||||||
|
|
||||||
## Go 和 Javascript 互操作
|
|
||||||
|
|
||||||
Wails 自动使您的 Go 方法可用于 Javascript，因此您可以从前端按名称调用它们！它甚至会生成 Go 方法使用的结构体的 Typescript 版本，因此您可以在 Go 和 Javascript 之间传递相同的数据结构。
|
|
||||||
|
|
||||||
## 运行时库
|
|
||||||
|
|
||||||
Wails 为 Go 和 Javascript 提供了一个运行时库，可以处理现代应用程序需要的很多东西，比如事件、日志、对话框等。
|
|
||||||
|
|
||||||
## 实时开发体验
|
|
||||||
|
|
||||||
### 自动重新构建
|
|
||||||
|
|
||||||
当您在“开发”模式下运行您的应用程序时，Wails 会将您的应用程序构建为原生桌面应用程序，但会从磁盘读取您的资源。它将检测您的 Go 代码的任何更改并自动重新构建和重新启动您的应用程序。
|
|
||||||
|
|
||||||
### 自动重新加载
|
|
||||||
|
|
||||||
当检测到您的应用程序资源发生更改时，您正在运行的应用程序将“重新加载”，几乎立即反馈您的更改。
|
|
||||||
|
|
||||||
### 在浏览器中开发您的应用程序
|
|
||||||
|
|
||||||
如果您更喜欢在浏览器中调试和开发，那么 Wails 可以满足您的需求。正在运行的应用程序还有一个网络服务器，它将在连接到它的任何浏览器中运行您的应用程序。当您的资源在磁盘上发生变化时，它会刷新。
|
|
||||||
|
|
||||||
## 可用于生产的原生二进制文件
|
|
||||||
|
|
||||||
当您准备好完成应用程序的最终构建时，CLI 会将其编译为单个可执行文件，并将所有资源打包到其中。在 Windows 和 MacOS 上，可以创建用于分发的原生包。使用打包工具后生成的资源（图标、info.plist、清单文件等）是您项目的一部分，可以自定义，让您完全控制应用程序的构建方式。
|
|
||||||
|
|
||||||
## 工具
|
|
||||||
|
|
||||||
Wails CLI 提供了一种简单的方法来生成、构建和打包您的应用程序。它将完成创建图标的繁重工作，使用最佳设置编译您的应用程序，并提供可分发的、可用于生产的二进制文件。可以从许多入门模板中进行选择，以快速启动和运行！
|
|
||||||
@ -1,4 +0,0 @@
|
|||||||
{
|
|
||||||
"label": "Reference",
|
|
||||||
"position": 40
|
|
||||||
}
|
|
||||||
@ -1,214 +0,0 @@
|
|||||||
---
|
|
||||||
title: 命令行
|
|
||||||
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`。注意，如果没有指定架构，则使用`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 | 在应用程序中保留调试信息 | 否 |
|
|
||||||
|
|
||||||
有关`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.
|
|
||||||
|
|
||||||
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 | 资源更改时禁用自动重新加载 | |
|
|
||||||
| -v | 详细级别 (0 - silent, 1 - standard, 2 - verbose) | 1 |
|
|
||||||
| -wailsjsdir | 生成生成的 Wails JS 模块的目录 | `wails.json`中的值 |
|
|
||||||
| -debounce | 检测到资源更改后等待重新加载的时间 | 100 (毫秒) |
|
|
||||||
| -devserverurl "url" | 使用第 3 方开发服务器 url, 例如 Vite | "http://localhost:34115" |
|
|
||||||
| -appargs "args" | 以 shell 样式传递给应用程序的参数 | |
|
|
||||||
| -platform "platform" | 目标平台/架构 | `runtime.GOOS` |
|
|
||||||
| -save | 将指定的 `assetdir`、 `reloaddirs`、 `wailsjsdir`、 `debounce` 和 `devserverurl` 标志的值保存到 `wails.json` 以成为后续调用的默认值。 | |
|
|
||||||
|
|
||||||
示例：
|
|
||||||
|
|
||||||
`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)。
|
|
||||||
|
|
||||||
## 更新
|
|
||||||
|
|
||||||
`wails update` 将更新 Wails CLI 的版本。
|
|
||||||
|
|
||||||
| 标志 | 描述 |
|
|
||||||
| :-------------- | :--------------------- |
|
|
||||||
| -pre | 更新到最新的预发布版本 |
|
|
||||||
| -version "版本" | 安装指定版本的 CLI |
|
|
||||||
|
|
||||||
## 版本
|
|
||||||
|
|
||||||
`wails version` 仅输出当前的 CLI 版本。
|
|
||||||
@ -1,243 +0,0 @@
|
|||||||
---
|
|
||||||
sidebar_position: 4
|
|
||||||
---
|
|
||||||
|
|
||||||
# 应用菜单
|
|
||||||
|
|
||||||
可以通过定义 [菜单](#菜单) 结构并设置 [`Menu`](../reference/options#菜单) 选项或者通过调用运行时方法 [设置应用程序菜单](../reference/runtime/menu#设置应用程序菜单) 来将应用程序菜单添加到 Wails 项目。
|
|
||||||
|
|
||||||
也可以通过更新菜单结构并调用[更新应用程序菜单](../reference/runtime/menu#更新应用程序菜单)来动态更新菜单 。
|
|
||||||
|
|
||||||
示例:
|
|
||||||
|
|
||||||
```go
|
|
||||||
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)
|
|
||||||
|
|
||||||
```
|
|
||||||
|
|
||||||
上面的示例使用快捷方法，但是可以手动构建菜单结构。
|
|
||||||
|
|
||||||
## 菜单
|
|
||||||
|
|
||||||
菜单是菜单项的集合：
|
|
||||||
|
|
||||||
```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
|
|
||||||
}
|
|
||||||
```
|
|
||||||
|
|
||||||
| 字段 | 类型 | 注解 |
|
|
||||||
| ----------- | ----------------------------- | ------------------------------------------- |
|
|
||||||
| Label | string | 菜单文字 |
|
|
||||||
| Accelerator | [\*keys.Accelerator](#加速器) | 此菜单项的键绑定 |
|
|
||||||
| Type | [Type](#类型) | 菜单项的类型 |
|
|
||||||
| Disabled | bool | 禁用菜单项 |
|
|
||||||
| Hidden | bool | 隐藏此菜单项 |
|
|
||||||
| Checked | bool | 向菜单项设置选中 (复选框和单选类型) |
|
|
||||||
| SubMenu | [\*Menu](#菜单) | 设置子菜单 |
|
|
||||||
| Click | [Callback](#回调) | 单击菜单时的回调函数 |
|
|
||||||
| Role | string | 定义此菜单项的[角色](#角色)。暂时只支持 Mac |
|
|
||||||
|
|
||||||
### 加速器
|
|
||||||
|
|
||||||
加速器（有时称为键盘快捷键）定义了按键和菜单项之间的绑定。 Wails 将加速器定义为一个组合或键 + [修饰符](#修饰符)。
|
|
||||||
它们在`"github.com/wailsapp/wails/v2/pkg/menu/keys"`包中可用。
|
|
||||||
|
|
||||||
示例:
|
|
||||||
|
|
||||||
```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 相同的语法来解析加速器。 这对于在配置文件中存储加速器很有用。
|
|
||||||
|
|
||||||
示例:
|
|
||||||
|
|
||||||
```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")
|
|
||||||
```
|
|
||||||
|
|
||||||
#### 修饰符
|
|
||||||
|
|
||||||
以下修饰符是可以与加速键组合使用的键：
|
|
||||||
|
|
||||||
```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"
|
|
||||||
)
|
|
||||||
```
|
|
||||||
|
|
||||||
许多快捷方法可用于使用修饰符创建加速器：
|
|
||||||
|
|
||||||
```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
|
|
||||||
```
|
|
||||||
|
|
||||||
修饰符可以结合`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)
|
|
||||||
```
|
|
||||||
|
|
||||||
### 类型
|
|
||||||
|
|
||||||
每个菜单项必须有一个类型，有 5 种类型可用：
|
|
||||||
|
|
||||||
```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"
|
|
||||||
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
|
|
||||||
```
|
|
||||||
|
|
||||||
关于单选菜单组的说明:单选菜单组定义为菜单中相邻的多个单选菜单项。这意味着您不需要将项目分组在一起，因为它是自动的。
|
|
||||||
然而，这也意味着您不能有两个相邻的单选菜单组-它们之间必须有一个非单选菜单项。
|
|
||||||
|
|
||||||
### 回调
|
|
||||||
|
|
||||||
每个菜单项都可能有一个回调，在单击该项时会执行该回调：
|
|
||||||
|
|
||||||
```go title="Package: github.com/wailsapp/wails/v2/pkg/menu"
|
|
||||||
type Callback func(*CallbackData)
|
|
||||||
|
|
||||||
type CallbackData struct {
|
|
||||||
MenuItem *MenuItem
|
|
||||||
}
|
|
||||||
```
|
|
||||||
|
|
||||||
给函数一个`CallbackData`结构体，它指示哪个菜单项触发了回调。这在使用可能共享回调的单选菜单组时很有用。
|
|
||||||
|
|
||||||
### 角色
|
|
||||||
|
|
||||||
:::info 角色
|
|
||||||
|
|
||||||
目前仅 Mac 支持角色。
|
|
||||||
|
|
||||||
:::
|
|
||||||
|
|
||||||
一个菜单项可能有一个角色，它本质上是一个预定义的菜单项。我们目前支持以下角色：
|
|
||||||
|
|
||||||
| 角色 | 描述 |
|
|
||||||
| ------------ | ----------------------------------------------------- |
|
|
||||||
| AppMenuRole | 标准的 Mac 应用程序菜单。可以使用`menu.AppMenu()`创建 |
|
|
||||||
| EditMenuRole | 标准的 Mac 编辑菜单。可以使用`menu.EditMenu()`创建 |
|
|
||||||
@ -1,525 +0,0 @@
|
|||||||
---
|
|
||||||
title: 参数选项
|
|
||||||
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,
|
|
||||||
RGBA: &options.RGBA{R: 0, G: 0, B: 0, A: 255},
|
|
||||||
AlwaysOnTop: false,
|
|
||||||
Assets: assets,
|
|
||||||
Menu: app.applicationMenu(),
|
|
||||||
Logger: nil,
|
|
||||||
LogLevel: logger.DEBUG,
|
|
||||||
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: "",
|
|
||||||
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),
|
|
||||||
},
|
|
||||||
},
|
|
||||||
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,
|
|
||||||
},
|
|
||||||
},
|
|
||||||
})
|
|
||||||
if err != nil {
|
|
||||||
log.Fatal(err)
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
```
|
|
||||||
|
|
||||||
### 标题
|
|
||||||
|
|
||||||
名称：Title
|
|
||||||
|
|
||||||
类型：string
|
|
||||||
|
|
||||||
窗口标题栏中显示的文本。
|
|
||||||
|
|
||||||
### 宽度
|
|
||||||
|
|
||||||
名称：Width
|
|
||||||
|
|
||||||
类型：int
|
|
||||||
|
|
||||||
窗口的初始宽度。默认值：1024。
|
|
||||||
|
|
||||||
### 高度
|
|
||||||
|
|
||||||
名称：Height
|
|
||||||
|
|
||||||
类型：int
|
|
||||||
|
|
||||||
窗口的初始高度。默认值：768
|
|
||||||
|
|
||||||
### 禁用调整窗口尺寸
|
|
||||||
|
|
||||||
名称：DisableResize
|
|
||||||
|
|
||||||
类型：bool
|
|
||||||
|
|
||||||
默认情况下，主窗口可调整大小。将此设置为 `true` 将使其保持固定大小。
|
|
||||||
|
|
||||||
### 全屏
|
|
||||||
|
|
||||||
名称：Fullscreen
|
|
||||||
|
|
||||||
类型：bool
|
|
||||||
|
|
||||||
将此设置为 `true` 将在启动时使窗口全屏。
|
|
||||||
|
|
||||||
### 无边框
|
|
||||||
|
|
||||||
名称：Frameless
|
|
||||||
|
|
||||||
类型：bool
|
|
||||||
|
|
||||||
设置为`true`时，窗口将没有边框或标题栏。另请参阅[无边框窗口](../guides/frameless)。
|
|
||||||
|
|
||||||
### 最小宽度
|
|
||||||
|
|
||||||
名称：MinWidth
|
|
||||||
|
|
||||||
类型：int
|
|
||||||
|
|
||||||
这将设置窗口的最小宽度。如果给出的值`Width`小于这个值，窗口将被设置为`MinWidth`默认值。
|
|
||||||
|
|
||||||
### 最小高度
|
|
||||||
|
|
||||||
名称：MinHeight
|
|
||||||
|
|
||||||
类型：int
|
|
||||||
|
|
||||||
这将设置窗口的最小高度。如果给出的值`Height`小于这个值，窗口将被设置为`MinHeight`默认值。
|
|
||||||
|
|
||||||
### 最大宽度
|
|
||||||
|
|
||||||
名称：MaxWidth
|
|
||||||
|
|
||||||
类型：int
|
|
||||||
|
|
||||||
这将设置窗口的最大宽度。如果给出的值`Width`大于这个值，窗口将被设置为`MaxWidth`默认值。
|
|
||||||
|
|
||||||
### 最大高度
|
|
||||||
|
|
||||||
名称：MaxHeight
|
|
||||||
|
|
||||||
类型：int
|
|
||||||
|
|
||||||
这将设置窗口的最大高度。如果给出的值`Height`大于这个值，窗口将被设置为`MaxHeight`默认值。
|
|
||||||
|
|
||||||
### 启动时隐藏窗口
|
|
||||||
|
|
||||||
名称：StartHidden
|
|
||||||
|
|
||||||
类型：bool
|
|
||||||
|
|
||||||
设置为`true`时，应用程序将被隐藏，直到调用[显示窗口](../reference/runtime/window#显示窗口)。
|
|
||||||
|
|
||||||
### 关闭时隐藏窗口
|
|
||||||
|
|
||||||
名称：HideWindowOnClose
|
|
||||||
|
|
||||||
类型：bool
|
|
||||||
|
|
||||||
默认情况下，关闭窗口将关闭应用程序。将此设置为`true`意味着关闭窗口将隐藏窗口。
|
|
||||||
|
|
||||||
### RGBA
|
|
||||||
|
|
||||||
名称：RGBA
|
|
||||||
|
|
||||||
类型：int (0xRRGGBBAA) 示例：0xFF000088 - 透明度为 50% 的红色
|
|
||||||
|
|
||||||
该值是默认设置窗口的 RGBA 值。默认值：0xFFFFFFFF。
|
|
||||||
|
|
||||||
### 窗口固定在最顶层
|
|
||||||
|
|
||||||
名称：AlwaysOnTop
|
|
||||||
|
|
||||||
类型：bool
|
|
||||||
|
|
||||||
窗口在失去焦点时应保持在其他窗口之上。
|
|
||||||
|
|
||||||
### 资源
|
|
||||||
|
|
||||||
名称：Assets
|
|
||||||
|
|
||||||
类型：\*embed.FS
|
|
||||||
|
|
||||||
应用程序要使用的前端资源。需要一个`index.html`文件。
|
|
||||||
|
|
||||||
### 菜单
|
|
||||||
|
|
||||||
名称：Menu
|
|
||||||
|
|
||||||
类型：\*menu.Menu
|
|
||||||
|
|
||||||
应用程序要使用的菜单。[菜单参考](../reference/runtime/menu)中有关菜单的更多详细信息。
|
|
||||||
|
|
||||||
注意：在 Mac 上，如果未指定菜单，则将创建默认菜单。
|
|
||||||
|
|
||||||
### 日志
|
|
||||||
|
|
||||||
名称：Logger
|
|
||||||
|
|
||||||
类型：logger.Logger
|
|
||||||
|
|
||||||
默认值：Logger to Stdout
|
|
||||||
|
|
||||||
应用程序要使用的记录器。有关日志记录的更多详细信息，请参阅[日志参考](../reference/runtime/log)。
|
|
||||||
|
|
||||||
### 日志级别
|
|
||||||
|
|
||||||
名称：LogLevel
|
|
||||||
|
|
||||||
类型：logger.LogLevel
|
|
||||||
|
|
||||||
默认值：在开发模式下是`Info`，在生产模式下是`Error`。
|
|
||||||
|
|
||||||
默认日志级别。有关日志记录的更多详细信息，请参阅[设置日志等级](../reference/runtime/log#设置日志等级)。
|
|
||||||
|
|
||||||
### 应用启动回调
|
|
||||||
|
|
||||||
名称：OnStartup
|
|
||||||
|
|
||||||
类型：func(ctx context.Context)
|
|
||||||
|
|
||||||
此回调在前端创建之后调用，但在`index.html`加载之前调用。它提供了应用程序上下文。
|
|
||||||
|
|
||||||
### 前端 Dom 加载完成回调
|
|
||||||
|
|
||||||
名称：OnDomReady
|
|
||||||
|
|
||||||
类型：func(ctx context.Context)
|
|
||||||
|
|
||||||
在前端加载完毕`index.html`及其资源后调用此回调。它提供了应用程序上下文。
|
|
||||||
|
|
||||||
### 应用退出回调
|
|
||||||
|
|
||||||
名称：OnShutdown
|
|
||||||
|
|
||||||
类型：func(ctx context.Context)
|
|
||||||
|
|
||||||
在前端被销毁之后，应用程序终止之前，调用此回调。它提供了应用程序上下文。
|
|
||||||
|
|
||||||
### 关闭应用程序之前回调
|
|
||||||
|
|
||||||
名称：OnBeforeClose
|
|
||||||
|
|
||||||
类型：func(ctx context.Context) bool
|
|
||||||
|
|
||||||
如果设置了此回调，它将在通过单击窗口关闭按钮或调用`runtime.Quit`即将退出应用程序时被调用. 返回 `true` 将导致应用程序继续，`false` 将继续正常关闭。这有助于与用户确认他们希望退出程序。
|
|
||||||
|
|
||||||
示例：
|
|
||||||
|
|
||||||
```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"
|
|
||||||
```
|
|
||||||
|
|
||||||
### 窗口启动状态
|
|
||||||
|
|
||||||
名称：WindowStartState
|
|
||||||
|
|
||||||
类型： options.WindowStartState
|
|
||||||
|
|
||||||
定义窗口在启动时应如何呈现。
|
|
||||||
|
|
||||||
| 值 | Win | Mac | Lin |
|
|
||||||
| ---------- | --- | --- | --- |
|
|
||||||
| Fullscreen | ✅ | ✅ | ✅ |
|
|
||||||
| Maximised | ✅ | ✅ | ✅ |
|
|
||||||
| Minimised | ✅ | | ✅ |
|
|
||||||
|
|
||||||
### 绑定
|
|
||||||
|
|
||||||
名称：Bind
|
|
||||||
|
|
||||||
类型： []interface{}
|
|
||||||
|
|
||||||
定义需要绑定到前端的方法的一部分结构实例。
|
|
||||||
|
|
||||||
### Windows
|
|
||||||
|
|
||||||
名称：Windows
|
|
||||||
|
|
||||||
类型：\*windows.Options
|
|
||||||
|
|
||||||
这定义了[Windows 特定的选项](#windows-特定选项)。
|
|
||||||
|
|
||||||
### Mac
|
|
||||||
|
|
||||||
名称：Mac
|
|
||||||
|
|
||||||
类型：\*mac.Options
|
|
||||||
|
|
||||||
这定义了[Mac 特定的选项](#mac-特定选项)。
|
|
||||||
|
|
||||||
## Windows 特定选项
|
|
||||||
|
|
||||||
### 网页透明
|
|
||||||
|
|
||||||
名称：WebviewIsTransparent
|
|
||||||
|
|
||||||
类型：bool
|
|
||||||
|
|
||||||
设置为 `true` 时将使 WebView 背景透明。这意味着如果你使用`rgba(0,0,0,0)`，主窗口将显示。通常与[窗口半透明](#窗口半透明)结合使用以制作冰霜效果的应用程序。
|
|
||||||
|
|
||||||
### 窗口半透明
|
|
||||||
|
|
||||||
名称：WindowIsTranslucent
|
|
||||||
|
|
||||||
类型：bool
|
|
||||||
|
|
||||||
将此设置为 `true` 将使窗口半透明。通常与[网页透明](#网页透明) 结合使用以制作冰霜效果的应用程序。
|
|
||||||
|
|
||||||
### 禁用窗口图标
|
|
||||||
|
|
||||||
名称：DisableWindowIcon
|
|
||||||
|
|
||||||
类型：bool
|
|
||||||
|
|
||||||
将此设置为 `true` 将删除标题栏左上角的图标。
|
|
||||||
|
|
||||||
### 禁用无边框窗口装饰
|
|
||||||
|
|
||||||
名称：DisableFramelessWindowDecorations
|
|
||||||
|
|
||||||
类型：bool
|
|
||||||
|
|
||||||
将此设置为`true`将移除[无边框](#无边框)模式下的窗口装饰。这意味着将不会有`Aero 阴影` 和 `圆角`显示在窗口上。请注意，`圆角`只在 Windows 11 上支持。
|
|
||||||
|
|
||||||
### Webview 用户数据路径
|
|
||||||
|
|
||||||
名称：WebviewUserDataPath
|
|
||||||
|
|
||||||
类型：string
|
|
||||||
|
|
||||||
这定义了 WebView2 存储用户数据的路径。如果为空将使用`%APPDATA%\[BinaryName.exe]`。
|
|
||||||
|
|
||||||
## Mac 特定选项
|
|
||||||
|
|
||||||
### 标题栏
|
|
||||||
|
|
||||||
名称：TitleBar
|
|
||||||
|
|
||||||
类型：[\*mac.TitleBar](#标题栏结构)
|
|
||||||
|
|
||||||
TitleBar 结构提供了配置标题栏外观的能力。
|
|
||||||
|
|
||||||
### 外观
|
|
||||||
|
|
||||||
名称：Appearance
|
|
||||||
|
|
||||||
类型：[AppearanceType](#外观类型)
|
|
||||||
|
|
||||||
Appearance 用于根据 Apple 的 [NSAppearance](https://developer.apple.com/documentation/appkit/nsappearancename?language=objc) 名称设置应用程序的样式。
|
|
||||||
|
|
||||||
### 网页透明
|
|
||||||
|
|
||||||
名称：WebviewIsTransparent
|
|
||||||
|
|
||||||
类型：bool
|
|
||||||
|
|
||||||
设置为 `true` 时将使 WebView 背景透明。这意味着如果你使用`rgba(0,0,0,0)`，主窗口将显示。通常与[窗口半透明](#窗口半透明)结合使用以制作冰霜效果的应用程序。
|
|
||||||
|
|
||||||
### 窗口半透明
|
|
||||||
|
|
||||||
名称：WindowIsTranslucent
|
|
||||||
|
|
||||||
类型：bool
|
|
||||||
|
|
||||||
将此设置为 `true` 将使窗口半透明。通常与[网页透明](#网页透明) 结合使用以制作冰霜效果的应用程序。
|
|
||||||
|
|
||||||
### 关于
|
|
||||||
|
|
||||||
名称：About
|
|
||||||
|
|
||||||
类型：[About](#关于结构)
|
|
||||||
|
|
||||||
此配置允许您为“AppMenu” role 创建的应用程序菜单中的“关于”菜单项设置标题、消息和图标。
|
|
||||||
|
|
||||||
#### 标题栏结构
|
|
||||||
|
|
||||||
可以使用 TitleBar 选项自定义应用程序的标题栏：
|
|
||||||
|
|
||||||
```go
|
|
||||||
type TitleBar struct {
|
|
||||||
TitlebarAppearsTransparent bool
|
|
||||||
HideTitle bool
|
|
||||||
HideTitleBar bool
|
|
||||||
FullSizeContent bool
|
|
||||||
UseToolbar bool
|
|
||||||
HideToolbarSeparator bool
|
|
||||||
}
|
|
||||||
```
|
|
||||||
|
|
||||||
| 名称 | 描述 |
|
|
||||||
| -------------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------- |
|
|
||||||
| TitlebarAppearsTransparent | 使标题栏透明。[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 | 从样式掩码中移除 [NSWindowStyleMaskTitled](https://developer.apple.com/documentation/appkit/nswindowstylemask/nswindowstylemasktitled/)。 |
|
|
||||||
| 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) |
|
|
||||||
|
|
||||||
预设的标题栏设置可用：
|
|
||||||
|
|
||||||
| 设置 | 示例 |
|
|
||||||
| --------------------------- | --------------------------------------------- |
|
|
||||||
| `mac.TitleBarDefault()` |  |
|
|
||||||
| `mac.TitleBarHidden()` |  |
|
|
||||||
| `mac.TitleBarHiddenInset()` |  |
|
|
||||||
|
|
||||||
示例：
|
|
||||||
|
|
||||||
```go
|
|
||||||
Mac: &mac.Options{
|
|
||||||
TitleBar: mac.TitleBarHiddenInset(),
|
|
||||||
}
|
|
||||||
```
|
|
||||||
|
|
||||||
单击[此处](https://github.com/lukakerr/NSWindowStyles)获取有关自定义标题栏的一些灵感。
|
|
||||||
|
|
||||||
#### 外观类型
|
|
||||||
|
|
||||||
您可以指定应用程序的[外观](https://developer.apple.com/documentation/appkit/nsappearance?language=objc)。
|
|
||||||
|
|
||||||
| 值 | 描述 |
|
|
||||||
| ----------------------------------------------------- | ------------------------------ |
|
|
||||||
| DefaultAppearance | 使用默认系统值 |
|
|
||||||
| NSAppearanceNameAqua | 标准日间系统外观 |
|
|
||||||
| NSAppearanceNameDarkAqua | 标准黑夜系统外观 |
|
|
||||||
| NSAppearanceNameVibrantLight | 轻盈灵动的外观 |
|
|
||||||
| NSAppearanceNameAccessibilityHighContrastAqua | 标准白天系统外观的高对比度版本 |
|
|
||||||
| NSAppearanceNameAccessibilityHighContrastDarkAqua | 标准黑夜系统外观的高对比度版本 |
|
|
||||||
| NSAppearanceNameAccessibilityHighContrastVibrantLight | 轻盈灵动外观的高对比度版本 |
|
|
||||||
| NSAppearanceNameAccessibilityHighContrastVibrantDark | 深色活力外观的高对比度版本 |
|
|
||||||
|
|
||||||
示例：
|
|
||||||
|
|
||||||
```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,
|
|
||||||
},
|
|
||||||
},
|
|
||||||
})
|
|
||||||
```
|
|
||||||
|
|
||||||
“关于”菜单项将出现在应用程序菜单中：
|
|
||||||
|
|
||||||
<div class="text--center">
|
|
||||||
<img
|
|
||||||
src="/img/reference/about-menu.png"
|
|
||||||
style={{
|
|
||||||
"box-shadow":
|
|
||||||
"rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px",
|
|
||||||
}}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<br />
|
|
||||||
|
|
||||||
单击后，将打开一个关于消息框：
|
|
||||||
|
|
||||||
<div class="text--center">
|
|
||||||
<img
|
|
||||||
src="/img/reference/about-dialog.png"
|
|
||||||
width="40%"
|
|
||||||
style={{
|
|
||||||
"box-shadow":
|
|
||||||
"rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px",
|
|
||||||
}}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<br />
|
|
||||||
@ -1,44 +0,0 @@
|
|||||||
---
|
|
||||||
sidebar_position: 5
|
|
||||||
---
|
|
||||||
|
|
||||||
# 项目配置
|
|
||||||
|
|
||||||
项目配置在项目目录中的`wails.json`文件中。配置的结构是：
|
|
||||||
|
|
||||||
```json
|
|
||||||
{
|
|
||||||
"name": "[项目名称]",
|
|
||||||
"assetdir": "[资源目录的相对路径]",
|
|
||||||
"reloaddirs": "[触发重新加载的附加目录（逗号分隔），这仅用于一些重要资源配置]",
|
|
||||||
"frontend:install": "[安装 node 依赖的命令，在 frontend 目录下运行 - 通常是 `npm install`]",
|
|
||||||
"frontend:build": "[构建资源的命令，在 frontend 目录下运行 - 通常是 `npm run build`]",
|
|
||||||
"frontend:dev": "[此命令等效于开发模式中的 frontend:build，如果没有指定则只有 frontend:build]",
|
|
||||||
"frontend:dev:watcher": "[此命令在 `wails dev` 上的单独进程中运行。对第 3 方观察者有用]",
|
|
||||||
"wailsjsdir": "[自动生成的JS模块将被创建的目录的相对路径]",
|
|
||||||
"version": "[项目配置版本]",
|
|
||||||
"outputfilename": "[二进制文件的名称]",
|
|
||||||
"debounceMS": 100, // 在检测到资源更改时，开发服务器等待重新加载的时间
|
|
||||||
"devserverurl": "[用于服务本地资源的开发服务器URL。默认：http://localhost:34115]",
|
|
||||||
"appargs": "[在dev模式下以shell样式传递给应用程序的参数]",
|
|
||||||
"runNonNativeBuildHooks": false, // 定义构建钩子是否应该运行，尽管它们是为主机操作系统以外的操作系统定义的。
|
|
||||||
"postBuildHooks": {
|
|
||||||
"GOOS/GOARCH": "[在构建指定的 GOOS/GOARCH 后将执行的命令：${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`和`devserverurl`标志将覆盖项目配置并作为后续运行的默认值。
|
|
||||||
@ -1,4 +0,0 @@
|
|||||||
{
|
|
||||||
"label": "Runtime",
|
|
||||||
"position": 1
|
|
||||||
}
|
|
||||||
@ -1,17 +0,0 @@
|
|||||||
---
|
|
||||||
sidebar_position: 7
|
|
||||||
---
|
|
||||||
|
|
||||||
# 浏览器
|
|
||||||
|
|
||||||
## 概述
|
|
||||||
|
|
||||||
这些方法与系统浏览器相关。
|
|
||||||
|
|
||||||
### 浏览器打开 URL
|
|
||||||
|
|
||||||
Go 方法签名: `BrowserOpenURL(ctx context.Context, url string)`
|
|
||||||
|
|
||||||
JS 方法签名: `BrowserOpenURL(url string)`
|
|
||||||
|
|
||||||
使用系统默认浏览器打开给定的 URL。
|
|
||||||
@ -1,297 +0,0 @@
|
|||||||
---
|
|
||||||
title: 对话框
|
|
||||||
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](#文件过滤) | 文件过滤器列表 | ✅ | ✅ | ✅ |
|
|
||||||
| 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](#文件过滤) | 文件过滤器列表 | ✅ | ✅ | ✅ |
|
|
||||||
| 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"},
|
|
||||||
})
|
|
||||||
```
|
|
||||||
|
|
||||||
第一个按钮显示为默认值：
|
|
||||||
|
|
||||||
<div class="text--center">
|
|
||||||
<img
|
|
||||||
src="/img/runtime/dialog_no_defaults.png"
|
|
||||||
width="30%"
|
|
||||||
style={{
|
|
||||||
"box-shadow":
|
|
||||||
"rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px",
|
|
||||||
}}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<br />
|
|
||||||
|
|
||||||
如果我们指定`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”。
|
|
||||||
|
|
||||||
<div class="text--center">
|
|
||||||
<img
|
|
||||||
src="/img/runtime/dialog_default_button.png"
|
|
||||||
width="30%"
|
|
||||||
style={{
|
|
||||||
"box-shadow":
|
|
||||||
"rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px",
|
|
||||||
}}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<br />
|
|
||||||
|
|
||||||
如果我们现在指定`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”：
|
|
||||||
|
|
||||||
<div class="text--center">
|
|
||||||
<img
|
|
||||||
src="/img/runtime/dialog_default_cancel.png"
|
|
||||||
width="30%"
|
|
||||||
style={{
|
|
||||||
"box-shadow":
|
|
||||||
"rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px",
|
|
||||||
}}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<br />
|
|
||||||
<br />
|
|
||||||
<br />
|
|
||||||
|
|
||||||
#### 对话框类型
|
|
||||||
|
|
||||||
```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 将在对话框中显示为一个单独的条目：
|
|
||||||
|
|
||||||
<div class="text--center">
|
|
||||||
<img
|
|
||||||
src="/img/runtime/dialog_win_filters.png"
|
|
||||||
width="50%"
|
|
||||||
style={{
|
|
||||||
"box-shadow":
|
|
||||||
"rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px",
|
|
||||||
}}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<br />
|
|
||||||
<br />
|
|
||||||
<br />
|
|
||||||
|
|
||||||
#### Linux
|
|
||||||
|
|
||||||
Linux 允许您在对话框中使用多个文件过滤器。每个 文件过滤器 将在对话框中显示为单独的条目：
|
|
||||||
|
|
||||||
<div class="text--center">
|
|
||||||
<img
|
|
||||||
src="/img/runtime/dialog_lin_filters.png"
|
|
||||||
width="50%"
|
|
||||||
style={{
|
|
||||||
"box-shadow":
|
|
||||||
"rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px",
|
|
||||||
}}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<br />
|
|
||||||
<br />
|
|
||||||
<br />
|
|
||||||
|
|
||||||
#### 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`作为过滤器打开文件对话框。
|
|
||||||
@ -1,50 +0,0 @@
|
|||||||
---
|
|
||||||
title: 事件
|
|
||||||
sidebar_position: 2
|
|
||||||
---
|
|
||||||
|
|
||||||
# 事件
|
|
||||||
|
|
||||||
## 概述
|
|
||||||
|
|
||||||
Wails 运行时提供了一个统一的事件系统，其中事件可以由 Go 或 Javascript 发出或接收。可选地，数据可以与事件一起传递。侦听器将接收本地数据类型中的数据。
|
|
||||||
|
|
||||||
### 添加事件侦听器
|
|
||||||
|
|
||||||
Go 方法签名: `EventsOn(ctx context.Context, eventName string, callback func(optionalData ...interface{}))`
|
|
||||||
|
|
||||||
JS 方法签名: `EventsOn(eventName string, callback function(optionalData?: any))`
|
|
||||||
|
|
||||||
此方法为给定的事件名称设置一个侦听器。当一个`eventName`类型的事件被[触发指定事件](#触发指定事件)时，回调被触发。与触发事件一起发送的任何其他数据都将传递给回调。
|
|
||||||
|
|
||||||
### 移除事件侦听器
|
|
||||||
|
|
||||||
Go 方法签名: `EventsOff(ctx context.Context, eventName string)`
|
|
||||||
|
|
||||||
JS 方法签名: `EventsOff(eventName string)`
|
|
||||||
|
|
||||||
此方法取消注册给定事件名称的侦听器。
|
|
||||||
|
|
||||||
### 添加只触发一次的事件侦听器
|
|
||||||
|
|
||||||
Go 方法签名: `EventsOnce(ctx context.Context, eventName string, callback func(optionalData ...interface{}))`
|
|
||||||
|
|
||||||
JS 方法签名: `EventsOnce(eventName string, callback function(optionalData?: any))`
|
|
||||||
|
|
||||||
此方法为给定的事件名称设置一个侦听器，但只会触发一次。
|
|
||||||
|
|
||||||
### 添加指定对多触发次数的事件侦听器
|
|
||||||
|
|
||||||
Go 方法签名: `EventsOnMultiple(ctx context.Context, eventName string, callback func(optionalData ...interface{}), counter int)`
|
|
||||||
|
|
||||||
JS 方法签名: `EventsOnMultiple(eventName string, callback function(optionalData?: any), counter int)`
|
|
||||||
|
|
||||||
此方法为给定的事件名称设置一个侦听器，但最多只能触发`counter`次。
|
|
||||||
|
|
||||||
### 触发指定事件
|
|
||||||
|
|
||||||
Go 方法签名: `EventsEmit(ctx context.Context, eventName string, optionalData ...interface{})`
|
|
||||||
|
|
||||||
JS 方法签名: `EventsEmit(ctx context, optionalData function(optionalData?: any))`
|
|
||||||
|
|
||||||
此方法触发指定的事件。可选数据可以与事件一起传递。这将触发任何事件侦听器。
|
|
||||||
@ -1,38 +0,0 @@
|
|||||||
---
|
|
||||||
title: 介绍
|
|
||||||
sidebar_position: 1
|
|
||||||
---
|
|
||||||
|
|
||||||
# 介绍
|
|
||||||
|
|
||||||
运行时是一个为应用程序提供实用方法的库。有 Go 和 Javascript 运行时，目的是在可能的情况下尝试使它们保持一致。
|
|
||||||
|
|
||||||
Go 运行时可通过导入`github.com/wailsapp/wails/v2/pkg/runtime`. 此包中的所有方法都将 context 作为第一个参数。这个 context 可以从[应用启动回调](../../reference/options#应用启动回调) 或[前端 Dom 加载完成回调](../../reference/options#前端-dom-加载完成回调)回调中获得。
|
|
||||||
|
|
||||||
:::info 注意
|
|
||||||
|
|
||||||
虽然上下文将提供给[应用启动回调](../../reference/options#应用启动回调)方法，但不能保证运行时将在此方法中工作，因为窗口正在不同的线程中初始化。如果您希望在启动时调用运行时方法，请使用[前端 Dom 加载完成回调](../../reference/options#前端-dom-加载完成回调)方法。
|
|
||||||
|
|
||||||
:::
|
|
||||||
|
|
||||||
Javascript 库可通过`window.runtime`提供给前端。使用 `开发` 模式时会生成一个运行时包，该包为运行时提供 Typescript 声明。这应该位于您的前端目录中的`wailsjs`目录中。
|
|
||||||
|
|
||||||
### 退出
|
|
||||||
|
|
||||||
Go 方法签名: `Quit(ctx context.Context)`
|
|
||||||
|
|
||||||
退出应用程序。
|
|
||||||
|
|
||||||
### 环境
|
|
||||||
|
|
||||||
Go 方法签名: `Environment(ctx context.Context) EnvironmentInfo`
|
|
||||||
|
|
||||||
返回当前环境的详细信息。
|
|
||||||
|
|
||||||
#### 环境信息
|
|
||||||
|
|
||||||
```go
|
|
||||||
type EnvironmentInfo struct {
|
|
||||||
BuildType string // Either "production", "debug" or "dev"
|
|
||||||
}
|
|
||||||
```
|
|
||||||
@ -1,107 +0,0 @@
|
|||||||
---
|
|
||||||
title: 日志
|
|
||||||
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)`
|
|
||||||
|
|
||||||
将给定的消息记录为原始消息。
|
|
||||||
|
|
||||||
### Trace 日志
|
|
||||||
|
|
||||||
Go 方法签名: `LogTrace(ctx context.Context, message string)`
|
|
||||||
|
|
||||||
JS 方法签名: `LogTrace(message: string)`
|
|
||||||
|
|
||||||
在`Trace`日志级别记录给定的消息。
|
|
||||||
|
|
||||||
### Debug 日志
|
|
||||||
|
|
||||||
Go 方法签名: `LogDebug(ctx context.Context, message string)`
|
|
||||||
|
|
||||||
JS 方法签名: `LogDebug(message: string)`
|
|
||||||
|
|
||||||
在`Debug`日志级别记录给定的消息。
|
|
||||||
|
|
||||||
### Info 日志
|
|
||||||
|
|
||||||
Go 方法签名: `LogInfo(ctx context.Context, message string)`
|
|
||||||
|
|
||||||
JS 方法签名: `LogInfo(message: string)`
|
|
||||||
|
|
||||||
在`Info`日志级别记录给定的消息。
|
|
||||||
|
|
||||||
### Warning 日志
|
|
||||||
|
|
||||||
Go 方法签名: `LogWarning(ctx context.Context, message string)`
|
|
||||||
|
|
||||||
JS 方法签名: `LogWarning(message: string)`
|
|
||||||
|
|
||||||
在`Warning`日志级别记录给定的消息。
|
|
||||||
|
|
||||||
### Error 日志
|
|
||||||
|
|
||||||
Go 方法签名: `LogError(ctx context.Context, message string)`
|
|
||||||
|
|
||||||
JS 方法签名: `LogError(message: string)`
|
|
||||||
|
|
||||||
在`Error`日志级别记录给定的消息。
|
|
||||||
|
|
||||||
### Fatal 日志
|
|
||||||
|
|
||||||
Go 方法签名: `LogFatal(ctx context.Context, message string)`
|
|
||||||
|
|
||||||
JS 方法签名: `LogFatal(message: string)`
|
|
||||||
|
|
||||||
在`Fatal`日志级别记录给定的消息。
|
|
||||||
|
|
||||||
### 设置日志级别
|
|
||||||
|
|
||||||
Go 方法签名: `LogSetLogLevel(ctx context.Context, level logger.LogLevel)`
|
|
||||||
|
|
||||||
JS 方法签名: `LogSetLogLevel(level: number)`
|
|
||||||
|
|
||||||
设置日志级别。在 Javascript 中，该数字与以下日志级别有关：
|
|
||||||
|
|
||||||
| 值 | 日志等级 |
|
|
||||||
| --- | -------- |
|
|
||||||
| 1 | Trace |
|
|
||||||
| 2 | Debug |
|
|
||||||
| 3 | Info |
|
|
||||||
| 4 | Warning |
|
|
||||||
| 5 | Error |
|
|
||||||
|
|
||||||
## 使用自定义日志
|
|
||||||
|
|
||||||
可以通过使用应用程序参数选项 [日志](../../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)
|
|
||||||
}
|
|
||||||
```
|
|
||||||
@ -1,28 +0,0 @@
|
|||||||
---
|
|
||||||
title: 菜单
|
|
||||||
sidebar_position: 6
|
|
||||||
---
|
|
||||||
|
|
||||||
# 菜单
|
|
||||||
|
|
||||||
## 概述
|
|
||||||
|
|
||||||
这些方法与应用程序菜单相关。
|
|
||||||
|
|
||||||
:::info Javascript
|
|
||||||
|
|
||||||
JS 运行时当前不支持菜单。
|
|
||||||
|
|
||||||
:::
|
|
||||||
|
|
||||||
### 设置应用程序菜单
|
|
||||||
|
|
||||||
Go 方法签名: `MenuSetApplicationMenu(ctx context.Context, menu *menu.Menu)`
|
|
||||||
|
|
||||||
将应用程序菜单设置为给定的[应用菜单](../../reference/menus)。
|
|
||||||
|
|
||||||
### 更新应用程序菜单
|
|
||||||
|
|
||||||
Go 方法签名: `MenuUpdateApplicationMenu(ctx context.Context)`
|
|
||||||
|
|
||||||
更新应用程序菜单，选取对传递给`MenuSetApplicationMenu`的菜单所做的任何更改。
|
|
||||||
@ -1,194 +0,0 @@
|
|||||||
---
|
|
||||||
title: 窗口
|
|
||||||
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 方法签名: `WindowShow(ctx context.Context)`
|
|
||||||
|
|
||||||
JS 方法签名: `WindowShow()`
|
|
||||||
|
|
||||||
如果窗口当前处于隐藏状态，则显示该窗口。
|
|
||||||
|
|
||||||
### 隐藏窗口
|
|
||||||
|
|
||||||
Go 方法签名: `WindowHide(ctx context.Context)`
|
|
||||||
|
|
||||||
JS 方法签名: `WindowHide()`
|
|
||||||
|
|
||||||
隐藏窗口（如果当前可见）。
|
|
||||||
|
|
||||||
### 设置窗口尺寸
|
|
||||||
|
|
||||||
Go 方法签名: `WindowSetSize(ctx context.Context, width int, height int)`
|
|
||||||
|
|
||||||
JS 方法签名: `WindowSetSize(size: Size)`
|
|
||||||
|
|
||||||
设置窗口的宽度和高度。
|
|
||||||
|
|
||||||
### 获取窗口尺寸
|
|
||||||
|
|
||||||
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)`
|
|
||||||
|
|
||||||
设置最小窗口大小。如果窗口当前小于给定尺寸，将调整窗口大小。
|
|
||||||
|
|
||||||
将大小设置为 `0,0` 将禁用此约束。
|
|
||||||
|
|
||||||
### 设置窗口最大尺寸
|
|
||||||
|
|
||||||
Go 方法签名: `WindowSetMaxSize(ctx context.Context, width int, height int)`
|
|
||||||
|
|
||||||
JS 方法签名: `WindowSetMaxSize(size: Size)`
|
|
||||||
|
|
||||||
设置最大窗口大小。如果窗口当前大于给定尺寸，将调整窗口大小。
|
|
||||||
|
|
||||||
将大小设置为 `0,0` 将禁用此约束。
|
|
||||||
|
|
||||||
### 设置窗口位置
|
|
||||||
|
|
||||||
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()`
|
|
||||||
|
|
||||||
最小化窗口。
|
|
||||||
|
|
||||||
### 窗口取消最小化
|
|
||||||
|
|
||||||
Go 方法签名: `WindowUnminimise(ctx context.Context)`
|
|
||||||
|
|
||||||
JS 方法签名: `WindowUnminimise()`
|
|
||||||
|
|
||||||
将窗口恢复到最小化之前的尺寸和位置。
|
|
||||||
|
|
||||||
### 窗口设置 RGBA
|
|
||||||
|
|
||||||
Go 方法签名: `WindowSetRGBA(ctx context.Context, R, G, B, A uint8)`
|
|
||||||
|
|
||||||
JS 方法签名: `WindowSetRGBA(R, G, B, A)`
|
|
||||||
|
|
||||||
将窗口的背景颜色设置为给定的 RGBA 颜色定义。此颜色将显示所有透明像素。
|
|
||||||
|
|
||||||
R、G、B 和 A 的有效值为 0-255。
|
|
||||||
|
|
||||||
:::info Windows
|
|
||||||
|
|
||||||
在 Windows 上，仅支持 0 或 255 的 alpha 值。任何不为 0 的值都将被视为 255。
|
|
||||||
|
|
||||||
:::
|
|
||||||
|
|
||||||
## Typescript 对象定义
|
|
||||||
|
|
||||||
### 位置
|
|
||||||
|
|
||||||
```ts
|
|
||||||
interface Position {
|
|
||||||
x: number;
|
|
||||||
y: number;
|
|
||||||
}
|
|
||||||
```
|
|
||||||
|
|
||||||
### 尺寸
|
|
||||||
|
|
||||||
```ts
|
|
||||||
interface Size {
|
|
||||||
w: number;
|
|
||||||
h: number;
|
|
||||||
}
|
|
||||||
```
|
|
||||||
@ -0,0 +1,30 @@
|
|||||||
|
{
|
||||||
|
"version.label": {
|
||||||
|
"message": "v2.0.0-beta.38",
|
||||||
|
"description": "The label for version v2.0.0-beta.38"
|
||||||
|
},
|
||||||
|
"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"
|
||||||
|
}
|
||||||
|
}
|
||||||
@ -0,0 +1,38 @@
|
|||||||
|
{
|
||||||
|
"version.label": {
|
||||||
|
"message": "v2.0.0-beta.39",
|
||||||
|
"description": "The label for version v2.0.0-beta.39"
|
||||||
|
},
|
||||||
|
"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"
|
||||||
|
}
|
||||||
|
}
|
||||||
Loading…
Reference in New Issue
Block a user