Vue 3 与 Tauri 集成开发跨端APP

萧大侠jdeps2024-12-28 11:35

1、安装RUST

下载地址：Install Rust - Rust Programming Language

安装：

安装完成后，在命令行里运行: rustup

2、安装 Node.js 与 npm 或 pnpm ，如果已经安装，可以忽略

# 使用 nvm 安装 Node.js 最新版本
nvm install --lts
nvm use --lts

3、安装 Tauri CLI：

npm install -g create-tauri-app

4、创建 Vue 3 + Tauri 项目

使用 Tauri 初始化项目：

npm create tauri-app@latest

提示： 安装时选择 Vue3 和 TypeScript 模板。

进入项目目录：

配置 Vue 3 环境

{
  "build": {
    "beforeBuildCommand": "npm run build",
    "beforeDevCommand": "npm run dev",
    "devPath": "http://localhost:5173", // Vite 开发服务器路径
    "distDir": "../dist" // 构建后的目录
  },
  "tauri": {
    "windows": [
      {
        "title": "My Tauri App",
        "width": 800,
        "height": 600,
        "resizable": true
      }
    ]
  }
}

运行开发模式

yarn install
yarn run dev

打包应用程序

1、打包h5 yarn run build

2、打包exe

yarn run tauri build