v2.7.0

2026-08-05 13:53:43 -07:00 · 2023-12-09 17:29:56 +11:00
parent 07fc8e3707
commit 6a8322cdb5
526 changed files with 42791 additions and 249 deletions
@@ -0,0 +1,132 @@
+---
+sidebar_position: 2
+---
+
+# Creating a Project
+
+## Project Generation
+
+Now that the CLI is installed, you can generate a new project by using the `wails init` command.
+
+Pick your favourite framework:
+
+```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">
+    Generate a <a href={"https://svelte.dev/"}>Svelte</a> project using JavaScript with:<br/><br/>
+
+    wails init -n myproject -t svelte
+
+If you would rather use TypeScript:<br/>
+
+    wails init -n myproject -t svelte-ts
+
+</TabItem>
+<TabItem value="React">
+    Generate a <a href={"https://reactjs.org/"}>React</a> project using JavaScript with:<br/><br/>
+
+    wails init -n myproject -t react
+
+If you would rather use TypeScript:<br/>
+
+    wails init -n myproject -t react-ts
+
+</TabItem>
+<TabItem value="Vue">
+    Generate a <a href={"https://vuejs.org/"}>Vue</a> project using JavaScript with:<br/><br/>
+
+    wails init -n myproject -t vue
+
+If you would rather use TypeScript:<br/>
+
+    wails init -n myproject -t vue-ts
+
+</TabItem>
+<TabItem value="Preact">
+    Generate a <a href={"https://preactjs.com/"}>Preact</a> project using JavaScript with:<br/><br/>
+
+    wails init -n myproject -t preact
+
+If you would rather use TypeScript:<br/>
+
+    wails init -n myproject -t preact-ts
+
+</TabItem>
+<TabItem value="Lit">
+    Generate a <a href={"https://lit.dev/"}>Lit</a> project using JavaScript with:<br/><br/>
+
+    wails init -n myproject -t lit
+
+If you would rather use TypeScript:<br/>
+
+    wails init -n myproject -t lit-ts
+
+</TabItem>
+<TabItem value="Vanilla">
+    Generate a Vanilla project using JavaScript with:<br/><br/>
+
+    wails init -n myproject -t vanilla
+
+If you would rather use TypeScript:<br/>
+
+    wails init -n myproject -t vanilla-ts
+
+</TabItem>
+</Tabs>
+```
+
+<hr />
+
+There are also [community templates](../community/templates.mdx) available that offer different capabilities and frameworks.
+
+To see the other options available, you can run `wails init -help`.
+More details can be found in the [CLI Reference](../reference/cli.mdx#init).
+
+## Project Layout
+
+Wails projects have the following layout:
+
+```
+.
+├── build/
+│   ├── appicon.png
+│   ├── darwin/
+│   └── windows/
+├── frontend/
+├── go.mod
+├── go.sum
+├── main.go
+└── wails.json
+```
+
+### Project structure rundown
+
+- `/main.go` - The main application
+- `/frontend/` - Frontend project files
+- `/build/` - Project build directory
+- `/build/appicon.png` - The application icon
+- `/build/darwin/` - Mac specific project files
+- `/build/windows/` - Windows specific project files
+- `/wails.json` - The project configuration
+- `/go.mod` - Go module file
+- `/go.sum` - Go module checksum file
+
+The `frontend` directory has nothing specific to Wails and can be any frontend project of your choosing.
+
+The `build` directory is used during the build process. These files may be updated to customise your builds. If
+files are removed from the build directory, default versions will be regenerated.
+
+The default module name in `go.mod` is "changeme". You should change this to something more appropriate.