[JavaScript知识库]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

执行完毕在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如果下载不了可手动下载并解压到项目
my-app-tauri\src-tauri\WixTools目录

最后赋一张图