mirror of
https://github.com/wailsapp/wails.git
synced 2025-05-02 06:19:43 +08:00
Add helloworld tutorial
This commit is contained in:
parent
7a63464997
commit
55ec688331
@ -181,7 +181,6 @@ func initProject(options *templates.Options, quiet bool) error {
|
||||
|
||||
// Output stats
|
||||
elapsed := time.Since(start)
|
||||
options.Logger.Println("")
|
||||
options.Logger.Println("Project Name: " + options.ProjectName)
|
||||
options.Logger.Println("Project Directory: " + options.TargetDir)
|
||||
options.Logger.Println("Project Template: " + options.TemplateName)
|
||||
|
4
website/docs/tutorials/_category_.json
Normal file
4
website/docs/tutorials/_category_.json
Normal file
@ -0,0 +1,4 @@
|
||||
{
|
||||
"label": "Tutorials",
|
||||
"position": 70
|
||||
}
|
114
website/docs/tutorials/helloworld.mdx
Normal file
114
website/docs/tutorials/helloworld.mdx
Normal file
@ -0,0 +1,114 @@
|
||||
---
|
||||
sidebar_position: 10
|
||||
---
|
||||
|
||||
# Hello World
|
||||
|
||||
The aim of this tutorial is to get you up and running with the most basic
|
||||
application using Wails. You will be able to:
|
||||
|
||||
- Create a new Wails application
|
||||
- Build the application
|
||||
- Run the application
|
||||
|
||||
:::note
|
||||
This tutorial uses Windows as the target platform. Output will vary slightly
|
||||
depending on your operating system.
|
||||
:::
|
||||
|
||||
## Create a new Wails application
|
||||
|
||||
To create a new Wails application using the default vanilla JS template,
|
||||
you need to run the following command:
|
||||
|
||||
```bash
|
||||
wails init -n helloworld
|
||||
```
|
||||
|
||||
You should see something similar to the following:
|
||||
|
||||
```
|
||||
Wails CLI v2.0.0
|
||||
|
||||
Initialising Project 'helloworld'
|
||||
---------------------------------
|
||||
|
||||
Project Name: helloworld
|
||||
Project Directory: C:\Users\leaan\tutorial\helloworld
|
||||
Project Template: vanilla
|
||||
Template Support: https://wails.io
|
||||
|
||||
Initialised project 'helloworld' in 232ms.
|
||||
```
|
||||
|
||||
This will create a new directory called `helloworld` in the current directory.
|
||||
In this directory, you will find a number of files:
|
||||
|
||||
```
|
||||
build/ - Contains the build files + compiled application
|
||||
frontend/ - Contains the frontend files
|
||||
app.go - Contains the application code
|
||||
main.go - The main program with the application configuration
|
||||
wails.json - The project configuration file
|
||||
go.mod - The go module file
|
||||
go.sum - The go module checksum file
|
||||
```
|
||||
|
||||
## Build the application
|
||||
|
||||
To build the application, change to the new `helloworld` project directory and run the following command:
|
||||
|
||||
```bash
|
||||
wails build
|
||||
```
|
||||
|
||||
You should see something like the following:
|
||||
|
||||
```
|
||||
Wails CLI v2.0.0
|
||||
|
||||
App Type: desktop
|
||||
Platforms: windows/amd64
|
||||
Compiler: C:\Users\leaan\go\go1.18.3\bin\go.exe
|
||||
Build Mode: Production
|
||||
Skip Frontend: false
|
||||
Compress: false
|
||||
Package: true
|
||||
Clean Build Dir: false
|
||||
LDFlags: ""
|
||||
Tags: []
|
||||
Race Detector: false
|
||||
|
||||
Building target: windows/amd64
|
||||
------------------------------
|
||||
- Installing frontend dependencies: Done.
|
||||
- Compiling frontend: Done.
|
||||
- Generating bundle assets: Done.
|
||||
- Compiling application: Done.
|
||||
Built 'C:\Users\leaan\tutorial\helloworld\build\bin\helloworld.exe' in 10.616s.
|
||||
```
|
||||
|
||||
This has compiled the application and saved it in the `build/bin` directory.
|
||||
|
||||
## Run the application
|
||||
|
||||
If we view the `build/bin` directory in Windows Explorer, we should see our project binary:
|
||||
|
||||
<div class="text--center">
|
||||
<img src="/img/helloworld-app-icon.png" width="134px"/>
|
||||
</div>
|
||||
<br/>
|
||||
|
||||
We can run it by simply double-clicking the `helloworld.exe` file.
|
||||
|
||||
On Mac, Wails generates a `helloworld.app` file which can be run by double-clicking it.
|
||||
|
||||
On Linux, you can run the application using `./helloworld` from the `build/bin` directory.
|
||||
|
||||
You should see the application working as expected:
|
||||
|
||||
<div class="text--center">
|
||||
<img src="/img/windows-default-app.png" width="50%"
|
||||
style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 1px 2px 0px, rgb(104 104 104) 0px 1px 5px 0px"}}/>
|
||||
</div>
|
||||
<br/>
|
BIN
website/static/img/helloworld-app-icon.png
Normal file
BIN
website/static/img/helloworld-app-icon.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 5.1 KiB |
BIN
website/static/img/windows-default-app.png
Normal file
BIN
website/static/img/windows-default-app.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 374 KiB |
Loading…
Reference in New Issue
Block a user