Menggunakan winapp CLI dengan Tauri

Panduan ini menunjukkan cara menggunakan winapp CLI dengan aplikasi Tauri untuk men-debug dengan identitas paket dan mengemas aplikasi Anda sebagai MSIX.

Identitas paket adalah konsep inti dalam model Windows app. Ini memungkinkan aplikasi Anda untuk mengakses API Windows tertentu (seperti Notifikasi, Keamanan, API AI, dll), memiliki pengalaman penginstalan/penghapusan instalasi yang bersih, dan banyak lagi.

Untuk contoh kerja lengkap, lihat sampel Tauri di repositori ini.

Prasyarat

Windows 11
Node.js - winget install OpenJS.NodeJS --source winget
Rust Toolchain - Instal Rust menggunakan rustup atau winget install Rustlang.Rustup --source winget
winapp CLI - winget install microsoft.winappcli --source winget

Tip

Jika Anda sudah menginstal ini, jalankan winget install perintah untuk memeriksa pembaruan.

1. Buat Aplikasi Tauri Baru

Mulailah dengan membuat aplikasi Tauri baru menggunakan alat scaffolding resmi:

npm create tauri-app@latest

Ikuti perintah:

nama Project: tauri-app (atau nama pilihan Anda)
Bahasa frontend: JavaScript
Manajer paket: npm
Templat UI: Vanilla
Rasa UI: JavaScript

Navigasikan ke direktori project Anda dan instal dependensi:

cd tauri-app
npm install

Jalankan aplikasi untuk memastikan semuanya berfungsi:

npm run tauri dev

2. Perbarui Kode untuk Memeriksa Identitas

Kami akan memperbarui aplikasi untuk memeriksa apakah aplikasi berjalan dengan identitas paket. Kita akan menggunakan peti windows di backend Rust untuk mengakses API Windows dan mengeksposnya ke frontend.

Perubahan Backend (Rust)

Tambahkan Dependensi: Buka src-tauri/Cargo.toml dan tambahkan baris berikut di akhir file. Ini menambahkan pengikatan API Windows sehingga kita dapat memeriksa identitas paket:
```
[target.'cfg(windows)'.dependencies]
windows = { version = "0.58", features = ["ApplicationModel"] }
```

Tambahkan Perintah: Buka src-tauri/src/lib.rs dan tambahkan get_package_family_name fungsi . Tempatkan sebelum fungsi pub fn run().

#[tauri::command]
fn get_package_family_name() -> String {
    #[cfg(target_os = "windows")]
    {
        use windows::ApplicationModel::Package;
        match Package::Current() {
            Ok(package) => {
                match package.Id() {
                    Ok(id) => match id.FamilyName() {
                        Ok(name) => name.to_string(),
                        Err(_) => "Error retrieving Family Name".to_string(),
                    },
                    Err(_) => "Error retrieving Package ID".to_string(),
                }
            }
            Err(_) => "No package identity".to_string(),
        }
    }
    #[cfg(not(target_os = "windows"))]
    {
        "Not running on Windows".to_string()
    }
}

Perintah Daftar: Dalam file yang sama (src-tauri/src/lib.rs), perbarui run fungsi untuk mendaftarkan perintah baru:

pub fn run() {
    tauri::Builder::default()
        .plugin(tauri_plugin_opener::init())
        .invoke_handler(tauri::generate_handler![greet, get_package_family_name]) // Add get_package_family_name here
        .run(tauri::generate_context!())
        .expect("error while running tauri application");
}

Perubahan Frontend (JavaScript)

Perbarui HTML: Buka src/index.html dan tambahkan paragraf untuk menampilkan hasilnya:
```

<p id="pfn-msg"></p>
```

Logika Pembaruan: Buka src/main.js untuk memanggil perintah dan menampilkan hasilnya:

const { invoke } = window.__TAURI__.core;

// ... existing code ...

async function checkPackageIdentity() {
  const pfn = await invoke("get_package_family_name");
  const pfnMsgEl = document.querySelector("#pfn-msg");

  if (pfn !== "No package identity" && !pfn.startsWith("Error")) {
    pfnMsgEl.textContent = `Package family name: ${pfn}`;
  } else {
    pfnMsgEl.textContent = `Not running with package identity`;
  }
}

window.addEventListener("DOMContentLoaded", () => {
  // ... existing code ...
  checkPackageIdentity();
});

Sekarang, jalankan aplikasi seperti biasa:
```
npm run tauri dev
```
Anda akan melihat "Tidak berjalan dengan identitas paket" di jendela aplikasi. Ini mengonfirmasi bahwa build pengembangan standar berjalan tanpa identitas paket.

3. Inisialisasi Project dengan winapp CLI

Perintah winapp init menyiapkan semua yang Anda butuhkan dalam sekali jalan: manifes dan aset aplikasi. Manifes menentukan identitas aplikasi Anda (nama, penerbit, versi) yang Windows gunakan untuk memberikan akses API.

Jalankan perintah berikut dan ikuti perintah:

winapp init

Ketika diminta:

Nama paket: Tekan Enter untuk menerima default (tauri-app)
Nama penerbit: Tekan Enter untuk menerima pengaturan standar atau masukkan nama Anda
Versi: Tekan Enter untuk menerima 1.0.0.0
Titik masuk: Tekan Enter untuk menerima default (tauri-app.exe)
Penyiapan SDK: Pilih "Jangan siapkan SDK" (Tauri menggunakan perpustakaan Rust , bukan header C++ SDK)

Perintah ini akan:

Buat Package.appxmanifest — manifes yang menentukan identitas aplikasi Anda
Buat Assets folder — ikon yang diperlukan untuk pengemasan MSIX dan pengiriman Store

Note

Karena tidak ada paket SDK yang dikelola, tidak ada winapp.yaml yang dibuat — Tauri menggunakan kerangka Rust windows melalui Cargo, jadi winapp restore/update tidak perlu melacak apapun.

Anda dapat membuka Package.appxmanifest untuk menyesuaikan properti lebih lanjut seperti nama tampilan, penerbit, dan kemampuan.

4. Debug dengan Identitas

Untuk men-debug dengan identitas, kita perlu membangun backend Rust dan menjalankannya dengan winapp run. Karena npm run tauri dev mengelola siklus hidup proses, lebih sulit untuk menyuntikkan identitas di sana. Sebagai gantinya, kita akan membuat skrip kustom. Tidak diperlukan sertifikat atau penandatanganan untuk debug.

Tambahkan Skrip: Buka package.json dan tambahkan skrip tauri:dev:withidentitybaru :
```
"scripts": {
  "tauri": "tauri",
  "tauri:dev:withidentity": "cargo build --manifest-path src-tauri/Cargo.toml && (if not exist dist mkdir dist) && copy /Y src-tauri\\target\\debug\\tauri-app.exe dist\\ >nul && winapp run .\\dist"
}
```
Apa fungsi skrip ini:
- cargo build ...: Mengkompilasi ulang backend Rust.
- copy ... dist\\: Hanya mengatur exe ke dalam folder dist (folder target\debug sangat besar dan berisi hasil build sementara yang bukan bagian dari aplikasi Anda).
- winapp run .\\dist: Mendaftarkan paket tata letak yang longgar (sama seperti penginstalan MSIX nyata) dan meluncurkan aplikasi.
Jalankan Skrip:
```
npm run tauri:dev:withidentity
```

Tip

Anda mungkin melihat jendela terminal/konsol muncul di belakang jendela aplikasi — ini normal untuk build debug Tauri (ini adalah konsol proses Rust).

Anda sekarang akan melihat aplikasi terbuka dan menampilkan "Package family name", mengonfirmasi bahwa aplikasi tersebut berjalan dengan identitas yang benar! Anda sekarang dapat mulai menggunakan dan melakukan debug pada API yang memerlukan identitas paket, seperti Pemberitahuan atau API AI baru seperti Phi Silica.

Tip

winapp run juga mendaftarkan paket pada sistem Anda. Inilah sebabnya mengapa MSIX mungkin muncul sebagai "sudah diinstal" ketika Anda mencoba menginstalnya nanti di langkah 5. Gunakan winapp unregister untuk membersihkan paket pengembangan setelah selesai.

Tip

Untuk alur kerja penelusuran kesalahan tingkat lanjut (melampirkan debugger, penyiapan IDE, penelusuran kesalahan startup), lihat Panduan Penelusuran Kesalahan.

5. Paket dengan MSIX

Setelah siap mendistribusikan aplikasi, Anda dapat mengemasnya sebagai MSIX yang akan memberikan identitas paket ke aplikasi Anda.

Pertama, tambahkan pack:msix skrip ke package.json:

"scripts": {
  "tauri": "tauri",
  "tauri:dev:withidentity": "...",
  "pack:msix": "npm run tauri -- build && (if not exist dist mkdir dist) && copy /Y src-tauri\\target\\release\\tauri-app.exe dist\\ >nul && winapp pack .\\dist --cert .\\devcert.pfx"
}

Apa fungsi skrip ini:

npm run tauri -- build: Membangun backend Rust dalam mode rilis.
copy ... dist\\: Hanya mengatur exe ke dalam folder dist (folder target\release sangat besar dan berisi hasil build sementara yang bukan bagian dari aplikasi Anda).
winapp pack .\\dist --cert .\\devcert.pfx: Mengemas dan menandatangani aplikasi sebagai MSIX.

Membuat Sertifikat Pengembangan

Paket MSIX harus ditandatangani. Untuk pengujian lokal, buat sertifikat pengembangan yang ditandatangani sendiri:

winapp cert generate --if-exists skip

Tip

Publisher sertifikat harus cocok dengan Publisher di Package.appxmanifest Anda. Perintah cert generate akan membaca ini secara otomatis dari manifes Anda.

Bangun, Tahap, dan Kemas

npm run pack:msix

Tip

Perintah pack secara otomatis menggunakan Package.appxmanifest dari direktori Anda saat ini dan menyalinnya ke folder target sebelum pengemasan. File .msix yang dihasilkan akan berada di direktori saat ini.

Menginstal Sertifikat

Sebelum Anda dapat menginstal paket MSIX, Anda perlu mempercayai sertifikat pengembangan pada komputer Anda. Jalankan perintah ini sebagai administrator (Anda hanya perlu melakukan ini sekali per sertifikat):

winapp cert install .\devcert.pfx

Instal dan Jalankan

Tip

Jika Anda menggunakan winapp run di langkah 4, paket mungkin sudah terdaftar di sistem Anda. Gunakan winapp unregister terlebih dahulu untuk menghapus pendaftaran pengembangan, lalu instal paket rilis.

Instal paket dengan mengeklik dua kali file yang dihasilkan .msix , atau menggunakan PowerShell:

Add-AppxPackage .\tauri-app.msix

Tip

Nama file MSIX mencakup versi dan arsitektur (misalnya, tauri-app_1.0.0.0_x64.msix). Periksa direktori Anda untuk nama file yang tepat. Jika Anda perlu mengemas ulang setelah perubahan kode, tingkatkan Version di Package.appxmanifest — Windows memerlukan nomor versi yang lebih tinggi untuk memperbarui paket yang diinstal.

Setelah diinstal, Anda dapat meluncurkan aplikasi dari menu Mulai. Anda seharusnya melihat aplikasi berjalan dengan identitas.

Tips

Setelah siap untuk didistribusikan, Anda dapat menandatangani MSIX dengan sertifikat penandatanganan kode dari Otoritas Sertifikat sehingga pengguna Anda tidak perlu menginstal sertifikat yang ditandatangani sendiri.
Microsoft Store akan menandatangani MSIX untuk Anda, tidak perlu menandatangani sebelum pengiriman.
Anda mungkin perlu membuat beberapa paket MSIX, satu untuk setiap arsitektur yang Anda dukung (x64, Arm64).

Langkah Selanjutnya

Distribute melalui winget: Kirimkan MSIX Anda ke Repositori Komunitas Windows Package Manager
Publish ke Microsoft Store: Gunakan winapp store untuk mengirimkan paket Anda
Siapkan CI/CD: Gunakan Tindakan setup-WinAppCli GitHub untuk mengotomatiskan kemasan di alur Anda
Explore Windows API: Dengan identitas paket, Anda sekarang dapat menggunakan Notifications, on-device AI, dan API identity-dependent lainnya

Saran dan Komentar

Apakah halaman ini membantu?

Last updated on 2026-05-12