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
相关推荐
gnip4 小时前
企业级配置式表单组件封装
前端·javascript·vue.js
一只叫煤球的猫5 小时前
写代码很6,面试秒变菜鸟?不卖课,面试官视角走心探讨
前端·后端·面试
excel5 小时前
Three.js 材质(Material)详解 —— 区别、原理、场景与示例
前端
掘金安东尼6 小时前
抛弃自定义模态框:原生Dialog的实力
前端·javascript·github
hj5914_前端新手9 小时前
javascript基础- 函数中 this 指向、call、apply、bind
前端·javascript
薛定谔的算法10 小时前
低代码编辑器项目设计与实现:以JSON为核心的数据驱动架构
前端·react.js·前端框架
Hilaku10 小时前
都2025年了,我们还有必要为了兼容性,去写那么多polyfill吗?
前端·javascript·css
yangcode10 小时前
iOS 苹果内购 Storekit 2
前端
LuckySusu10 小时前
【js篇】JavaScript 原型修改 vs 重写:深入理解 constructor的指向问题
前端·javascript
LuckySusu10 小时前
【js篇】如何准确获取对象自身的属性?hasOwnProperty深度解析
前端·javascript