Tauri应用开发(二):创建第一个Tauri应用

news/2025/2/7 2:45:50/

创建tauri应用

推荐参考官方文档:https://tauri.app/v1/guides/

创建命令:

npm create tauri-app@latest

💡注意:请确保Node.js和Rust已经正确安装

在创建过程中,需要根据提示选择配置项。
主要配置有:

  • 项目名称:例如my-app

  • 前端语言:可选择TypeScript / JavaScriptRust,这里选择TypeScript / JavaScript

  • 包管理器:可选pnpmyarnnpm,这里选择常用的npm

  • UI模板:可选VanillaVueSvelteReactSolidAngular,选择Vue即可。

  • UI语言风格:可选TypeScriptJavaScript,任选一个即可,这里选择JavaScript。
    在这里插入图片描述
    创建完成后的主要目录结构:

      ├─public						公共资源文件,例如图片、视频等静态资源├─src							vue根目录│  ├─assets					存放Vue资源文件│  ├─components			    存放Vue资源文件│  ├─App.vue     			    Vue应用容器│  └─main.js                  入口└─src-tauri					tauri根目录├─icons					tuari应用图标└─src						tauri后端跟目录,即rust目录,如果不需要使用rust开发则无需关注
    

运行应用

首先进入到my-app目录下,执行以下命令:

# 安装依赖项
npm install
# 启动应用
npm run tauri dev

💡注意:

  1. 如果npm很慢,可以安装cnpm,然后执行cnpm install即可。
  2. 首次执行npm run tauri dev后,会自动下载rust相关的依赖,并编译,此过程耗时比较长,预计会持续5~10分钟左右,请耐心等待。
    在这里插入图片描述
    如果遇到如下错误:
    warning: spurious network error (2 tries remaining): [28] Timeout was reached (Failed to connect to github.com port 443 after 21239 ms: Timed out); class=Net (12)
    则说明网络不好,连接失败,可以多尝试几次,建议挂代理加速请求。

等待编译完成后,就可以看到应用界面啦:
在这里插入图片描述
哇哦,泰裤辣!

接下来就可以愉快的开发了,开发过程中如果没有涉及到和tauri后端通信,则无需关注rust部分,完全使用Vue开发即可。

提示:tauri创建的前端工程,默认使用vite,如果你更熟悉webpack,也是可以更换的。


http://www.ppmy.cn/news/80890.html

相关文章

LeetCode 739 每日温度

题目: 给定一个整数数组 temperatures ,表示每天的温度,返回一个数组 answer ,其中 answer[i] 是指对于第 i 天,下一个更高温度出现在几天后。如果气温在这之后都不会升高,请在该位置用 0 来代替。 示例 1…

JDBC详解(三):使用PreparedStatement实现CRUD操作(超详解)

JDBC详解(三):使用PreparedStatement实现CRUD操作(超详解) 前言一、操作和访问数据库二、使用Statement操作数据表的弊端三、PreparedStatement的使用1、PreparedStatement介绍2、PreparedStatement vs Statement3、Ja…

带你深入了解Android Handler的用法

Android中,Handler是一类用于异步消息传递和线程之间通信的基础框架。一个Handler是一个线程的处理器,可以接收消息,并调度运行它们。使用Handler,应用程序可以将处理器与一个线程关联,以将来的时间运行任务。而使用Ha…

linux怎样创建一个大于2T的分区

发现用fdisk给一个很大的盘(我这里是4T)做分区,只能创建一个2t的分区,再建只能建几十G的分区,没法再建大分区了,因此改为用part命令做分区。 这里想给/dev/sdb进行分区,并建物理卷,…

网络安全面试大全,2023最新(建议收藏)

写在前面 个人强烈感觉面试因人而异,对于简历上有具体项目经历的同学,个人感觉面试官会着重让你介绍自己的项目,包括但不限于介绍一次真实攻防/渗透/挖洞/CTF/代码审计的经历 > 因此对于自己的项目,面试前建议做一次复盘&…

顺丰科技携手飞桨自研“智能外呼机器人”,为客户打造优质服务体验

“您好,请问是李立先生吗”,或许不少人在拨通客服电话后发现是机器人客服,都希望能快点转人工。但顺丰的“客服机器人”却是“与众不同”的存在。 顺丰已成为国内领先的快递物流综合服务商、全球第四大快递公司,依托领先的科技研发…

一次oracle环境 enq: TX - allocate ITL entry锁问题分析

enq: TX - allocate ITL entry锁问题分析 通过分析问题时间段两个节点的AWR报告,TOP1等待为锁竞争enq: TX - allocate ITL entry,该等待事件是由于缺省情况下创建的表的INITRANS参数为1,索引的INITRANS参数值为2.当有太多的并发DML操作的数据行处于相同的…

ICR-预测三种医学状况 #$60,000 #Kaggle

CompHub[1] 实时聚合多平台的数据类(Kaggle、天池…)和OJ类(Leetcode、牛客…)比赛。本账号会推送最新的比赛消息,欢迎关注! 以下信息由AI辅助创作,仅供参考 比赛名称 ICR - Identifying Age-Related Conditions[2] (见文末阅读原…