tauri:: javascript / rust를 사용한 desktop app 배포하기

 

 

 

Quick start

 

https://tauri.app/ko/v1/guides/getting-started/setup/vite

 

Vite | Tauri Apps

Vite을 프론트엔드 빌드 도구로 Tauri 앱을 빌드하는 방법

tauri.app

 

 

 

___________
# tauri package update
yarn upgrade @tauri-apps/cli @tauri-apps/api

# for check
yarn outdated @tauri-apps/cli


___________________
# for AUTO setup

# install yarn, powershell
npm install --global yarn
choco install yarn

# app initial - quick 설정
yarn create tauri-app

# dev 실행
yarn tauri dev

# windows app BUIlD
yarn tauri build



___________________
# for MANUAL setup

#1) Front-end 생성, vite 설정예시
yarn create vite

#2) Back-end 생성 - Rust, cargo package update
cd src-tauri
cargo update

# add rust tauri package, using CARGO
cargo install tauri-cli
cargo tauri init

# add rust tauri package, using yarn
yarn add -D @tauri-apps/cli
yarn tauri init

 

 

 

 

 

 

initial settings

 

https://www.rust-lang.org/tools/install

_________________
# for WIN, install RUST
winget install --id Rustlang.Rustup

# To set MSVC Toolchain as Default
rustup default stable-msvc


_________________
# for debian/UBUNTU, install URST
sudo apt update
sudo apt install libwebkit2gtk-4.1-dev \
  build-essential \
  curl \
  wget \
  file \
  libxdo-dev \
  libssl-dev \
  libayatana-appindicator3-dev \
  librsvg2-dev \ 
  libgtk-3-dev \
    

# for debian/ubuntu, install RUST
curl --proto '=https' --tlsv1.2 https://sh.rustup.rs -sSf | sh
. "/workspace/.cargo/env"

# check installation
rustc --version


# Add tauri CLI
yarn add -D @tauri-apps/cli
pnpm add -D @tauri-apps/cli
cargo install tauri-cli


# Build
yarn install 
yarn tauri build

pnpm install 
pnpm tauri build


# Debugging
yarn tauri dev

pnpm tauri dev

 

 

 

 

 

 

 

 

ERROR

 

sudo apt install libwebkit2gtk-4.1-dev

 

  cargo:warning=
  pkg-config exited with status code 1
  > PKG_CONFIG_ALLOW_SYSTEM_CFLAGS=1 pkg-config --libs --cflags libsoup-3.0 libsoup-3.0 >= 3.0

  The system library `libsoup-3.0` required by crate `soup3-sys` was not found.
  The file `libsoup-3.0.pc` needs to be installed and the PKG_CONFIG_PATH environment variable must contain its parent directory.
  The PKG_CONFIG_PATH environment variable is not set.

  HINT: if you have installed the library, try setting PKG_CONFIG_PATH to the directory containing `libsoup-3.0.pc`.

warning: build failed, waiting for other jobs to finish...
    Error failed to build app: failed to build app
 ELIFECYCLE  Command failed with exit code 1.

 

 

 

 

 

 

Debugging

 

vscode debugging set

".vscode/launch.json"에서 아래 내용을 복사-붙여넣기

# .vscode/launch.json

{
  // Use IntelliSense to learn about possible attributes.
  // Hover to view descriptions of existing attributes.
  // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
  "version": "0.2.0",
  "configurations": [
    {
      "type": "lldb",
      "request": "launch",
      "name": "Tauri Development Debug",
      "cargo": {
        "args": [
          "build",
          "--manifest-path=./src-tauri/Cargo.toml",
          "--no-default-features"
        ]
      },
      // task for the `beforeDevCommand` if used, must be configured in `.vscode/tasks.json`
      "preLaunchTask": "ui:dev"
    },
    {
      "type": "lldb",
      "request": "launch",
      "name": "Tauri Production Debug",
      "cargo": {
        "args": ["build", "--release", "--manifest-path=./src-tauri/Cargo.toml"]
      },
      // task for the `beforeBuildCommand` if used, must be configured in `.vscode/tasks.json`
      "preLaunchTask": "ui:build"
    }
  ]
}

 

# .vscode/tasks.json

{
  // See https://go.microsoft.com/fwlink/?LinkId=733558
  // for the documentation about the tasks.json format
  "version": "2.0.0",
  "tasks": [
    {
      "label": "ui:dev",
      "type": "shell",
      // `dev` keeps running in the background
      // ideally you should also configure a `problemMatcher`
      // see https://code.visualstudio.com/docs/editor/tasks#_can-a-background-task-be-used-as-a-prelaunchtask-in-launchjson
      "isBackground": true,
      // change this to your `beforeDevCommand`:
      "command": "yarn",
      "args": ["dev"]
    },
    {
      "label": "ui:build",
      "type": "shell",
      // change this to your `beforeBuildCommand`:
      "command": "yarn",
      "args": ["build"]
    }
  ]
}

 

 

 

 

 

 

 

 

 

 

packaging

 

 

https://tauri.app/ko/v1/guides/building/sidecar

 

외부 바이너리 포함하기 | Tauri Apps

애플리케이션이 작동하도록 하거나 사용자가 추가 종속성(예: Node.js 또는 Python)을 설치하지 않도록 하려면 종속 바이너리를 포함해야 할 수 있습니다. 우리는 이를 sidecar 바이너리라고 부릅니다

tauri.app

 

 

 


https://tauri.app/ko/v1/guides/building/resources

 

추가 파일 끼워넣기 | Tauri Apps

프론트엔드(distDir)의 일부가 아니라거나, 바이너리에 인라인하기에는 너무 크다거나 하는 이유로 추가 파일을 앱 번들에 포함해야하는 경우가 있습니다. 그런 파일을 여기서는 resources라고 부릅

tauri.app

 

 

 

 


 

 

https://tauri.app/ko/v1/guides/features/command

 

프론트엔드에서 Rust 호출하기 | Tauri Apps

Tauri provides a simple yet powerful command system for calling Rust functions from your web app. Commands can accept arguments and return values. They can also return errors and be async.

tauri.app

 

 

 


 

 

https://tauri.app/ko/v1/guides/features/splashscreen

 

시작 화면 | Tauri Apps

웹 페이지를 출력하는 데 약간의 시간이 걸리거나, 메인 창을 표시하기 전에 Rust에서 초기화 절차를 진행해야 하는 경우, 시작 화면을 사용하면 로딩에 대해 사용자 경험을 향상 시킬 수 있습니

tauri.app

 

 

 

 

 

 

 

"category": {
  "description": "The application kind.\n\n
  Should be one of the following:\n
  Business, DeveloperTool, Education, Entertainment, 
  Finance, Game, ActionGame, AdventureGame, 
  ArcadeGame, BoardGame, CardGame, CasinoGame, 
  DiceGame, EducationalGame, FamilyGame, KidsGame, 
  MusicGame, PuzzleGame, RacingGame, RolePlayingGame, 
  SimulationGame, SportsGame, StrategyGame, TriviaGame,
   WordGame, GraphicsAndDesign, HealthcareAndFitness, 
   Lifestyle, Medical, Music, News, Photography, 
   Productivity, Reference, SocialNetworking, Sports, 
   Travel, Utility, Video, Weather.",

 

 

 

 

 

 

 

 

 

_

반응형