You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: docs/guides/getting-started/setup/_fragments/_commands.mdx
+4-4Lines changed: 4 additions & 4 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -1,8 +1,8 @@
1
-
Tauri lets you enhance your Frontend with native capabilities. We call these [Commands][command], essentially Rust functions that you can call from your frontend JavaScript. This enables you to handle heavy processing or calls to the OS in much more performant Rust code.
1
+
Tauri lets you enhance your frontend with native capabilities. We call these [Commands][command], essentially Rust functions that you can call from your frontend JavaScript. This enables you to handle heavy processing or calls to the OS in much more performant Rust code.
2
2
3
3
Let's make a simple example:
4
4
5
-
```rust
5
+
```rust title=src-tauri/src/main.rs
6
6
#[tauri::command]
7
7
fngreet(name:&str) ->String {
8
8
format!("Hello, {}!", name)
@@ -13,7 +13,7 @@ A Command is just like any regular Rust function, with the addition of the `#[ta
13
13
14
14
Lastly, we also need to tell Tauri about our newly created command so that it can route calls accordingly. This is done with the combination of the `.invoke_handler()` function and the `generate_handler![]` macro you can see below:
15
15
16
-
```rust
16
+
```rust title=src-tauri/src/main.rs
17
17
fnmain() {
18
18
tauri::Builder::default()
19
19
// highlight-next-line
@@ -23,6 +23,6 @@ fn main() {
23
23
}
24
24
```
25
25
26
-
Now we're ready to call your Command from the JavaScript frontend!
26
+
Now you're ready to call your Command from the frontend!
At the heart of every Tauri app is a Rust binary that manages windows, the webview and calls to the operating system through a Rust crate called `tauri`. This project is managed by [Cargo], the official package manager and general-purpose build tool for Rust.
5
+
At the heart of every Tauri app is a Rust binary that manages windows, the webview, and calls to the operating system through a Rust crate called `tauri`. This project is managed by [Cargo], the official package manager and general-purpose build tool for Rust.
5
6
6
7
Our Tauri CLI uses Cargo under the hood so you rarely need to interact with it directly. Cargo has many more useful features that are not exposed through our CLI, such as testing, linting, and formatting, so please refer to their [official docs][cargo commands] for more.
7
8
8
9
:::info Install Tauri CLI
9
10
10
11
If you haven't installed the Tauri CLI yet you can do so with with one of the below commands. Aren't sure which to use? Check out the [FAQ entry].
11
12
12
-
<TabsgroupId="package-manager">
13
-
<TabItemvalue="npm"label="npm"default>
14
-
15
-
```shell
16
-
npm install --save-dev @tauri-apps/cli
17
-
```
18
-
19
-
</TabItem>
20
-
<TabItemvalue="yarn"label="Yarn">
21
-
22
-
```shell
23
-
yarn add -D @tauri-apps/cli
24
-
```
25
-
26
-
</TabItem>
27
-
<TabItemvalue="pnpm"label="pnpm">
28
-
29
-
```shell
30
-
pnpm add -D @tauri-apps/cli
31
-
```
32
-
33
-
</TabItem>
34
-
<TabItemvalue="cargo"label="Cargo">
35
-
36
-
```shell
37
-
cargo install tauri-cli
38
-
```
39
-
40
-
</TabItem>
41
-
</Tabs>
13
+
<InstallTauriCli />
42
14
43
15
:::
44
16
45
17
To scaffold a minimal Rust project that is pre-configured to use Tauri, open a terminal and run the following command:
46
18
47
19
<TabsgroupId="package-manager">
48
-
<TabItemvalue="npm"label="npm"default>
20
+
<TabItemvalue="npm">
49
21
50
22
```shell
51
23
npm tauri init
52
24
```
53
25
54
26
</TabItem>
55
-
<TabItemvalue="yarn"label="Yarn">
27
+
<TabItemvalue="Yarn">
56
28
57
29
```shell
58
30
yarn tauri init
59
31
```
60
32
61
33
</TabItem>
62
-
<TabItemvalue="pnpm"label="pnpm">
34
+
<TabItemvalue="pnpm">
63
35
64
36
```shell
65
37
pnpm tauri init
66
38
```
67
39
68
40
</TabItem>
69
-
<TabItemvalue="cargo"label="Cargo">
41
+
<TabItemvalue="Cargo">
70
42
71
43
```shell
72
44
cargo tauri init
@@ -77,27 +49,63 @@ cargo tauri init
77
49
78
50
It will walk you through a series of questions:
79
51
80
-
1.**What is your app name?**
81
-
82
-
This will be the name of your final bundle and what the OS will call your app. You can use any name you want here.
83
-
84
-
2.**What should the window title be?**
85
-
86
-
This will be the title of the default main window. You can use any title you want here.
87
-
88
-
3.**Where are your web assets (HTML/CSS/JS) located relative to the `<current dir>/src-tauri/tauri.conf.json` file that will be created?**
89
-
90
-
<div>
91
-
This is the path that Tauri will load your frontend assets from when
92
-
building for <b>production</b>. Use <code>{props.destDirValue}</code> for
93
-
this value.
94
-
</div>
95
-
96
-
4.**What is the URL of your dev server?**
97
-
<div>
98
-
This can be either a URL or a file path that Tauri will load during{''}
99
-
<b>development</b>. Use <code>{props.devPathValue}</code> for this value.
100
-
</div>
52
+
<ol>
53
+
<li>
54
+
<i>What is your app name?</i>
55
+
<br />
56
+
This will be the name of your final bundle and what the OS will call your
57
+
app. You can use any name you want here.
58
+
</li>
59
+
<br />
60
+
<li>
61
+
<i>What should the window title be?</i>
62
+
<br />
63
+
This will be the title of the default main window. You can use any title you
64
+
want here.
65
+
</li>
66
+
<br />
67
+
<li>
68
+
<i>
69
+
Where are your web assets (HTML/CSS/JS) located relative to the{''}
70
+
<code><current dir>/src-tauri/tauri.conf.json</code> file that will
71
+
be created?
72
+
</i>
73
+
<br />
74
+
This is the path that Tauri will load your frontend assets from when
@@ -107,16 +115,13 @@ If you're familiar with Rust, you will notice that `tauri init` looks and works
107
115
108
116
The `tauri init` command generates a folder called `src-tauri`. It's a convention for Tauri apps to place all core-related files into this folder. Let's quickly run through the contents of this folder:
109
117
110
-
-**`Cargo.toml`**
111
-
118
+
-**`Cargo.toml`**
112
119
Cargo's manifest file. You can declare Rust crates your app depends on, metadata about your app, and much more. For the full reference see [Cargo's Manifest Format][manifest-format].
113
120
114
-
-**`tauri.conf.json`**
115
-
121
+
-**`tauri.conf.json`**
116
122
This file lets you configure and customize aspects of your Tauri application from the name of your app to the list of allowed APIs. See [Tauri's API Configuration][api config] for the full list of supported options and in-depth explanations for each.
117
123
118
-
-**`src/main.rs`**
119
-
124
+
-**`src/main.rs`**
120
125
This is the entrypoint to your Rust program and the place where we bootstrap into Tauri. You will find two sections in it:
121
126
122
127
```rust title=src/main.rs
@@ -136,8 +141,7 @@ The `tauri init` command generates a folder called `src-tauri`. It's a conventio
136
141
137
142
The `main` function is the entry point and the first function that gets invoked when your program runs.
138
143
139
-
-**`icons`**
140
-
144
+
-**`icons`**
141
145
Chances are you want a snazzy icon for your app! To get you going quickly, we included a set of default icons. You should switch these out before publishing your application. Learn more about the various icon formats in Tauri's [icons feature guide][icons].
0 commit comments