当前位置: 首页 > article >正文

【Tauri2】001——安装及运行

前言

笔者其实不想写教程,写教程很麻烦。

但是网上关于Tauri2的教程,要么不全,要么是Tauri1的,真的太少了,虽然有官网,还是太少了。

问Ai,也感觉比较离谱,有很多时候,Ai给出的是Tauri1的代码,在tauri2,不能用,对于tauri2也回答的不知所云。

总之,很痛苦。

因此,笔者决定写写教程,

顺便加强自己的理解。

介绍Tauri

Tauri,笔者的理解中,认为和Eletron差不多,能兼容前端框架,比如Nuxt,Next等。

将开发好的前端打包成桌面程序或者移动端的程序

说白了,一言以蔽之,Tauri能够把前端变成可执行文件的库。

使用的主要语言及前置条件

1、Rust

2、JavaScript/TypeScript

教程主要的内容是对Tauri2在后端Rust的使用,对于前端的框架,不做过多解释。

需要安装Rust环境,特别是Cargo,参考如下

安装 - Cargo 指南 - Rust 编程语言https://doc.rust-lang.net.cn/cargo/getting-started/installation.html#install-rust-and-cargo对于不同的操作系统,需要一些条件

先决条件 | Tauri 中文网https://tauri.nodejs.cn/start/prerequisites/可根据自己的操作系统,参考配置。

安装

快速创建

可以使用Cargo或者其他前端的包管理工具,笔者使用pnpm

pnpm create tauri-app@latest

第一个填写——项目的名字

第二个填写——标识符(identifier)

第三个选择——前端使用的语言(Rust,TS/JS等)

第四个选择——包管理工具(pnpm、yarn等)

第五个选择——前端的模板(Vue,Reac等)

第六个选择——使用的UI风格,JS还是TS

笔者的选择如下

手动创建

1、创建前端框架

笔者先使用vite创建React项目test1

2、安装Tauri的命令行工具包

进入test1项目,安装Tauri 官方提供的命令行工具包

pnpm add -D @tauri-apps/cli@latest

3、初始化Tauri

pnpm tauri init

 需要回答一些问题,app的名字,开发命令,构建命令等之类的包,这不重要,因为回答的结果会

写在配置文件tauri.conf.json中,打错了,也可以改。

最后大致的目录结构如下


运行

要想启动项目,先不慌。

先了解一下,有那些命令,参考如下。

Command Line Interface | Taurihttps://tauri.app/reference/cli/

    tauri dev  启动项目

    tauri build 打包项目,后面 --debug 可以在打包后进行调试

    tauri init 初始化tauri项目

    tauri add <plugin>  增加插件

    tauri  remove <plugin> 移除插件

    tauri plugin 管理或创造插件

    tauri plugin new 初始化一个新的Tauri插件项目

     有很多命令,需要用的时候再说。

    因此,要想启动项目,运行如下命令

    pnpm run tauri dev

    修改package.json文件中的sciript

      "scripts": {
        "dev": "vite",
        "build": "vite build",
        "lint": "eslint .",
        "preview": "vite preview",
        "tauri:dev": "tauri dev"
      },

    因为vite默认的端口号是5173,修改tauri.conf.json中的build中的devUrl的端口号也为5173。

    意思很容易理解

    frontendDist:前端打包的输出文件

    devUrl:前端开发运行的url

    beforeDevCommand:tauri dev之前的命令。

    beforeBuildCommand:tauri build之前的命令

    可以变化的。

    结果如下


    http://www.kler.cn/a/599724.html

    相关文章:

  1. 算法关键知识汇总
  2. 人工智能笔记
  3. 浅谈:《嵌入式软件中的那些数据结构》
  4. 算法刷题整理合集(七)·【算法赛】
  5. 深入理解 tree 命令行工具:目录结构可视化的利器
  6. Elasticsearch 倒排索引 和 正排索引
  7. python全栈-前端
  8. 人工智能AI术语
  9. Spring Boot(十五):集成Knife4j
  10. 【redis】哨兵:人工恢复主节点故障和哨兵自动恢复主节点故障
  11. 信号相关的程序
  12. ResNet与注意力机制:深度学习中的强强联合
  13. MySQL: 创建两个关联的表,用联表sql创建一个新表
  14. SpringBoot+策略模式+枚举类,优雅消除if-else
  15. Oracle归档配置及检查
  16. vue3动态绑定并通过按钮绑定事件 | 解决报错error ‘xxx‘ is not defined no-undef
  17. istio 介绍-01-一个用于连接、管理和保护微服务的开放平台 概览
  18. uniapp笔记-swiper组件实现轮播图
  19. python 实现一个简单的window 任务管理器
  20. python --face_recognition(人脸识别,检测,特征提取,绘制鼻子,眼睛,嘴巴,眉毛)/活体检测