前言
本专栏是关于tauri这个rustGUI库的一些实例合集,会讲解一些前端(javascript)和后端(rust)的功能实现的实例代码,但是请注意,本专栏专注实例实现,不关心非常具体的实现逻辑,即没有源代码的详细讲解。
环境配置
系统:windows
平台:visual studio code
语言:javascript、rust
库:tauri
版本:2.0
概述
本文是专栏的第二篇,主要是介绍下在新版Tauri2.0下如何创建rustGUI窗口,实现简单的前后端互联。
1、本地前端UI
2、基于vite框架的前端UI
系列博客链接
1、<Rust><GUI>rust语言GUI库tauri体验:前、后端结合创建一个窗口并修改其样式
需要注意的是,本文是建立在新的2.0版本上,下面是tauri2.0的改变:
tauri2.0 changelog截取:
如果想要了解更详细的,可以参看官网:
https://tauri.app/zh-cn/blog/tauri-20/
下面我们将基于官网的指导示例,来创建一个简单tauri项目,以及运行生成窗口。
前排提示:
本文所基于的,是在windows系统上使用,工具是vscode,语言是rust,前端包括html、javascript,所以,你需要的前提条件,包括安装rust和vscode等。
接下来,我们将一步步介绍如何创建、运行一个tauri2.0的桌面项目。
本地前端UI
step1:打开vscode,并创建新的项目文件夹
mkdir tauri2-test
cd tauri2-test
然后先在这个文件夹内,创建一个ui文件夹,用于添加html前端代码:
tauri2-test>mkdir ui
然后,在创建的ui文件夹内,新建一个html文件,里面填充一些基本的代码:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>文档</title>
</head>
<body>
<h1>这是来自 Tauri 的欢迎!</h1>
</body>
</html>
以上步骤完成,先放置,以作备用。
step2:初始化一个tauri项目
我们先回到刚刚创建的项目文件夹tauri2-test下,输入以下指令:
tauri2-test>cargo tauri init
当然,输入这个指令有个前提,就是需要先安装Tauri CLI,指令如下:
cargo instal