mirror of
https://github.com/wailsapp/wails.git
synced 2025-05-18 18:09:30 +08:00
131 lines
3.2 KiB
Plaintext
131 lines
3.2 KiB
Plaintext
---
|
|
sidebar_position: 2
|
|
---
|
|
|
|
# 创建项目
|
|
|
|
## 项目生成
|
|
|
|
现在 CLI 已安装，您可以使用 `wails init` 命令生成一个新项目。
|
|
|
|
选择您最喜欢的框架：
|
|
|
|
```mdx-code-block
|
|
import Tabs from "@theme/Tabs";
|
|
import TabItem from "@theme/TabItem";
|
|
|
|
<Tabs
|
|
defaultValue="Svelte"
|
|
values={[
|
|
{label: "Svelte", value: "Svelte"},
|
|
{label: "React", value: "React"},
|
|
{label: "Vue", value: "Vue"},
|
|
{label: "Preact", value: "Preact"},
|
|
{label: "Lit", value: "Lit"},
|
|
{label: "Vanilla", value: "Vanilla"},
|
|
]}
|
|
>
|
|
<TabItem value="Svelte">
|
|
使用 JavaScript 生成一个 <a href={"https://svelte.dev/"}>Svelte</a> 项目:<br/><br/>
|
|
|
|
wails init -n myproject -t svelte
|
|
|
|
如果您更愿意使用 TypeScript:<br/>
|
|
|
|
wails init -n myproject -t svelte-ts
|
|
|
|
</TabItem>
|
|
<TabItem value="React">
|
|
使用 JavaScript 生成一个 <a href={"https://reactjs.org/"}>React</a> 项目:<br/><br/>
|
|
|
|
wails init -n myproject -t react
|
|
|
|
如果您更愿意使用 TypeScript:<br/>
|
|
|
|
wails init -n myproject -t react-ts
|
|
|
|
</TabItem>
|
|
<TabItem value="Vue">
|
|
使用 JavaScript 生成一个 <a href={"https://vuejs.org/"}>Vue</a> 项目:<br/><br/>
|
|
|
|
wails init -n myproject -t vue
|
|
|
|
如果您更愿意使用 TypeScript:<br/>
|
|
|
|
wails init -n myproject -t vue-ts
|
|
|
|
</TabItem>
|
|
<TabItem value="Preact">
|
|
使用 JavaScript 生成一个 <a href={"https://preactjs.com/"}>Preact</a> 项目:<br/><br/>
|
|
|
|
wails init -n myproject -t preact
|
|
|
|
如果您更愿意使用 TypeScript:<br/>
|
|
|
|
wails init -n myproject -t preact-ts
|
|
|
|
</TabItem>
|
|
<TabItem value="Lit">
|
|
使用 JavaScript 生成一个 <a href={"https://lit.dev/"}>Lit</a> 项目:<br/><br/>
|
|
|
|
wails init -n myproject -t lit
|
|
|
|
如果您更愿意使用 TypeScript:<br/>
|
|
|
|
wails init -n myproject -t lit-ts
|
|
|
|
</TabItem>
|
|
<TabItem value="Vanilla">
|
|
使用 JavaScript 生成一个 Vanilla 项目:<br/><br/>
|
|
|
|
wails init -n myproject -t vanilla
|
|
|
|
如果您更愿意使用 TypeScript:<br/>
|
|
|
|
wails init -n myproject -t vanilla-ts
|
|
|
|
</TabItem>
|
|
</Tabs>
|
|
```
|
|
|
|
<hr />
|
|
|
|
还有提供不同功能和框架的 [社区模板](../community/templates.mdx)。
|
|
|
|
要查看其他可用选项，您可以运行 `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 module 文件
|
|
- `/go.sum` - Go module 校验文件
|
|
|
|
`frontend` 目录没有特定于 Wails 的内容，可以是您选择的任何前端项目。
|
|
|
|
`build` 目录在构建过程中使用。 这些文件可以修改以自定义您的构建。 如果从 build 目录中删除文件，将重新生成默认版本。
|
|
|
|
`go.mod` 中的默认模块名称是“changeme”。 您应该将其更改为更合适的内容。
|