Vue 3 与 Tauri 集成开发跨端APP

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
相关推荐
艾小码13 分钟前
手把手教你实现一个EventEmitter,彻底告别复杂事件管理!
前端·javascript·node.js
幸福摩天轮23 分钟前
npm发布包
前端
前端AK君25 分钟前
Gitlab 线上合并冲突的坑
前端
ze_juejin25 分钟前
ES6 Module 深入学习
前端
章丸丸28 分钟前
Tube - Studio Videos
前端·后端
因吹斯汀1 小时前
一饭封神:当AI厨神遇上你的冰箱,八大菜系大师在线battle!
前端·vue.js·ai编程
再学一点就睡1 小时前
NATAPP 内网穿透指南:让本地项目轻松 “走出去”
前端
拜无忧1 小时前
2025最新React项目架构指南:从零到一,为前端小白打造
前端·react.js·typescript
稻草人不怕疼1 小时前
记一次从“按钮点不动”到“窗口派发缺失”的排查过程
前端
irving同学462382 小时前
TypeORM 列装饰器完整总结
前端·后端·nestjs