rust react tauri app 现有前端项目打包(windows)

6 篇文章 0 订阅
现有前端项目打包
环境配置
  1. nodejs及相应包管理器(npm或yarn)
  2. rust 开发环境
  3. WebView2 安装
    下载地址https://developer.microsoft.com/en-us/microsoft-edge/webview2/#download-section(注:windows11系统已预装WebView2
    可不用安装)
  4. 已存在前端项目
项目初始化

首先进入已经写好的前端项目(my-app-tauri) cmd打开命令行安装Tauri CLI 依赖

yarn add -D @tauri-apps/cli
# OR
npm install -D @tauri-apps/cli

执行完毕在package添加

{
  // This content is just a sample
  "scripts": {
    "tauri": "tauri"
  }
}

附图
在这里插入图片描述
安装@tauri-apps/api 依赖

yarn add @tauri-apps/api
# OR
npm install @tauri-apps/api

初始化 app 这里主要是生成src-tauri文件夹及其内容

yarn tauri init
或
npm run tauri init
或
cargo tauri init
或
tauri init

目录如下

└── src-tauri
    ├── .gitignore
    ├── Cargo.toml
    ├── rustfmt.toml
    ├── tauri.conf.json
    ├── icons
    │   ├── 128x128.png
    │   ├── 128x128@2x.png
    │   ├── 32x32.png
    │   ├── Square107x107Logo.png
    │   ├── Square142x142Logo.png
    │   ├── Square150x150Logo.png
    │   ├── Square284x284Logo.png
    │   ├── Square30x30Logo.png
    │   ├── Square310x310Logo.png
    │   ├── Square44x44Logo.png
    │   ├── Square71x71Logo.png
    │   ├── Square89x89Logo.png
    │   ├── StoreLogo.png
    │   ├── icon.icns
    │   ├── icon.ico
    │   └── icon.png
    └── src
        ├── build.rs
        ├── cmd.rs
        └── main.rs

附图
在这里插入图片描述

启动

在项目根目里这里是my-app-tauri 执行

npm run start //启动前端目录

重开一个cmd执行(同样是根目录)

npm run  tauri dev
打包
npm run  build //先打包前端页面
npm run  tauri build //打包生成二进制

编辑时下载info: Downloading https://github.com/wixtoolset/wix3/releases/download/wix3112rtm/wix311-binaries.zip如果下载不了可手动下载并解压到项目
C:\Users\username\AppData\Local\tauri目录
在这里插入图片描述

最后赋一张图

在这里插入图片描述

  • 3
    点赞
  • 4
    收藏
    觉得还不错? 一键收藏
  • 5
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 5
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值