加载中...

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

rust react tauri app 现有前端项目打包(windows)
现有前端项目打包
环境配置
  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
  • 1
  • 2
  • 3

执行完毕在package添加

{
  // This content is just a sample
  "scripts": {
    "tauri": "tauri"
  }
}
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6

附图
New Image
安装@tauri-apps/api 依赖

yarn add @tauri-apps/api
# OR
npm install @tauri-apps/api
  • 1
  • 2
  • 3

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

yarn tauri init
或
npm run tauri init
或
cargo tauri init
或
tauri init
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7

目录如下

└── 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
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15
  • 16
  • 17
  • 18
  • 19
  • 20
  • 21
  • 22
  • 23
  • 24
  • 25
  • 26

附图
New Image

启动

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

npm run start //启动前端目录

  • 1
  • 2

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

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

编辑时下载info: Downloading https://github.com/wixtoolset/wix3/releases/download/wix3112rtm/wix311-binaries.zip如果下载不了可手动下载并解压到项目
C:\Users\username\AppData\Local\tauri目录
New Image

最后赋一张图

New Image