用 Tauri 写一个 micro-vscode

前言

Tauri 是一个构建适用于所有主流桌面和移动平台的轻快二进制文件的框架。开发者们可以集成任何用于创建用户界面的可以被编译成 HTML、JavaScript 和 CSS 的前端框架,同时可以在必要时使用 Rust、Swift 和 Kotlin 等语言编写后端逻辑。

  • 对于开发者而言,Tauri 有三个主要优势:
    • 构建应用所需的可靠基础
    • 使用系统原生 webview(网页视图)带来的更小打包体积
    • 使用任何前端技术和多种语言绑定带来的灵活性

详情可到官方文档What is Tauri查看。

Tauri 的 2.0 版本支持了移动端,如今 Tauri 已经发布到了tauri-v2.0.0-beta.8版本。Tauri 2.0 不仅仅是移动。以下是将包含的一些功能:

  • 强大的插件:许多 Tauri API 已转向使用 Tauri 插件系统。这使我们能够使 Tauri 代码更加模块化、更易于维护,但也使我们能够使插件系统更强大,以便开发人员构建自己的插件。
  • 插件的 Swift 和 Kotlin 绑定:现在您可以在 Swift 和 Kotlin 中编写特定于平台的代码。Tauri 从 1.0 版本开始就在 Rust 和 JavaScript 代码之间架起了一座桥梁。借助 Tauri 2.0,插件开发人员将能够使用 Swift 和 Kotlin 编写代码,以便与他们正在开发的系统更紧密地集成。
  • 支持 iOS 和 Android:您将能够构建 Tauri 应用程序并在 iOS 和 Android 上运行它们。

详情可以到官方Tauri 2.0 路线图查看。

Tauri demo

项目地址micro-vscode

创建项目

详情参考官方文档Create a Project

bash 复制代码
pnpm create tauri-app --beta

cd my-tauri-app
npm install
npm run tauri dev

目录结构

如下图,其实和普通的 vite 项目没什么区别,就是多了一个 src-tauri 的文件夹,存放服务端的代码。

客户端

git clone

git commit

使用 github token 提交,需要在 user 中设置

git pull and push

设置 git config 的 username 和 email

  • 设置 username
  • 设置 email
  • 设置 gitHub token

查看项目

编辑文件

使用 Cmd + S 保存

服务端

服务端使用 rust 写的,其实我几乎不懂 rust,这个项目的 rust 代码都是 chatgpt 帮我写的

TodoList

  • 读取本地文件系统
  • 新建文件/问价
  • 更新 git 操作类似到工具栏,类似 vscode
  • 搜索文件内容
  • 通过文件名搜索文件

写在最后

这是就是一个学习向的 Tauri Demo, 完全是我的第一个 Tauri 应用。

感兴趣的话可以关注项目地址micro-vscode

相关推荐
y先森10 分钟前
CSS3中的伸缩盒模型(弹性盒子、弹性布局)之伸缩容器、伸缩项目、主轴方向、主轴换行方式、复合属性flex-flow
前端·css·css3
前端Hardy10 分钟前
纯HTML&CSS实现3D旋转地球
前端·javascript·css·3d·html
susu108301891113 分钟前
vue3中父div设置display flex,2个子div重叠
前端·javascript·vue.js
IT女孩儿1 小时前
CSS查缺补漏(补充上一条)
前端·css
码农飞飞2 小时前
深入理解Rust的模式匹配
开发语言·后端·rust·模式匹配·解构·结构体和枚举
一个小坑货2 小时前
Rust 的简介
开发语言·后端·rust
吃杠碰小鸡2 小时前
commitlint校验git提交信息
前端
qq_172805592 小时前
RUST学习教程-安装教程
开发语言·学习·rust·安装
monkey_meng3 小时前
【遵守孤儿规则的External trait pattern】
开发语言·后端·rust
天天进步20153 小时前
Vue+Springboot用Websocket实现协同编辑
vue.js·spring boot·websocket