tauri2+vue3+ts 项目搭建 -- 新手放心食用版

923 阅读1分钟

1.参考文档

官方地址: v2.tauri.org.cn/

汉化文档地址(V1): www.tauri.net.cn/

2.项目搭建方法一(先创建vue项目,再装tauri工具,适合现有vue项目的集成)

2.1创建项目

创建一个文件夹 tauri-cli(示例名字)

安装推荐使用cnpm和pnpm,npm经常遇到问题

cd tauri-cli
cnpm create vite@latest .

控制台输出如下,可以根据自己需求选择

image.png

安装成功之后已经可以通过命令运行啦!

2.2 现在我们要狠狠地安装tauri cli啦

cnpm install -D @tauri-apps/cli@next

2.3 初始化tauri

npx tauri init

命令行配置如下

image.png

初始化成功之后,将会在你的项目中新增一个src-tauri文件夹

项目目录如下

image.png

2.4运行项目

修改package.json文件运行指令

image.png

cnpm install 
// 这里直接运行的时候我遇见了缺少依赖的问题,所以再安装一下依赖.
//vite 版本安装如图 node我用的v20
npm run tauri dev //第一次运行时间会有一点长,耐心等待...

如此就搭建成功啦! 小小Tauri,拿捏!

image.png

3.项目搭建方法二(简单快捷,适合新搭建的项目)

3.1 安装

cnpm create tauri-app@latest
cd tauri-app
cnpm install

命令行如下,可自己选择想要的语言

image.png

3.2 运行!干就完了!

npm run tauri dev