# Table of Contents

- [Tauri 2.0 | Tauri](#tauri-2-0-tauri)
- [What is Tauri? | Tauri](#what-is-tauri-tauri)
- [Blog | Tauri](#blog-tauri)
- [Capability | Tauri](#capability-tauri)
- [Tauri Core Ecosystem Releases | Tauri](#tauri-core-ecosystem-releases-tauri)
- [Prerequisites | Tauri](#prerequisites-tauri)
- [Project Structure | Tauri](#project-structure-tauri)
- [Tauri Board Elections 2025 | Tauri](#tauri-board-elections-2025-tauri)
- [Tauri Board Elections 2024 | Tauri](#tauri-board-elections-2024-tauri)
- [Rust Security Advisory CVE-2024-24576 | Tauri](#rust-security-advisory-cve-2024-24576-tauri)
- [Announcing Tauri 1.6.0 | Tauri](#announcing-tauri-1-6-0-tauri)
- [Unknown](#unknown)
- [Tauri Programme Turns 1 and Board Elections | Tauri](#tauri-programme-turns-1-and-board-elections-tauri)
- [Announcing tauri-egui 0.1.0 | Tauri](#announcing-tauri-egui-0-1-0-tauri)
- [Announcing Tauri 1.1.0 | Tauri](#announcing-tauri-1-1-0-tauri)
- [Tauri Board Elections & Governance Update | Tauri](#tauri-board-elections-governance-update-tauri)
- [create-tauri-app Version 3 Released | Tauri](#create-tauri-app-version-3-released-tauri)
- [Tauri Community Growth & Feedback | Tauri](#tauri-community-growth-feedback-tauri)
- [Blog | Tauri](#blog-tauri)
- [@tauri-apps/plugin-sql | Tauri](#-tauri-apps-plugin-sql-tauri)
- [@tauri-apps/plugin-autostart | Tauri](#-tauri-apps-plugin-autostart-tauri)
- [@tauri-apps/plugin-haptics | Tauri](#-tauri-apps-plugin-haptics-tauri)
- [@tauri-apps/plugin-global-shortcut | Tauri](#-tauri-apps-plugin-global-shortcut-tauri)
- [@tauri-apps/plugin-barcode-scanner | Tauri](#-tauri-apps-plugin-barcode-scanner-tauri)
- [@tauri-apps/plugin-clipboard-manager | Tauri](#-tauri-apps-plugin-clipboard-manager-tauri)
- [@tauri-apps/plugin-biometric | Tauri](#-tauri-apps-plugin-biometric-tauri)
- [@tauri-apps/plugin-geolocation | Tauri](#-tauri-apps-plugin-geolocation-tauri)
- [@tauri-apps/plugin-window-state | Tauri](#-tauri-apps-plugin-window-state-tauri)
- [@tauri-apps/plugin-process | Tauri](#-tauri-apps-plugin-process-tauri)
- [@tauri-apps/plugin-os | Tauri](#-tauri-apps-plugin-os-tauri)
- [mocks | Tauri](#mocks-tauri)
- [event | Tauri](#event-tauri)
- [@tauri-apps/plugin-deep-link | Tauri](#-tauri-apps-plugin-deep-link-tauri)
- [@tauri-apps/plugin-http | Tauri](#-tauri-apps-plugin-http-tauri)
- [@tauri-apps/plugin-positioner | Tauri](#-tauri-apps-plugin-positioner-tauri)
- [@tauri-apps/plugin-nfc | Tauri](#-tauri-apps-plugin-nfc-tauri)
- [@tauri-apps/plugin-opener | Tauri](#-tauri-apps-plugin-opener-tauri)
- [@tauri-apps/plugin-upload | Tauri](#-tauri-apps-plugin-upload-tauri)
- [@tauri-apps/plugin-dialog | Tauri](#-tauri-apps-plugin-dialog-tauri)
- [@tauri-apps/plugin-websocket | Tauri](#-tauri-apps-plugin-websocket-tauri)
- [@tauri-apps/plugin-cli | Tauri](#-tauri-apps-plugin-cli-tauri)
- [@tauri-apps/plugin-updater | Tauri](#-tauri-apps-plugin-updater-tauri)
- [@tauri-apps/plugin-log | Tauri](#-tauri-apps-plugin-log-tauri)
- [@tauri-apps/plugin-stronghold | Tauri](#-tauri-apps-plugin-stronghold-tauri)
- [@tauri-apps/plugin-store | Tauri](#-tauri-apps-plugin-store-tauri)
- [@tauri-apps/plugin-shell | Tauri](#-tauri-apps-plugin-shell-tauri)
- [@tauri-apps/plugin-notification | Tauri](#-tauri-apps-plugin-notification-tauri)
- [path | Tauri](#path-tauri)
- [@tauri-apps/plugin-fs | Tauri](#-tauri-apps-plugin-fs-tauri)

---

# Tauri 2.0 | Tauri

[Skip to content](https://tauri.app/#_top)

Tauri 2.0
=========

Create small, fast, secure, cross-platform applications

[Get started](https://tauri.app/start/)
 [Tauri 1.0 Documentation](https://v1.tauri.app/)

Create a Project

*   [Bash](https://tauri.app/#tab-panel-588)
    
*   [PowerShell](https://tauri.app/#tab-panel-589)
    
*   [Fish](https://tauri.app/#tab-panel-590)
    
*   [npm](https://tauri.app/#tab-panel-591)
    
*   [Yarn](https://tauri.app/#tab-panel-592)
    
*   [pnpm](https://tauri.app/#tab-panel-593)
    
*   [deno](https://tauri.app/#tab-panel-594)
    
*   [bun](https://tauri.app/#tab-panel-595)
    
*   [Cargo](https://tauri.app/#tab-panel-596)
    

    sh <(curl https://create.tauri.app/sh)

    irm https://create.tauri.app/ps | iex

    sh (curl -sSL https://create.tauri.app/sh | psub)

    npm create tauri-app@latest

    yarn create tauri-app

    pnpm create tauri-app

    deno run -A npm:create-tauri-app

    bun create tauri-app

    cargo install create-tauri-app --lockedcargo create-tauri-app

Frontend Independent

Bring your existing web stack to Tauri or start that new dream project. Tauri supports any frontend framework so you don’t need to change your stack.

Cross Platform

Build your app for Linux, macOS, Windows, Android and iOS - all from a single codebase. Write your frontend in JavaScript, application logic in Rust, and integrate deep into the system with Swift and Kotlin.

Maximum Security

Front-of-mind for the Tauri Team that drives our highest priorities and biggest innovations.

Minimal Size

By using the OS’s native web renderer, the size of a Tauri app can be little as 600KB.

### Supported by

[](https://crabnebula.dev/)

#### Open Collective Sponsors

[![1Password](https://tauri.app/_astro/256_128Of6.webp)\
\
1Password](https://1password.com/?ref=tauri.app&utm_source=tauri.app)

[![VPS Server](https://tauri.app/_astro/256_1sjg0O.webp)](https://www.vpsserver.com/?ref=tauri.app&utm_source=tauri.app)

[![Lightfinder](https://tauri.app/_astro/256_ZLzUW9.webp)](https://opencollective.com/lightfinder?ref=tauri.app&utm_source=tauri.app)

[![Keygen](https://tauri.app/_astro/256_Zo2TPS.webp)](https://keygen.sh/?ref=tauri.app&utm_source=tauri.app)

[![Sourcegraph](https://tauri.app/_astro/256_2c53nR.webp)](https://about.sourcegraph.com/?ref=tauri.app&utm_source=tauri.app)

[![Daniel Thompson-Yvetot](https://tauri.app/_astro/256_SM5EG.webp)](https://github.com/nothingismagick?ref=tauri.app&utm_source=tauri.app)

[![Recut](https://tauri.app/_astro/256_9nyoz.webp)](https://getrecut.com/?ref=tauri.app&utm_source=tauri.app)

[![PhearZero](https://tauri.app/_astro/256_2jR2R3.webp)](https://opencollective.com/phearzero?ref=tauri.app&utm_source=tauri.app)

[![Mintter App](https://tauri.app/_astro/256_ZXxrPd.webp)](https://mintter.com/?ref=tauri.app&utm_source=tauri.app)

[![Matt Campbell](https://tauri.app/_astro/256_ZOCbJm.webp)](https://opencollective.com/matt-campbell1?ref=tauri.app&utm_source=tauri.app)

[![Thad Guidry](https://tauri.app/_astro/256_ZdFPXk.webp)](https://opencollective.com/thad-guidry1?ref=tauri.app&utm_source=tauri.app)

[![Improving](https://tauri.app/_astro/256_1YLyNt.webp)](https://www.improving.com/?ref=tauri.app&utm_source=tauri.app)

[![Pete Thomas](https://tauri.app/_astro/256_jCPsS.webp)](https://opencollective.com/user-44f56a2f?ref=tauri.app&utm_source=tauri.app)

[![Pierre de la Martinière](https://tauri.app/_astro/256_1dUOKe.webp)](https://opencollective.com/pierre-de-la-martiniere?ref=tauri.app&utm_source=tauri.app)

[![FUTO](https://tauri.app/_astro/256_Z1FcHrU.webp)](https://www.futo.org/?ref=tauri.app&utm_source=tauri.app)

[![CoParse](https://tauri.app/_astro/256_cBv49.webp)](https://coparse.com/?ref=tauri.app&utm_source=tauri.app)

[![Rick Richardson](https://tauri.app/_astro/256_13RL6U.webp)](https://opencollective.com/rick-richardson?ref=tauri.app&utm_source=tauri.app)

[![Raffi Minassian](https://tauri.app/_astro/256_241ENf.webp)](https://opencollective.com/raffi-minassian1?ref=tauri.app&utm_source=tauri.app)

[![HTTP Toolkit](https://tauri.app/_astro/256_2o0fJX.webp)](https://httptoolkit.com/?ref=tauri.app&utm_source=tauri.app)

[![Eric Busch](https://tauri.app/_astro/256_Z10yjB8.webp)](https://opencollective.com/user-39d3e8eb?ref=tauri.app&utm_source=tauri.app)

[![Hidekazu Kobayashi](https://tauri.app/_astro/256_ZvpDSE.webp)](https://opencollective.com/hidekazu-kobayashi?ref=tauri.app&utm_source=tauri.app)

[![Aaron Campbell](https://tauri.app/_astro/256_1i4906.webp)](https://opencollective.com/aaron-campbell?ref=tauri.app&utm_source=tauri.app)

[![Controla](https://tauri.app/_astro/256_17d42p.webp)](https://www.controla.ai/?ref=tauri.app&utm_source=tauri.app)

[![Jamie Pine](https://tauri.app/_astro/256_Z1WyA8P.webp)](https://jamiepine.com/?ref=tauri.app&utm_source=tauri.app)

[![Alex Merced](https://tauri.app/_astro/256_2f5cL4.webp)](https://opencollective.com/alex-merced?ref=tauri.app&utm_source=tauri.app)

[![James Bartlett](https://tauri.app/_astro/256_Z54ciR.webp)](https://opencollective.com/james-bartlett1?ref=tauri.app&utm_source=tauri.app)

[![Gyuri Lajos](https://tauri.app/_astro/256_g8KJr.webp)](https://trailmarks.co/?ref=tauri.app&utm_source=tauri.app)

[![Brian DeRocher](https://tauri.app/_astro/256_1t0sfU.webp)](https://opencollective.com/brian-derocher?ref=tauri.app&utm_source=tauri.app)

[![Open Collective](https://tauri.app/_astro/256_Z2eYUa1.webp)](https://opencollective.com/?ref=tauri.app&utm_source=tauri.app)

[![Luke Parker](https://tauri.app/_astro/256_ZAzBo9.webp)](https://opencollective.com/luke-parker?ref=tauri.app&utm_source=tauri.app)

[![Riley Seaburg](https://tauri.app/_astro/256_n4wVo.webp)](https://opencollective.com/guest-7ba71ea5?ref=tauri.app&utm_source=tauri.app)

[![Rabbit Company](https://tauri.app/_astro/256_Z1I1UHw.webp)](https://rabbit-company.com/?ref=tauri.app&utm_source=tauri.app)

[![Jun Hashimoto](https://tauri.app/_astro/256_VpsaE.webp)](https://opencollective.com/jun-hashimoto?ref=tauri.app&utm_source=tauri.app)

[![Robin van Boven](https://tauri.app/_astro/256_ZUaMtE.webp)](https://opencollective.com/robin-van-boven?ref=tauri.app&utm_source=tauri.app)

[![victorhqc](https://tauri.app/_astro/256_giIgr.webp)](https://opencollective.com/victorhqc?ref=tauri.app&utm_source=tauri.app)

[![Clemens Koza](https://tauri.app/_astro/256_2f05JG.webp)](https://opencollective.com/clemens-koza?ref=tauri.app&utm_source=tauri.app)

[![Martin Kramer](https://tauri.app/_astro/256_FqgLi.webp)](https://opencollective.com/martin-kramer?ref=tauri.app&utm_source=tauri.app)

[![Harsha Teja Kanna](https://tauri.app/_astro/256_LATfF.webp)](https://opencollective.com/harsha-teja-kanna?ref=tauri.app&utm_source=tauri.app)

[![Adam Leonard](https://tauri.app/_astro/256_w3pfy.webp)](https://opencollective.com/guest-041a692a?ref=tauri.app&utm_source=tauri.app)

[![JL](https://tauri.app/_astro/256_12bYdP.webp)](https://commandline.be/?ref=tauri.app&utm_source=tauri.app)

[![Noah Corona](https://tauri.app/_astro/256_ZSJom3.webp)](https://opencollective.com/noah-corona1?ref=tauri.app&utm_source=tauri.app)

[![Hector](https://tauri.app/_astro/256_Z1xkbvt.webp)](https://opencollective.com/user-76eb8887?ref=tauri.app&utm_source=tauri.app)

[![grandvin](https://tauri.app/_astro/256_1SVMqn.webp)](https://opencollective.com/grandvin?ref=tauri.app&utm_source=tauri.app)

[![Danny Williams](https://tauri.app/_astro/256_Z1u2spu.webp)](https://opencollective.com/danny-williams?ref=tauri.app&utm_source=tauri.app)

[![MasterDarius](https://tauri.app/_astro/256_1g9vv6.webp)](https://www.nikolaosmargaris.gr/?ref=tauri.app&utm_source=tauri.app)

[![Bitcoin Contributions](https://tauri.app/_astro/256_19uaPn.webp)](https://opencollective.com/bitcoin-contributions?ref=tauri.app&utm_source=tauri.app)

[![Alex Michael Berry](https://tauri.app/_astro/256_WTEbj.webp)](https://ligature.dev/?ref=tauri.app&utm_source=tauri.app)

[![EthicalAds](https://tauri.app/_astro/256_ZHEbPh.webp)](https://www.ethicalads.io/?ref=tauri.app&utm_source=tauri.app)

[![Kether Saturnius](https://tauri.app/_astro/256_Z2oeofo.webp)](https://www.k3th3r.com/?ref=tauri.app&utm_source=tauri.app)

[![John H Stone](https://tauri.app/_astro/256_OGJ2Y.webp)](https://opencollective.com/user-d398d7c1?ref=tauri.app&utm_source=tauri.app)

[![librelois](https://tauri.app/_astro/256_Z1IVCrq.webp)](https://opencollective.com/guest-1092fa70?ref=tauri.app&utm_source=tauri.app)

[![Pintura](https://tauri.app/_astro/256_Z1vDgrL.webp)](https://pqina.nl/pintura/?ref=tauri.app&utm_source=tauri.app)

[![Nonogram Online](https://tauri.app/_astro/256_Z201u1b.webp)](https://www.nonogramonline.org/?ref=tauri.app&utm_source=tauri.app)

[![](https://tauri.app/_astro/256_14PKRb.webp)](https://opencollective.com/user-146594?ref=tauri.app&utm_source=tauri.app)

[![Braden Neufeld](https://tauri.app/_astro/256_Z1au9JX.webp)](https://opencollective.com/braden-neufeld?ref=tauri.app&utm_source=tauri.app)

[![Archon Systems Inc.](https://tauri.app/_astro/256_ZlxzUz.webp)](https://www.archonsystems.com/?ref=tauri.app&utm_source=tauri.app)

[![Seth Lowie](https://tauri.app/_astro/256_2spGw6.webp)](https://opencollective.com/seth-lowie?ref=tauri.app&utm_source=tauri.app)

[![Jacob](https://tauri.app/_astro/256_6cYCS.webp)](https://opencollective.com/jacob7?ref=tauri.app&utm_source=tauri.app)

[![Pochoclin](https://tauri.app/_astro/256_EwAyk.webp)](https://opencollective.com/pochoclin?ref=tauri.app&utm_source=tauri.app)

[![Kobra Rocks](https://tauri.app/_astro/256_Z2gVSP6.webp)](https://kobra.rocks/?ref=tauri.app&utm_source=tauri.app)

[![Florian Neumann](https://tauri.app/_astro/256_Z1kw7rx.webp)](https://opencollective.com/florian-neumann?ref=tauri.app&utm_source=tauri.app)

[![Christoph Karrer-Hoffmann](https://tauri.app/_astro/256_1yEnVn.webp)](https://opencollective.com/christoph-karrer-hoffmann?ref=tauri.app&utm_source=tauri.app)

[![Thong Tran](https://tauri.app/_astro/256_Zn9zIu.webp)](https://opencollective.com/thong-tran?ref=tauri.app&utm_source=tauri.app)

[![Alexander Herrmann](https://tauri.app/_astro/256_1qyP8z.webp)](https://opencollective.com/darignac?ref=tauri.app&utm_source=tauri.app)

[![nelson](https://tauri.app/_astro/256_h0JQt.webp)](https://opencollective.com/nelson6?ref=tauri.app&utm_source=tauri.app)

[![Secdude](https://tauri.app/_astro/256_ZPqzhO.webp)](https://opencollective.com/secdude?ref=tauri.app&utm_source=tauri.app)

[![Robert Collins](https://tauri.app/_astro/256_ZhAD4w.webp)](https://opencollective.com/rcollins?ref=tauri.app&utm_source=tauri.app)

[![Seokju Na](https://tauri.app/_astro/256_2sLO24.webp)](https://opencollective.com/seokju-na1?ref=tauri.app&utm_source=tauri.app)

[![Fritz-Rainer Doebbelin](https://tauri.app/_astro/256_1JeQvN.webp)](https://opencollective.com/fritz-rainer-doebbelin?ref=tauri.app&utm_source=tauri.app)

[![Darryl Spencer](https://tauri.app/_astro/256_ZXgwD0.webp)](https://twitter.com/DarrylDSpencer?ref=tauri.app&utm_source=tauri.app)

[![Ethan Li](https://tauri.app/_astro/256_1tmap9.webp)](https://opencollective.com/user-72b0b300?ref=tauri.app&utm_source=tauri.app)

[![kuma](https://tauri.app/_astro/256_1EzN9W.webp)](https://opencollective.com/kuma?ref=tauri.app&utm_source=tauri.app)

[![praxr](https://tauri.app/_astro/256_Zxt3kf.webp)](http://praxr.com/?ref=tauri.app&utm_source=tauri.app)

[![ken](https://tauri.app/_astro/256_ejN2J.webp)](https://opencollective.com/ken2?ref=tauri.app&utm_source=tauri.app)

[![Simon](https://tauri.app/_astro/256_1ghs4m.webp)](https://opencollective.com/simon15?ref=tauri.app&utm_source=tauri.app)

[![Alexander Eden](https://tauri.app/_astro/256_RVtYX.webp)](https://github.com/alexeden?ref=tauri.app&utm_source=tauri.app)

[![Jan](https://tauri.app/_astro/256_2blOJn.webp)](https://opencollective.com/jan50?ref=tauri.app&utm_source=tauri.app)

[![Sentry](https://tauri.app/_astro/256_Z5aWa.webp)](https://sentry.io/welcome/?ref=tauri.app&utm_source=tauri.app)

[![James Carlson](https://tauri.app/_astro/256_Z1jCMsL.webp)](https://opencollective.com/james-carlson?ref=tauri.app&utm_source=tauri.app)

[![Christian Alfoni](https://tauri.app/_astro/256_Z1lqNLj.webp)](https://www.christianalfoni.com/?ref=tauri.app&utm_source=tauri.app)

[![Arturo José Pérez Verdú](https://tauri.app/_astro/256_ubt3e.webp)](https://opencollective.com/arturo-jose-perez-verdu?ref=tauri.app&utm_source=tauri.app)

[![tomita](https://tauri.app/_astro/256_Z100Fco.webp)](https://opencollective.com/tomita?ref=tauri.app&utm_source=tauri.app)

[![Justin Dorfman](https://tauri.app/_astro/256_1ljJP2.webp)](https://www.justindorfman.com/?ref=tauri.app&utm_source=tauri.app)

[![RxDB](https://tauri.app/_astro/256_ZD7FRn.webp)](https://rxdb.info/?utm_source=opencollective&utm_medium=banner&utm_campaign=opencollective_sponsor&utm_content=logo?ref=tauri.app&utm_source=tauri.app)

[![Ivan](https://tauri.app/_astro/256_2oXVok.webp)](https://opencollective.com/ivan13?ref=tauri.app&utm_source=tauri.app)

[![Proxyman](https://tauri.app/_astro/256_29Qskf.webp)](https://proxyman.com/?ref=tauri.app&utm_source=tauri.app)

#### GitHub Sponsors

[![3colorr](https://tauri.app/_astro/19345951_n5jXk.webp)](https://github.com/3colorr)

[![ahkohd](https://tauri.app/_astro/13041443_1DnIWt.webp)](https://github.com/ahkohd)

[![Akmot9](https://tauri.app/_astro/95435335_1Ujztz.webp)](https://github.com/Akmot9)

[![alexeden](https://tauri.app/_astro/10469676_2ocuAv.webp)](https://github.com/alexeden)

[![alprimak](https://tauri.app/_astro/9585448_USiB4.webp)](https://github.com/alprimak)

[![and-cesbo](https://tauri.app/_astro/966818_1UiLXj.webp)](https://github.com/and-cesbo)

[![austenc](https://tauri.app/_astro/575421_Z1Fu4f0.webp)](https://github.com/austenc)

[![BE-CH](https://tauri.app/_astro/1050050_1wVaw5.webp)](https://github.com/BE-CH)

[![ciscorn](https://tauri.app/_astro/5351911_2rNuh6.webp)](https://github.com/ciscorn)

[![ErikBjare](https://tauri.app/_astro/1405370_239Jjf.webp)](https://github.com/ErikBjare)

[![fastrepl](https://tauri.app/_astro/142983232_gFNMk.webp)](https://github.com/fastrepl)

[![filiptronicek](https://tauri.app/_astro/29888641_1bsLgu.webp)](https://github.com/filiptronicek)

[![gitbutlerapp](https://tauri.app/_astro/123460877_qXmgj.webp)](https://github.com/gitbutlerapp)

[![hobbestherat](https://tauri.app/_astro/7561053_ZR6hJb.webp)](https://github.com/hobbestherat)

[![Jesper-Andersen](https://tauri.app/_astro/38454312_Z1mRDwv.webp)](https://github.com/Jesper-Andersen)

[![jonahgeorge](https://tauri.app/_astro/2058205_1koMcW.webp)](https://github.com/jonahgeorge)

[![kibertoad](https://tauri.app/_astro/1847934_Z1IRom5.webp)](https://github.com/kibertoad)

[![mantreshkhurana](https://tauri.app/_astro/120998049_1k0wVh.webp)](https://github.com/mantreshkhurana)

[![marcelgundermann](https://tauri.app/_astro/26166998_1lwQF8.webp)](https://github.com/marcelgundermann)

[![MindWorkAI](https://tauri.app/_astro/170861826_Z1CkaAE.webp)](https://github.com/MindWorkAI)

[![mrHaiker](https://tauri.app/_astro/15235366_Zt110G.webp)](https://github.com/mrHaiker)

[![nelsontkq](https://tauri.app/_astro/19982338_Z1Ef1qe.webp)](https://github.com/nelsontkq)

[![nineclue](https://tauri.app/_astro/8707_Z2krSV0.webp)](https://github.com/nineclue)

[![nothingismagick](https://tauri.app/_astro/35242872_ehn93.webp)](https://github.com/nothingismagick)

[![samirdjelal](https://tauri.app/_astro/25848885_Z1wVUFw.webp)](https://github.com/samirdjelal)

[![scyberlife](https://tauri.app/_astro/103275164_fNvA0.webp)](https://github.com/scyberlife)

[![sean-hale-dev](https://tauri.app/_astro/61203664_Z2mzeIL.webp)](https://github.com/sean-hale-dev)

[![sedrakpc](https://tauri.app/_astro/6464002_Z3FL2u.webp)](https://github.com/sedrakpc)

[![Sir-Thom](https://tauri.app/_astro/90110920_Z1o16Kc.webp)](https://github.com/Sir-Thom)

[![SlawomirBuszko](https://tauri.app/_astro/64653375_Z10c3q5.webp)](https://github.com/SlawomirBuszko)

[![stancl](https://tauri.app/_astro/33033094_2aOt21.webp)](https://github.com/stancl)

[![syntaxfm](https://tauri.app/_astro/130389858_Z1wIE8S.webp)](https://github.com/syntaxfm)

[![tibordp](https://tauri.app/_astro/1655612_Z1qIq12.webp)](https://github.com/tibordp)

[![tonur](https://tauri.app/_astro/15033328_vOzq4.webp)](https://github.com/tonur)

[![utilForever](https://tauri.app/_astro/5622661_1O0LOg.webp)](https://github.com/utilForever)

[![yannkost](https://tauri.app/_astro/25202769_Z1QHI72.webp)](https://github.com/yannkost)

### Website powered by

[](https://www.meilisearch.com/)
[](https://netlify.com/)

* * *

[Support on Open Collective](https://opencollective.com/tauri)
 [Sponsor on GitHub](https://github.com/sponsors/tauri-apps)

© 2026 Tauri Contributors. CC-BY / MIT

---

# What is Tauri? | Tauri

[Skip to content](https://tauri.app/start/#_top)

What is Tauri?
==============

Tauri is a framework for building tiny, fast binaries for all major desktop and mobile platforms. Developers can integrate any frontend framework that compiles to HTML, JavaScript, and CSS for building their user experience while leveraging languages such as Rust, Swift, and Kotlin for backend logic when needed.

Get started building with [`create-tauri-app`](https://github.com/tauri-apps/create-tauri-app)
 by using one of the below commands. Be sure to follow the [prerequisites guide](https://tauri.app/start/prerequisites/)
 to install all of the dependencies required by Tauri. For a more detailed walk through, see [Create a Project](https://tauri.app/start/create-project/#using-create-tauri-app)

*   [Bash](https://tauri.app/start/#tab-panel-1654)
    
*   [PowerShell](https://tauri.app/start/#tab-panel-1655)
    
*   [Fish](https://tauri.app/start/#tab-panel-1656)
    
*   [npm](https://tauri.app/start/#tab-panel-1657)
    
*   [Yarn](https://tauri.app/start/#tab-panel-1658)
    
*   [pnpm](https://tauri.app/start/#tab-panel-1659)
    
*   [deno](https://tauri.app/start/#tab-panel-1660)
    
*   [bun](https://tauri.app/start/#tab-panel-1661)
    
*   [Cargo](https://tauri.app/start/#tab-panel-1662)
    

    sh <(curl https://create.tauri.app/sh)

    irm https://create.tauri.app/ps | iex

    sh (curl -sSL https://create.tauri.app/sh | psub)

    npm create tauri-app@latest

    yarn create tauri-app

    pnpm create tauri-app

    deno run -A npm:create-tauri-app

    bun create tauri-app

    cargo install create-tauri-app --lockedcargo create-tauri-app

After you’ve created your first app, take a look at [Project Structure](https://tauri.app/start/project-structure/)
 to understand what each file does.

Or explore the project setups and features from the examples ([tauri](https://github.com/tauri-apps/tauri/tree/dev/examples)
 | [plugins-workspace](https://github.com/tauri-apps/plugins-workspace/tree/v2/examples/api)
)

[Why Tauri?](https://tauri.app/start/#why-tauri)

-------------------------------------------------

[Section titled “Why Tauri?”](https://tauri.app/start/#why-tauri)

Tauri has 3 main advantages for developers to build upon:

*   Secure foundation for building apps
*   Smaller bundle size by using the system’s native webview
*   Flexibility for developers to use any frontend and bindings for multiple languages

Learn more about the Tauri philosophy in the [Tauri 1.0 blog post](https://tauri.app/blog/tauri-1-0/)
.

### [Secure Foundation](https://tauri.app/start/#secure-foundation)

[Section titled “Secure Foundation”](https://tauri.app/start/#secure-foundation)

By being built on Rust, Tauri is able to take advantage of the memory, thread, and type-safety offered by Rust. Apps built on Tauri can automatically get those benefits even without needing to be developed by Rust experts.

Tauri also undergoes a security audit for major and minor releases. This not only covers code in the Tauri organization, but also for upstream dependencies that Tauri relies on. Of course this doesn’t mitigate all risks, but it provides a solid foundation for developers to build on top of.

Read the [Tauri security policy](https://github.com/tauri-apps/tauri/security/policy)
 and the [Tauri 2.0 audit report](https://github.com/tauri-apps/tauri/blob/dev/audits/Radically_Open_Security-v2-report.pdf)
.

### [Smaller App Size](https://tauri.app/start/#smaller-app-size)

[Section titled “Smaller App Size”](https://tauri.app/start/#smaller-app-size)

Tauri apps take advantage of the web view already available on every user’s system. A Tauri app only contains the code and assets specific for that app and doesn’t need to bundle a browser engine with every app. This means that a minimal Tauri app can be less than 600KB in size.

Learn more about creating optimized apps in the [App Size concept](https://tauri.app/concept/size/)
.

### [Flexible Architecture](https://tauri.app/start/#flexible-architecture)

[Section titled “Flexible Architecture”](https://tauri.app/start/#flexible-architecture)

Since Tauri uses web technologies that means that virtually any frontend framework is compatible with Tauri. The [Frontend Configuration guide](https://tauri.app/start/frontend/)
 contains common configurations for popular frontend frameworks.

Bindings between JavaScript and Rust are available to developers using the `invoke` function in JavaScript and Swift and Kotlin bindings are available for [Tauri Plugins](https://tauri.app/develop/plugins/)
.

[TAO](https://github.com/tauri-apps/tao)
 is responsible for Tauri window creation and [WRY](https://github.com/tauri-apps/wry)
 is responsible for web view rendering. These are libraries maintained by Tauri and can be consumed directly if deeper system integration is required outside of what Tauri exposes.

In addition, Tauri maintains a number of plugins to extend what core Tauri exposes. You can find those plugins alongside those provided by the community in the [Plugins section](https://tauri.app/plugin/)
.

* * *

[Support on Open Collective](https://opencollective.com/tauri)
 [Sponsor on GitHub](https://github.com/sponsors/tauri-apps)

© 2026 Tauri Contributors. CC-BY / MIT

---

# Blog | Tauri

[Skip to content](https://tauri.app/blog/#_top)

Blog
====

As we continue to be amazed with all the applications you’ve created with Tauri v2, it’s been 4 years that Tauri has become a Programme within The Commons Conservancy! This means we’re preparing for a new round of Tauri Board Director elections for the next term.

The first look of the integration with Verso, a browser based on Servo

Tauri 2.0 stable is released!

Tauri 2.0 is on track to stable and now enters the release candidate phase. Read more about breaking changes and our plans for stable.

The Tauri team is happy to announce the 1.7.0 release.

* * *

[Support on Open Collective](https://opencollective.com/tauri)
 [Sponsor on GitHub](https://github.com/sponsors/tauri-apps)

© 2026 Tauri Contributors. CC-BY / MIT

---

# Capability | Tauri

[Skip to content](https://tauri.app/reference/acl/capability/#_top)

Capability
==========

A grouping and boundary mechanism developers can use to isolate access to the IPC layer.

It controls application windows’ and webviews’ fine grained access to the Tauri core, application, or plugin commands. If a webview or its window is not matching any capability then it has no access to the IPC layer at all.

This can be done to create groups of windows, based on their required system access, which can reduce impact of frontend vulnerabilities in less privileged windows. Windows can be added to a capability by exact name (e.g. `main-window`) or glob patterns like `*` or `admin-*`. A Window can have none, one, or multiple associated capabilities.

### [Example](https://tauri.app/reference/acl/capability/#example)

[Section titled “Example”](https://tauri.app/reference/acl/capability/#example)

    {  "identifier": "main-user-files-write",  "description": "This capability allows the `main` window on macOS and Windows access to `filesystem` write related commands and `dialog` commands to enable programmatic access to files selected by the user.",  "windows": [    "main"  ],  "permissions": [    "core:default",    "dialog:open",    {      "identifier": "fs:allow-write-text-file",      "allow": [{ "path": "$HOME/test.txt" }]    },  ],  "platforms": ["macOS","windows"]}

**Object Properties**:

*   description
*   identifier (required)
*   local
*   permissions (required)
*   platforms
*   remote
*   webviews
*   windows

### [description](https://tauri.app/reference/acl/capability/#description)

[Section titled “description”](https://tauri.app/reference/acl/capability/#description)

`string`

Description of what the capability is intended to allow on associated windows.

It should contain a description of what the grouped permissions should allow.

#### [Example](https://tauri.app/reference/acl/capability/#example-1)

[Section titled “Example”](https://tauri.app/reference/acl/capability/#example-1)

This capability allows the `main` window access to `filesystem` write related commands and `dialog` commands to enable programmatic access to files selected by the user.

### [identifier](https://tauri.app/reference/acl/capability/#identifier)

[Section titled “identifier”](https://tauri.app/reference/acl/capability/#identifier)

`string`

Identifier of the capability.

#### [Example](https://tauri.app/reference/acl/capability/#example-2)

[Section titled “Example”](https://tauri.app/reference/acl/capability/#example-2)

`main-user-files-write`

### [local](https://tauri.app/reference/acl/capability/#local)

[Section titled “local”](https://tauri.app/reference/acl/capability/#local)

`boolean`

Whether this capability is enabled for local app URLs or not. Defaults to `true`.

**Default**: `true`

### [permissions](https://tauri.app/reference/acl/capability/#permissions)

[Section titled “permissions”](https://tauri.app/reference/acl/capability/#permissions)

[`PermissionEntry`](https://tauri.app/reference/acl/capability/#permissionentry)
\[\] each item must be unique

List of permissions attached to this capability.

Must include the plugin name as prefix in the form of `${plugin-name}:${permission-name}`. For commands directly implemented in the application itself only `${permission-name}` is required.

#### [Example](https://tauri.app/reference/acl/capability/#example-3)

[Section titled “Example”](https://tauri.app/reference/acl/capability/#example-3)

    [  "core:default",  "shell:allow-open",  "dialog:open",  {    "identifier": "fs:allow-write-text-file",    "allow": [{ "path": "$HOME/test.txt" }]  }]

### [platforms](https://tauri.app/reference/acl/capability/#platforms)

[Section titled “platforms”](https://tauri.app/reference/acl/capability/#platforms)

[`Target`](https://tauri.app/reference/acl/capability/#target)
\[\] | `null`

Limit which target platforms this capability applies to.

By default all platforms are targeted.

#### [Example](https://tauri.app/reference/acl/capability/#example-4)

[Section titled “Example”](https://tauri.app/reference/acl/capability/#example-4)

`["macOS","windows"]`

### [remote](https://tauri.app/reference/acl/capability/#remote)

[Section titled “remote”](https://tauri.app/reference/acl/capability/#remote)

[`CapabilityRemote`](https://tauri.app/reference/acl/capability/#capabilityremote)
 | `null`

Configure remote URLs that can use the capability permissions.

This setting is optional and defaults to not being set, as our default use case is that the content is served from our local application.

#### [Example](https://tauri.app/reference/acl/capability/#example-5)

[Section titled “Example”](https://tauri.app/reference/acl/capability/#example-5)

    {  "urls": ["https://*.mydomain.dev"]}

### [webviews](https://tauri.app/reference/acl/capability/#webviews)

[Section titled “webviews”](https://tauri.app/reference/acl/capability/#webviews)

`string`\[\]

List of webviews that are affected by this capability. Can be a glob pattern.

The capability will be enabled on all the webviews whose label matches any of the patterns in this list, regardless of whether the webview’s window label matches a pattern in \[`Self::windows`\].

#### [Example](https://tauri.app/reference/acl/capability/#example-6)

[Section titled “Example”](https://tauri.app/reference/acl/capability/#example-6)

`["sub-webview-one", "sub-webview-two"]`

### [windows](https://tauri.app/reference/acl/capability/#windows)

[Section titled “windows”](https://tauri.app/reference/acl/capability/#windows)

`string`\[\]

List of windows that are affected by this capability. Can be a glob pattern.

If a window label matches any of the patterns in this list, the capability will be enabled on all the webviews of that window, regardless of the value of \[`Self::webviews`\].

On multiwebview windows, prefer specifying \[`Self::webviews`\] and omitting \[`Self::windows`\] for a fine grained access control.

#### [Example](https://tauri.app/reference/acl/capability/#example-7)

[Section titled “Example”](https://tauri.app/reference/acl/capability/#example-7)

`["main"]`

[Definitions](https://tauri.app/reference/acl/capability/#definitions)

-----------------------------------------------------------------------

[Section titled “Definitions”](https://tauri.app/reference/acl/capability/#definitions)

### [CapabilityRemote](https://tauri.app/reference/acl/capability/#capabilityremote)

[Section titled “CapabilityRemote”](https://tauri.app/reference/acl/capability/#capabilityremote)

Configuration for remote URLs that are associated with the capability.

**Object Properties**:

*   urls (required)

##### [urls](https://tauri.app/reference/acl/capability/#urls)

[Section titled “urls”](https://tauri.app/reference/acl/capability/#urls)

`string`\[\]

Remote domains this capability refers to using the [URLPattern standard](https://urlpattern.spec.whatwg.org/)
.

###### [Examples](https://tauri.app/reference/acl/capability/#examples)

[Section titled “Examples”](https://tauri.app/reference/acl/capability/#examples)

*   “https://\*.mydomain.dev”: allows subdomains of mydomain.dev
*   “[https://mydomain.dev/api/](https://mydomain.dev/api/)
    \*”: allows any subpath of mydomain.dev/api

### [Identifier](https://tauri.app/reference/acl/capability/#identifier-1)

[Section titled “Identifier”](https://tauri.app/reference/acl/capability/#identifier-1)

`string`

### [Number](https://tauri.app/reference/acl/capability/#number)

[Section titled “Number”](https://tauri.app/reference/acl/capability/#number)

**Any of the following**:

*   `integer` formatted as `int64` Represents an \[`i64`\].
*   `number` formatted as `double` Represents a \[`f64`\].

A valid ACL number.

### [PermissionEntry](https://tauri.app/reference/acl/capability/#permissionentry)

[Section titled “PermissionEntry”](https://tauri.app/reference/acl/capability/#permissionentry)

**Any of the following**:

*   [`Identifier`](https://tauri.app/reference/acl/capability/#identifier)
     Reference a permission or permission set by identifier.
*   Reference a permission or permission set by identifier and extends its scope. **Object Properties**: - allow - deny - identifier (required) ##### allow [`Value`](https://tauri.app/reference/acl/capability/#value)
    \[\] | `null` Data that defines what is allowed by the scope. ##### deny [`Value`](https://tauri.app/reference/acl/capability/#value)
    \[\] | `null` Data that defines what is denied by the scope. This should be prioritized by validation logic. ##### identifier [`Identifier`](https://tauri.app/reference/acl/capability/#identifier)
     Identifier of the permission or permission set.

An entry for a permission value in a \[`Capability`\] can be either a raw permission \[`Identifier`\] or an object that references a permission and extends its scope.

### [Target](https://tauri.app/reference/acl/capability/#target)

[Section titled “Target”](https://tauri.app/reference/acl/capability/#target)

**One of the following**:

*   `"macOS"` MacOS.
*   `"windows"` Windows.
*   `"linux"` Linux.
*   `"android"` Android.
*   `"iOS"` iOS.

Platform target.

### [Value](https://tauri.app/reference/acl/capability/#value)

[Section titled “Value”](https://tauri.app/reference/acl/capability/#value)

**Any of the following**:

*   `null` Represents a null JSON value.
*   `boolean` Represents a \[`bool`\].
*   [`Number`](https://tauri.app/reference/acl/capability/#number)
     Represents a valid ACL \[`Number`\].
*   `string` Represents a \[`String`\].
*   [`Value`](https://tauri.app/reference/acl/capability/#value)
    \[\] Represents a list of other \[`Value`\]s.
*   Represents a map of \[`String`\] keys to \[`Value`\]s. **Allows additional properties**: [`Value`](https://tauri.app/reference/acl/capability/#value)
    

All supported ACL values.

* * *

[Support on Open Collective](https://opencollective.com/tauri)
 [Sponsor on GitHub](https://github.com/sponsors/tauri-apps)

© 2026 Tauri Contributors. CC-BY / MIT

---

# Tauri Core Ecosystem Releases | Tauri

[Skip to content](https://tauri.app/release/#_top)

Tauri Core Ecosystem Releases
=============================

[tauri](https://tauri.app/release/tauri/v2.9.5/)
 v2.9.5

[@tauri-apps/api](https://tauri.app/release/@tauri-apps/api/v2.9.1/)
 v2.9.1

[tauri-cli (Rust)](https://tauri.app/release/tauri-cli/v2.9.6/)
 v2.9.6

[@tauri-apps/cli (JavaScript)](https://tauri.app/release/@tauri-apps/cli/v2.9.6/)
 v2.9.6

[tauri-bundler](https://tauri.app/release/tauri-bundler/v2.7.5/)
 v2.7.5

[wry](https://tauri.app/release/wry/v0.54.1/)
 v0.54.1

[tao](https://tauri.app/release/tao/v0.34.5/)
 v0.34.5

* * *

[Support on Open Collective](https://opencollective.com/tauri)
 [Sponsor on GitHub](https://github.com/sponsors/tauri-apps)

© 2026 Tauri Contributors. CC-BY / MIT

---

# Prerequisites | Tauri

[Skip to content](https://tauri.app/start/prerequisites/#_top)

Prerequisites
=============

In order to get started building your project with Tauri you’ll first need to install a few dependencies:

1.  [System Dependencies](https://tauri.app/start/prerequisites/#system-dependencies)
    
2.  [Rust](https://tauri.app/start/prerequisites/#rust)
    
3.  [Configure for Mobile Targets](https://tauri.app/start/prerequisites/#configure-for-mobile-targets)
     (only required if developing for mobile)

[System Dependencies](https://tauri.app/start/prerequisites/#system-dependencies)

----------------------------------------------------------------------------------

[Section titled “System Dependencies”](https://tauri.app/start/prerequisites/#system-dependencies)

Follow the link to get started for your respective operating system:

*   [Linux](https://tauri.app/start/prerequisites/#linux)
     (see below for specific distributions)
*   [macOS Catalina (10.15) and later](https://tauri.app/start/prerequisites/#macos)
    
*   [Windows 7 and later](https://tauri.app/start/prerequisites/#windows)
    

### [Linux](https://tauri.app/start/prerequisites/#linux)

[Section titled “Linux”](https://tauri.app/start/prerequisites/#linux)

Tauri requires various system dependencies for development on Linux. These may be different depending on your distribution but we’ve included some popular distributions below to help you get setup.

*   [Debian](https://tauri.app/start/prerequisites/#tab-panel-1663)
    
*   [Arch](https://tauri.app/start/prerequisites/#tab-panel-1664)
    
*   [Fedora](https://tauri.app/start/prerequisites/#tab-panel-1665)
    
*   [Gentoo](https://tauri.app/start/prerequisites/#tab-panel-1666)
    
*   [OSTree](https://tauri.app/start/prerequisites/#tab-panel-1667)
    
*   [openSUSE](https://tauri.app/start/prerequisites/#tab-panel-1668)
    
*   [Alpine](https://tauri.app/start/prerequisites/#tab-panel-1669)
    
*   [NixOS](https://tauri.app/start/prerequisites/#tab-panel-1670)
    

    sudo apt updatesudo apt install libwebkit2gtk-4.1-dev \  build-essential \  curl \  wget \  file \  libxdo-dev \  libssl-dev \  libayatana-appindicator3-dev \  librsvg2-dev

    sudo pacman -Syusudo pacman -S --needed \  webkit2gtk-4.1 \  base-devel \  curl \  wget \  file \  openssl \  appmenu-gtk-module \  libappindicator-gtk3 \  librsvg \  xdotool

    sudo dnf check-updatesudo dnf install webkit2gtk4.1-devel \  openssl-devel \  curl \  wget \  file \  libappindicator-gtk3-devel \  librsvg2-devel \  libxdo-develsudo dnf group install "c-development"

    sudo emerge --ask \  net-libs/webkit-gtk:4.1 \  dev-libs/libappindicator \  net-misc/curl \  net-misc/wget \  sys-apps/file

    sudo rpm-ostree install webkit2gtk4.1-devel \  openssl-devel \  curl \  wget \  file \  libappindicator-gtk3-devel \  librsvg2-devel \  libxdo-devel \  gcc \  gcc-c++ \  makesudo systemctl reboot

    sudo zypper upsudo zypper in webkit2gtk3-devel \  libopenssl-devel \  curl \  wget \  file \  libappindicator3-1 \  librsvg-develsudo zypper in -t pattern devel_basis

    sudo apk add \  build-base \  webkit2gtk-4.1-dev \  curl \  wget \  file \  openssl \  libayatana-appindicator-dev \  librsvg

> Note: Alpine Linux containers don’t include any fonts by default. To ensure text renders correctly in your Tauri app, install at least one font package (for example, `font-dejavu` ).

If your distribution isn’t included above then you may want to check [Awesome Tauri on GitHub](https://github.com/tauri-apps/awesome-tauri#guides)
 to see if a guide has been created.

Next: [Install Rust](https://tauri.app/start/prerequisites/#rust)

### [macOS](https://tauri.app/start/prerequisites/#macos)

[Section titled “macOS”](https://tauri.app/start/prerequisites/#macos)

Tauri uses [Xcode](https://developer.apple.com/xcode/resources/)
 and various macOS and iOS development dependencies.

Download and install Xcode from one of the following places:

*   [Mac App Store](https://apps.apple.com/gb/app/xcode/id497799835?mt=12)
    
*   [Apple Developer website](https://developer.apple.com/xcode/resources/)
    .

Be sure to launch Xcode after installing so that it can finish setting up.

Only developing for desktop targets? If you’re only planning to develop desktop apps and not targeting iOS then you can install Xcode Command Line Tools instead:

    xcode-select --install

Next: [Install Rust](https://tauri.app/start/prerequisites/#rust)

### [Windows](https://tauri.app/start/prerequisites/#windows)

[Section titled “Windows”](https://tauri.app/start/prerequisites/#windows)

Tauri uses the Microsoft C++ Build Tools for development as well as Microsoft Edge WebView2. These are both required for development on Windows.

Follow the steps below to install the required dependencies.

#### [Microsoft C++ Build Tools](https://tauri.app/start/prerequisites/#microsoft-c-build-tools)

[Section titled “Microsoft C++ Build Tools”](https://tauri.app/start/prerequisites/#microsoft-c-build-tools)

1.  Download the [Microsoft C++ Build Tools](https://visualstudio.microsoft.com/visual-cpp-build-tools/)
     installer and open it to begin installation.
2.  During installation check the “Desktop development with C++” option.

![Visual Studio C++ Build Tools installer screenshot](https://tauri.app/_astro/visual-studio-build-tools-installer.BWhlyd8N_2eESh.webp)

Next: [Install WebView2](https://tauri.app/start/prerequisites/#webview2)
.

#### [WebView2](https://tauri.app/start/prerequisites/#webview2)

[Section titled “WebView2”](https://tauri.app/start/prerequisites/#webview2)

Tauri uses Microsoft Edge WebView2 to render content on Windows.

Install WebView2 by visiting the [WebView2 Runtime download section](https://developer.microsoft.com/en-us/microsoft-edge/webview2/#download-section)
. Download the “Evergreen Bootstrapper” and install it.

Next: [Check VBSCRIPT](https://tauri.app/start/prerequisites/#vbscript-for-msi-installers)

#### [VBSCRIPT (for MSI installers)](https://tauri.app/start/prerequisites/#vbscript-for-msi-installers)

[Section titled “VBSCRIPT (for MSI installers)”](https://tauri.app/start/prerequisites/#vbscript-for-msi-installers)

Building MSI packages on Windows requires the VBSCRIPT optional feature to be enabled. This feature is enabled by default on most Windows installations, but may have been disabled on some systems.

If you encounter errors like `failed to run light.exe` when building MSI packages, you may need to enable the VBSCRIPT feature:

1.  Open **Settings** → **Apps** → **Optional features** → **More Windows features**
2.  Locate **VBSCRIPT** in the list and ensure it’s checked
3.  Click **Next** and restart your computer if prompted

**Note:** VBSCRIPT is currently enabled by default on most Windows installations, but is [being deprecated](https://techcommunity.microsoft.com/blog/windows-itpro-blog/vbscript-deprecation-timelines-and-next-steps/4148301)
 and may be disabled in future Windows versions.

Next: [Install Rust](https://tauri.app/start/prerequisites/#rust)

[Rust](https://tauri.app/start/prerequisites/#rust)

----------------------------------------------------

[Section titled “Rust”](https://tauri.app/start/prerequisites/#rust)

Tauri is built with [Rust](https://www.rust-lang.org/)
 and requires it for development. Install Rust using one of following methods. You can view more installation methods at [https://www.rust-lang.org/tools/install](https://www.rust-lang.org/tools/install)
.

*   [Linux and macOS](https://tauri.app/start/prerequisites/#tab-panel-1671)
    
*   [Windows](https://tauri.app/start/prerequisites/#tab-panel-1672)
    

Install via [`rustup`](https://github.com/rust-lang/rustup)
 using the following command:

    curl --proto '=https' --tlsv1.2 https://sh.rustup.rs -sSf | sh

Visit [https://www.rust-lang.org/tools/install](https://www.rust-lang.org/tools/install)
 to install `rustup`.

Alternatively, you can use `winget` to install rustup using the following command in PowerShell:

    winget install --id Rustlang.Rustup

**Be sure to restart your Terminal (and in some cases your system) for the changes to take affect.**

Next: [Configure for Mobile Targets](https://tauri.app/start/prerequisites/#configure-for-mobile-targets)
 if you’d like to build for Android and iOS, or, if you’d like to use a JavaScript framework, [install Node](https://tauri.app/start/prerequisites/#nodejs)
. Otherwise [Create a Project](https://tauri.app/start/create-project/)
.

[Node.js](https://tauri.app/start/prerequisites/#nodejs)

---------------------------------------------------------

[Section titled “Node.js”](https://tauri.app/start/prerequisites/#nodejs)

1.  Go to the [Node.js website](https://nodejs.org/)
    , download the Long Term Support (LTS) version and install it.
2.  Check if Node was successfully installed by running:

    node -v# v20.10.0npm -v# 10.2.3

It’s important to restart your Terminal to ensure it recognizes the new installation. In some cases, you might need to restart your computer.

While npm is the default package manager for Node.js, you can also use others like pnpm or yarn. To enable these, run `corepack enable` in your Terminal. This step is optional and only needed if you prefer using a package manager other than npm.

Next: [Configure for Mobile Targets](https://tauri.app/start/prerequisites/#configure-for-mobile-targets)
 or [Create a project](https://tauri.app/start/create-project/)
.

[Configure for Mobile Targets](https://tauri.app/start/prerequisites/#configure-for-mobile-targets)

----------------------------------------------------------------------------------------------------

[Section titled “Configure for Mobile Targets”](https://tauri.app/start/prerequisites/#configure-for-mobile-targets)

If you’d like to target your app for Android or iOS then there are a few additional dependencies that you need to install:

*   [Android](https://tauri.app/start/prerequisites/#android)
    
*   [iOS](https://tauri.app/start/prerequisites/#ios)
    

### [Android](https://tauri.app/start/prerequisites/#android)

[Section titled “Android”](https://tauri.app/start/prerequisites/#android)

1.  Download and install [Android Studio from the Android Developers website](https://developer.android.com/studio)
    
2.  Set the `JAVA_HOME` environment variable:

*   [Linux](https://tauri.app/start/prerequisites/#tab-panel-1673)
    
*   [macOS](https://tauri.app/start/prerequisites/#tab-panel-1674)
    
*   [Windows](https://tauri.app/start/prerequisites/#tab-panel-1675)
    

    export JAVA_HOME=/opt/android-studio/jbr

    export JAVA_HOME="/Applications/Android Studio.app/Contents/jbr/Contents/Home"

    [System.Environment]::SetEnvironmentVariable("JAVA_HOME", "C:\Program Files\Android\Android Studio\jbr", "User")

3.  Use the SDK Manager in Android Studio to install the following:

*   Android SDK Platform
*   Android SDK Platform-Tools
*   NDK (Side by side)
*   Android SDK Build-Tools
*   Android SDK Command-line Tools

Selecting “Show Package Details” in the SDK Manager enables the installation of older package versions. Only install older versions if necessary, as they may introduce compatibility issues or security risks.

4.  Set `ANDROID_HOME` and `NDK_HOME` environment variables.

*   [Linux](https://tauri.app/start/prerequisites/#tab-panel-1676)
    
*   [macOS](https://tauri.app/start/prerequisites/#tab-panel-1677)
    
*   [Windows](https://tauri.app/start/prerequisites/#tab-panel-1678)
    

    export ANDROID_HOME="$HOME/Android/Sdk"export NDK_HOME="$ANDROID_HOME/ndk/$(ls -1 $ANDROID_HOME/ndk)"

    export ANDROID_HOME="$HOME/Library/Android/sdk"export NDK_HOME="$ANDROID_HOME/ndk/$(ls -1 $ANDROID_HOME/ndk)"

    [System.Environment]::SetEnvironmentVariable("ANDROID_HOME", "$env:LocalAppData\Android\Sdk", "User")$VERSION = Get-ChildItem -Name "$env:LocalAppData\Android\Sdk\ndk" | Select-Object -Last 1[System.Environment]::SetEnvironmentVariable("NDK_HOME", "$env:LocalAppData\Android\Sdk\ndk\$VERSION", "User")

5.  Add the Android targets with `rustup`:

    rustup target add aarch64-linux-android armv7-linux-androideabi i686-linux-android x86_64-linux-android

Next: [Setup for iOS](https://tauri.app/start/prerequisites/#ios)
 or [Create a project](https://tauri.app/start/create-project/)
.

### [iOS](https://tauri.app/start/prerequisites/#ios)

[Section titled “iOS”](https://tauri.app/start/prerequisites/#ios)

1.  Add the iOS targets with `rustup` in Terminal:

    rustup target add aarch64-apple-ios x86_64-apple-ios aarch64-apple-ios-sim

2.  Install [Homebrew](https://brew.sh/)
    :

    /bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)"

3.  Install [Cocoapods](https://cocoapods.org/)
     using Homebrew:

    brew install cocoapods

Next: [Create a project](https://tauri.app/start/create-project/)
.

[Troubleshooting](https://tauri.app/start/prerequisites/#troubleshooting)

--------------------------------------------------------------------------

[Section titled “Troubleshooting”](https://tauri.app/start/prerequisites/#troubleshooting)

If you run into any issues during installation be sure to check the [Troubleshooting Guide](https://tauri.app/develop/debug/)
 or reach out on the [Tauri Discord](https://discord.com/invite/tauri)
.

Next Steps

Now that you’ve installed all of the prerequisites you’re ready to [create your first Tauri project](https://tauri.app/start/create-project/)
!

* * *

[Support on Open Collective](https://opencollective.com/tauri)
 [Sponsor on GitHub](https://github.com/sponsors/tauri-apps)

© 2026 Tauri Contributors. CC-BY / MIT

---

# Project Structure | Tauri

[Skip to content](https://tauri.app/start/project-structure/#_top)

Project Structure
=================

A Tauri project is usually made of 2 parts, a Rust project and a JavaScript project (optional), and typically the setup looks something like this:

    .├── package.json├── index.html├── src/│   ├── main.js├── src-tauri/│   ├── Cargo.toml│   ├── Cargo.lock│   ├── build.rs│   ├── tauri.conf.json│   ├── src/│   │   ├── main.rs│   │   └── lib.rs│   ├── icons/│   │   ├── icon.png│   │   ├── icon.icns│   │   └── icon.ico│   └── capabilities/│       └── default.json

In this case, the JavaScript project is at the top level, and the Rust project is inside `src-tauri/`, the Rust project is a normal [Cargo project](https://doc.rust-lang.org/cargo/guide/project-layout.html)
 with some extra files:

*   `tauri.conf.json` is the main configuration file for Tauri, it contains everything from the application identifier to dev server url, this file is also a marker for the [Tauri CLI](https://tauri.app/reference/cli/)
     to find the Rust project, to learn more about it, see [Tauri Config](https://tauri.app/develop/configuration-files/#tauri-config)
    
*   `capabilities/` directory is the default folder Tauri reads [capability files](https://tauri.app/security/capabilities/)
     from (in short, you need to allow commands here to use them in your JavaScript code), to learn more about it, see [Security](https://tauri.app/security/)
    
*   `icons/` directory is the default output directory of the [`tauri icon`](https://tauri.app/reference/cli/#icon)
     command, it’s usually referenced in `tauri.conf.json > bundle > icon` and used for the app’s icons
*   `build.rs` contains `tauri_build::build()` which is used for tauri’s build system
*   `src/lib.rs` contains the Rust code and the mobile entry point (the function marked with `#[cfg_attr(mobile, tauri::mobile_entry_point)]`), the reason we don’t write directly in `main.rs` is because we compile your app to a library in mobile builds and load them through the platform frameworks
*   `src/main.rs` is the main entry point for the desktop, and we run `app_lib::run()` in `main` to use the same entry point as mobile, so to keep it simple, don’t modify this file, modify `lib.rs` instead. Note that `app_lib` corresponds to `[lib.name]` in Cargo.toml.

Tauri works similar to a static web host, and the way it builds is that you would compile your JavaScript project to static files first, and then compile the Rust project that will bundle those static files in, so the JavaScript project setup is basically the same as if you were to build a static website, to learn more, see [Frontend Configuration](https://tauri.app/start/frontend/)

If you want to work with Rust code only, simply remove everything else and use the `src-tauri/` folder as your top level project or as a member of your Rust workspace

[Next Steps](https://tauri.app/start/project-structure/#next-steps)

--------------------------------------------------------------------

[Section titled “Next Steps”](https://tauri.app/start/project-structure/#next-steps)

*   [Add and Configure a Frontend Framework](https://tauri.app/start/frontend/)
    
*   [Tauri Command Line Interface (CLI) Reference](https://tauri.app/reference/cli/)
    
*   [Learn how to develop your Tauri app](https://tauri.app/develop/)
    
*   [Discover additional features to extend Tauri](https://tauri.app/plugin/)
    

* * *

[Support on Open Collective](https://opencollective.com/tauri)
 [Sponsor on GitHub](https://github.com/sponsors/tauri-apps)

© 2026 Tauri Contributors. CC-BY / MIT

---

# Tauri Board Elections 2025 | Tauri

[Skip to content](https://tauri.app/blog/tauri-board-elections-2025/#_top)

Tauri Board Elections 2025
==========================

Jun 30, 2025

![Robin van Boven](https://tauri.app/authors/Beanow.png)

Robin van Boven

Tauri Board Director

As we continue to be amazed by all the applications you’ve created with Tauri v2, it’s been 4 years since Tauri has become a Programme within [The Commons Conservancy](https://commonsconservancy.org/)
! This means we’re preparing for a new round of Tauri Board Director elections for the next term.

[Board Elections](https://tauri.app/blog/tauri-board-elections-2025/#board-elections)

--------------------------------------------------------------------------------------

[Section titled “Board Elections”](https://tauri.app/blog/tauri-board-elections-2025/#board-elections)

The Tauri Board of Directors is the central decision-making body for the Tauri Programme and is responsible for its overall health and stability. Additional details can be found at the [Tauri Governance page](https://tauri.app/about/governance/)
.

In order to provide continuity from one year to another, the elections of seats are staggered over the course of 2 years. This means that one year a portion of the seats are elected, and the following year the remaining seats are elected. A Tauri Director seat is an elected position with a term of 2 years. The Board has a minimum of 3 Directors and a maximum of 7.

This year there are 5 seats open for election.

### [Applying for Candidacy](https://tauri.app/blog/tauri-board-elections-2025/#applying-for-candidacy)

[Section titled “Applying for Candidacy”](https://tauri.app/blog/tauri-board-elections-2025/#applying-for-candidacy)

There are 3 steps to express interest and apply for candidacy:

1.  Learn about the role of a Tauri Board Director on the [Governance page](https://tauri.app/about/governance/#tauri-board--board-directors)
    .
2.  Prepare a written introduction about yourself that covers who you are, your history and relevance to Tauri, and what you would like to bring to the Board. (Examples from previous years can be found at [https://github.com/tauri-apps/governance-and-guidance](https://github.com/tauri-apps/governance-and-guidance)
    ).
3.  **Apply prior to July 7th, 2025** by emailing [board@tauri.app](mailto:board@tauri.app)
     or messaging the `@board` role on the [Tauri Discord](https://discord.com/invite/tauri)
    .

Voting will take place starting on July 7th through July 14th, 2025 where Tauri Working Group Members will cast their votes. We’re expecting to announce the results on or before July 19, 2025. If elected, we’ll ask you to sign [this pledge](https://dracc.commonsconservancy.org/0016/)
 if you haven’t done so previously.

If you have any questions or would like more information please reach out by emailing [board@tauri.app](mailto:board@tauri.app)
, messaging the `@board` role on the [Tauri Discord](https://discord.com/invite/tauri)
.

[Interested In Getting Involved?](https://tauri.app/blog/tauri-board-elections-2025/#interested-in-getting-involved)

---------------------------------------------------------------------------------------------------------------------

[Section titled “Interested In Getting Involved?”](https://tauri.app/blog/tauri-board-elections-2025/#interested-in-getting-involved)

If joining the Board isn’t for you but still want to help, here are some ways to do so! (Thank you ❤️)

Reach out on our [Discord](https://discord.com/invite/tauri)
 by enabling the roles you’re interested in like “Contribute to Tauri Code” or “Contribute to Documentation”. This reveals the Contributors channels where you can chat with other contributors. While you’re there, consider enabling Discord notification roles to stay apprised of news and questions from the team.

Or on GitHub maybe you can help with these [good first issues](https://github.com/search?q=user%3Atauri-apps+label%3A%22good+first+issue%22+state%3Aopen&type=Issues&s=created&o=desc)
?

Additionally we’re very grateful to all the teams and individuals who [sponsor us on GitHub](https://github.com/sponsors/tauri-apps)
 or [open collective](https://opencollective.com/tauri)
!

[Experimental Tauri Verso Integration](https://tauri.app/blog/tauri-verso-integration/)

* * *

[Support on Open Collective](https://opencollective.com/tauri)
 [Sponsor on GitHub](https://github.com/sponsors/tauri-apps)

© 2026 Tauri Contributors. CC-BY / MIT

---

# Tauri Board Elections 2024 | Tauri

[Skip to content](https://tauri.app/blog/tauri-board-elections-2024/#_top)

Tauri Board Elections 2024
==========================

Jun 28, 2024

![Jacob Bolda](https://tauri.app/authors/jbolda.jpeg)

Jacob Bolda

Tauri Board Director

The Tauri Programme is celebrating its third anniversary of Tauri becoming a programme within [The Commons Conservancy](https://commonsconservancy.org/)
. We are hard at work bringing v2 to a stable release, and now the next round of Tauri Board Director elections is upon us! Want to [get involved in other ways](https://tauri.app/blog/tauri-board-elections-2024/#interested-in-getting-involved)
 and help Tauri towards v2? We would love your contributions especially to help evolve the documentation!

[Board Elections](https://tauri.app/blog/tauri-board-elections-2024/#board-elections)

--------------------------------------------------------------------------------------

[Section titled “Board Elections”](https://tauri.app/blog/tauri-board-elections-2024/#board-elections)

The Tauri Board of Directors is the central decision-making body for the Tauri Programme and is responsible for its overall health and stability. Additional details can be found on the [Tauri Governance page](https://tauri.app/about/governance/)
.

In order to provide continuity from one year to another, the elections of seats are staggered over the course of 2 years. This means that one year a portion of the seats are elected, and the following year the remaining seats are elected. A Tauri Director seat is an elected position with a term of 2 years. The Board has a minimum of 3 Directors and a maximum of 7. This year there are 2 seats open for election.

### [Applying for Candidacy](https://tauri.app/blog/tauri-board-elections-2024/#applying-for-candidacy)

[Section titled “Applying for Candidacy”](https://tauri.app/blog/tauri-board-elections-2024/#applying-for-candidacy)

There are 3 steps to express interest and apply for candidacy:

1.  Learn about the role of a Tauri Board Director on the [Governance page](https://tauri.app/about/governance/#tauri-board--board-directors)
    .
2.  Prepare a written introduction about yourself that covers who you are, your history and relevance for Tauri, and what you would like to bring to the Board.
3.  **Apply prior to July 5th, 2024** by emailing [board@tauri.app](mailto:board@tauri.app)
    , messaging the `@board` role on the [Tauri Discord](https://discord.com/invite/tauri)
    , or by directly messaging Jacob Bolda on Discord (`@jacobbolda`) or email ([jacob@tauri.app](mailto:jacob@tauri.app)
    ).

Voting will take place starting on July 7th through July 12th, 2024 where Tauri Working Group Members will cast their votes. We’re expecting to announce the results on or before July 16, 2024. If elected, we’ll ask you to sign [this pledge](https://dracc.commonsconservancy.org/0016/)
 if you haven’t done so previously.

If you have any questions or would like more information please reach out by emailing [board@tauri.app](mailto:board@tauri.app)
, messaging the `@board` role on the [Tauri Discord](https://discord.com/invite/tauri)
, or by directly messaging Jacob Bolda on Discord (`@jacobbolda`) or email ([jacob@tauri.app](mailto:jacob@tauri.app)
).

[Interested In Getting Involved?](https://tauri.app/blog/tauri-board-elections-2024/#interested-in-getting-involved)

---------------------------------------------------------------------------------------------------------------------

[Section titled “Interested In Getting Involved?”](https://tauri.app/blog/tauri-board-elections-2024/#interested-in-getting-involved)

If joining the Board isn’t for you, we are always looking to enable involvement at any level within Tauri. The documentation for v2 is a large focus of the remaining effort. See the issues within the [tauri-apps/tauri-docs repo](https://github.com/tauri-apps/tauri-docs)
. Additionally reach out and follow along within Discord. Add a `@notify-*` role to stay apprised of news and questions from the team, or follow along and ask questions in the `#dev` or `#docs` channels under the `CONTRIBUTORS` section.

Prepared for some more responsibility? A Domain in the Working Group represents a specific area of interest.

*   **Development**: Developing and maintaining the Tauri software
*   **Community**: Looks after the broader community resources and the public presence of Tauri
*   **Governance & Guidance**: Involved with all things organizational in nature
*   **Operations**: Responsible for all the tooling and infrastructure Tauri needs to get work done

This gives clear entry points for a new member of the Working Group to jump into right away. It also allows us to continue growing our core competency of core Tauri development while giving additional focus to all areas which support the Tauri organization as a whole. Each of these domains will be represented by Domain Members and Domain Leads, but membership is not mutually exclusive.

All domains within Tauri are equally important to providing the best experience possible, as well as the wonderful support of the community. ❤️

* * *

With your help, we can continue to improve and catalyze the growth and sustainability of the organization. You can learn more in the [Governance and Guidance repo on GitHub](https://github.com/tauri-apps/governance-and-guidance)
.

[Announcing Tauri 1.7.0](https://tauri.app/blog/tauri-1-7/)

[Rust Security Advisory CVE-2024-24576](https://tauri.app/blog/cve-2024-24576/)

* * *

[Support on Open Collective](https://opencollective.com/tauri)
 [Sponsor on GitHub](https://github.com/sponsors/tauri-apps)

© 2026 Tauri Contributors. CC-BY / MIT

---

# Rust Security Advisory CVE-2024-24576 | Tauri

[Skip to content](https://tauri.app/blog/cve-2024-24576/#_top)

Rust Security Advisory CVE-2024-24576
=====================================

Apr 10, 2024

![Tillmann Weidinger](https://tauri.app/authors/tweidinger.png)

Tillmann Weidinger

Tauri Security

![Chip Reed](https://tauri.app/authors/chip.png)

Chip Reed

Tauri Security

The Rust Security Response WG announced [`CVE-2024-24576`](https://blog.rust-lang.org/2024/04/09/cve-2024-24576.html)
, which affects the Rust Standard Library on Windows.

> TL;DR: Upgrade your Rust version to `1.77.2`.

[How Does it Affect Tauri as a Library?](https://tauri.app/blog/cve-2024-24576/#how-does-it-affect-tauri-as-a-library)

-----------------------------------------------------------------------------------------------------------------------

[Section titled “How Does it Affect Tauri as a Library?”](https://tauri.app/blog/cve-2024-24576/#how-does-it-affect-tauri-as-a-library)

Some Tauri organization repositories use batch files (`cmd.exe` under the hood) for developer environment tooling such as build scripts. No reviewed repositories use batch files for runtime code.

We don’t see additional risks for the Tauri project based on this CVE.

Nevertheless, we will update our CI systems to use the latest Rust version.

[Is My Tauri App Affected?](https://tauri.app/blog/cve-2024-24576/#is-my-tauri-app-affected)

---------------------------------------------------------------------------------------------

[Section titled “Is My Tauri App Affected?”](https://tauri.app/blog/cve-2024-24576/#is-my-tauri-app-affected)

In general you are possibly affected if you fulfil **all** of the below criteria:

*   You ship your app on **Windows**
*   Your project enables the Tauri v1 [`shell`](https://tauri.app/v1/api/js/shell/)
     feature with `"execute": true` or the v2 [`shell-plugin`](https://github.com/tauri-apps/plugins-workspace/tree/v2/plugins/shell)
     with `allow-execute` permission
*   You allow arguments in the `scope` element of the `shell` feature
*   **You pass untrusted input to `cmd.exe` or `.bat`/`.cmd` files and improperly validate the scope** (🚩)

If any of these criteria are not fulfilled in your application you are likely **NOT** affected.

If you implement custom commands or logic written in your application that directly exposes the Rust `Command` with arguments provided at runtime, you may be affected. While not Tauri specific, this pattern could affect any Rust project.

[Conclusion](https://tauri.app/blog/cve-2024-24576/#conclusion)

----------------------------------------------------------------

[Section titled “Conclusion”](https://tauri.app/blog/cve-2024-24576/#conclusion)

Please upgrade your Rust version to `1.77.2` as soon as possible and distribute updates to your users.

This investigation and writeup was performed in cooperation with our partner [CrabNebula](https://crabnebula.dev/blog/cve-2024-24576/)
 ❤️.

* * *

[Read more about this security advisory here](https://flatt.tech/research/posts/batbadbut-you-cant-securely-execute-commands-on-windows/)
. This affects many programming languages, this specific CVE is just the one filed for Rust.

[Tauri Board Elections 2024](https://tauri.app/blog/tauri-board-elections-2024/)

[Announcing Tauri 1.6.0](https://tauri.app/blog/tauri-1-6/)

* * *

[Support on Open Collective](https://opencollective.com/tauri)
 [Sponsor on GitHub](https://github.com/sponsors/tauri-apps)

© 2026 Tauri Contributors. CC-BY / MIT

---

# Announcing Tauri 1.6.0 | Tauri

[Skip to content](https://tauri.app/blog/tauri-1-6/#_top)

Announcing Tauri 1.6.0
======================

Feb 19, 2024

![Lucas Nogueira](https://tauri.app/authors/lucasfernog.jpeg)

Lucas Nogueira

Tauri Co-Founder

The Tauri team is happy to announce the 1.6 release. This version includes several new features and important bug fixes such as improved code signing on macOS, updater enhancements and an event loop crash on all platforms.

[Upgrading](https://tauri.app/blog/tauri-1-6/#upgrading)

---------------------------------------------------------

[Section titled “Upgrading”](https://tauri.app/blog/tauri-1-6/#upgrading)

Make sure to update both NPM and Cargo dependencies to the 1.6.0 release. You can update the dependencies with:

*   [npm](https://tauri.app/blog/tauri-1-6/#tab-panel-626)
    
*   [yarn](https://tauri.app/blog/tauri-1-6/#tab-panel-627)
    
*   [pnpm](https://tauri.app/blog/tauri-1-6/#tab-panel-628)
    
*   [cargo](https://tauri.app/blog/tauri-1-6/#tab-panel-629)
    

    npm install @tauri-apps/cli@latest @tauri-apps/api@latest

    yarn upgrade @tauri-apps/cli @tauri-apps/api --latest

    pnpm update @tauri-apps/cli @tauri-apps/api --latest

    cargo update

[What’s in 1.6.0](https://tauri.app/blog/tauri-1-6/#whats-in-160)

------------------------------------------------------------------

[Section titled “What’s in 1.6.0”](https://tauri.app/blog/tauri-1-6/#whats-in-160)

### [Event loop crash](https://tauri.app/blog/tauri-1-6/#event-loop-crash)

[Section titled “Event loop crash”](https://tauri.app/blog/tauri-1-6/#event-loop-crash)

We finally got a good stack trace and got a fix for a long standing crash on all platforms. This crash was a challenge to fix since it only happened when the application is running for a long time, so we thank everyone that made sure the fix works.

### [Code signing improvements](https://tauri.app/blog/tauri-1-6/#code-signing-improvements)

[Section titled “Code signing improvements”](https://tauri.app/blog/tauri-1-6/#code-signing-improvements)

Tauri now detects nested dylib, app, xpc and frameworks inside your macOS app bundle and codesigns each of them. This ensures your app can use some external libraries and be codesigned and notarized.

### [Updater enhancement](https://tauri.app/blog/tauri-1-6/#updater-enhancement)

[Section titled “Updater enhancement”](https://tauri.app/blog/tauri-1-6/#updater-enhancement)

The auto updater now keeps the command line arguments on Windows.

### [Other changes](https://tauri.app/blog/tauri-1-6/#other-changes)

[Section titled “Other changes”](https://tauri.app/blog/tauri-1-6/#other-changes)

Check out the entire list of changes:

*   [tauri](https://github.com/tauri-apps/tauri/releases/tag/tauri-v1.6.0)
    
*   [tauri-cli](https://github.com/tauri-apps/tauri/releases/tag/tauri-cli-v1.5.10)
    
*   [tauri-bundler](https://github.com/tauri-apps/tauri/releases/tag/tauri-bundler-v1.5.0)
    

[Rust Security Advisory CVE-2024-24576](https://tauri.app/blog/cve-2024-24576/)

[Announcing the Tauri v2 Beta Release](https://tauri.app/blog/tauri-2-0-0-beta/)

* * *

[Support on Open Collective](https://opencollective.com/tauri)
 [Sponsor on GitHub](https://github.com/sponsors/tauri-apps)

© 2026 Tauri Contributors. CC-BY / MIT

---

# Unknown

HTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri © Copyright James Rose 2024 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html1/270 Prerequisites Before embarking on your journey through this book, it's essential to ensure that your development environment is properly configured. This section will walk you through the necessary prerequisites for both Windows and Linux systems, ensuring you have a solid foundation to build upon. Windows Setting up your environment on a Windows system requires a few key components: Node.js: Download and install the LTS version of Node.js. This will provide you with a stable and reliable runtime for your JavaScript code. Rust: Install Rust using rustup, the recommended tool for managing Rust versions and associated tools. Visual Studio Build Tools: Ensure you have the Visual Studio Build Tools installed, with the C++ build tools selected. This is crucial for compiling native modules. Linux For those using a Linux system, the setup involves a few different steps: Node.js: Similar to Windows, you'll need the LTS version of Node.js. Follow the installation instructions specific to your distribution. Rust: Use rustup to install Rust, providing you with the necessary tools to compile and manage Rust projects. Build-essential tools: Ensure you have the essential build tools installed, such as gcc , g++ , and make . These are typically available through your distribution's package manager. By following these instructions and ensuring all dependencies are correctly installed, you'll be well-prepared to dive into the content of this book and start building your projects with confidence. 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html2/270 Windows Prerequisites Microsoft C++ Build Tools Tauri uses Microsoft C++ Build Tools for development. As such it is required that you install it before you begin making your app. It can be done by going to https://visualstudio.microsoft.com/visual-cpp-build-tools/. Once on the page, click Download Build Tools To begin the download. Once the download is finished click on the executable. Ensure that the "Desktop Development with C++" option is checked and begin the installation. Git Step 1. Go to https://git-scm.com/download/win and download the 64-bit installer Step 2. Click on the installer to start the wizard. Step 3. Go through the wizard selecting all of the recommended options. Step 4. Restart your computer. Step 5. Verify that it is installed by running the following command Common Commands Cloning A Repository git --help git clone https://github.com/RoseBlume/book.git 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html3/270 Making And Pushing Commits While in your projects main directory run these commands NodeJS NodeJs is a required dependency if you plan to use a JavaScript frontend. In order to install it, you must go to https://nodejs.org and click the Download button. Once the installer is done downloading, click on it to open the installation wizard. Go through all of the wizards installation steps and use all of the recommended options. Rust Step 1. Go to https://www.rust-lang.org/tools/install Step 2. Download the 64 bit Rustup-Init.exe script Step 3. Click The Downloaded Executable It is recommend to use the default installation. If you wish to use newer, less stable rust features, you can change your default toolchain to nightly. It is important to note that you can always change your toolchain later by running the following command. git add . git commit -m "First Commit" git push rustup default stable # Change 'stable' to either 'nightly' or 'beta' 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html4/270 Linux Prerequisites System Packages Before you begin developing your app, it is essential to install the necessary dependencies for your chosen Linux distribution. Debian/Ubuntu For Debian and Ubuntu users, you can install the required packages by running the following commands: Please note that these packages are available starting from Debian Bookworm and Ubuntu Noble suite. Arch Linux Arch Linux users can install the necessary packages with the following commands: sudo apt update sudo apt install libwebkit2gtk-4.1-dev \\ build-essential \\ curl \\ wget \\ file \\ libxdo-dev \\ libssl-dev \\ libayatana-appindicator3-dev \\ librsvg2-dev 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html5/270 Fedora/RHEL For Fedora and RHEL users, use the following commands to install the required packages: Gentoo Gentoo users can install the necessary packages by running: openSUSE For openSUSE users, the required packages can be installed with: sudo pacman -Syu sudo pacman -S --needed \\ webkit2gtk-4.1 \\ base-devel \\ curl \\ wget \\ file \\ openssl \\ appmenu-gtk-module \\ libappindicator-gtk3 \\ librsvg sudo dnf check-update sudo dnf install webkit2gtk4.1-devel \\ openssl-devel \\ curl \\ wget \\ file \\ libappindicator-gtk3-devel \\ librsvg2-devel sudo dnf group install "C Development Tools and Libraries" sudo emerge --ask \\ net-libs/webkit-gtk:4.1 \\ dev-libs/libappindicator \\ net-misc/curl \\ net-misc/wget \\ sys-apps/file 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html6/270 Node.js Node.js can be installed in various ways on Linux. The preferred method is to use your distribution's default package manager. If this fails, you can use other methods. 1. Installation Via Your Distribution's Default Package Manager Debian, Ubuntu, and Raspbian For Debian-based distributions, use the following commands: Verify the installation: Arch Linux For Arch Linux, use: sudo zypper up sudo zypper in webkit2gtk3-devel \\ libopenssl-devel \\ curl \\ wget \\ file \\ libappindicator3-1 \\ librsvg-devel sudo zypper in -t pattern devel\_basis sudo apt update # Only one or both of these packages may be required sudo apt install npm sudo apt install nodejs npm -v # 10.8.2 node -v # v22.6.0 sudo pacman -Syu sudo pacman -S --needed \\ npm \\ nodejs 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html7/270 Fedora and RHEL For Fedora and RHEL, use: Installation Via A Node Package Manager Node.js has package managers for managing installations and updates. FNM (Fast Node Manager) To install FNM and Node.js, run: NVM (Node Version Manager) To install NVM and Node.js, run: sudo dnf check-update sudo dnf install \\ nodejs \\ npm # installs fnm (Fast Node Manager) curl -fsSL https://fnm.vercel.app/install | bash # activate fnm source ~/.bashrc # download and install Node.js fnm use --install-if-missing 20 # verifies the right Node.js version is in the environment node -v # should print \`v20.17.0\` # verifies the right npm version is in the environment npm -v # should print \`10.8.2\` 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html8/270 Installing with Snap To install Node.js using Snap, ensure you have Snapcraft installed, then run: This snap also provides nodejs , npm , npx , and yarn . Rust Rust is a low-level programming language that compiles quickly and efficiently. It provides control and simplifies dependency management. Installation The recommended installation method is to use the provided script: Use the default installation. To use newer, less stable Rust features, change your default toolchain: # installs nvm (Node Version Manager) curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.40.0/install.sh | bash # download and install Node.js (you may need to restart the terminal) nvm install 20 # verifies the right Node.js version is in the environment node -v # should output something similar to \`v20.17.0\` # verifies the right npm version is in the environment npm -v # should output something similar to \`10.8.2\` sudo snap install node --channel=22/stable --classic curl --proto '=https' --tlsv1.2 https://sh.rustup.rs -sSf | sh rustup default stable # Change 'stable' to either 'nightly' or 'beta' 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html9/270 Android 1. Download and install Android Studio from the Android Developer Website. 2. Set the JAVA\_HOME environment variable: 3. Open a project in Android Studio, click the settings icon, and select SDK Manager. Install the following: Android SDK Platform (API Level 24 and onwards) Android SDK Platform-Tools NDK (Side by side) Android SDK Build-Tools Android SDK Command-line Tools 4. Set the ANDROID\_HOME and NDK\_HOME environment variables: 5. Add the following targets with rustup : System Packages Before you begin developing your app it is imperative that you first install the proper dependencies for your chosen distro. export JAVA\_HOME=/opt/android-studio/jbr export ANDROID\_HOME="$HOME/Android/Sdk" export NDK\_HOME="$ANDROID\_HOME/ndk/$(ls -1 $ANDROID\_HOME/ndk)" rustup target add aarch64-linux-android armv7-linux-androideabi i686-linux-android x86\_64-linux-android 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html10/270 Debian/Ubuntu As Debian distros use a point release system it is only possible to install these packages using Debian Bookworm and onwards. It is a similar situation with Ubuntu where you must be using the Noble suite and onwards. Arch Linux Fedora/RHEL sudo apt update sudo apt install libwebkit2gtk-4.1-dev \\ build-essential \\ curl \\ wget \\ file \\ libxdo-dev \\ libssl-dev \\ libayatana-appindicator3-dev \\ librsvg2-dev sudo pacman -Syu sudo pacman -S --needed \\ webkit2gtk-4.1 \\ base-devel \\ curl \\ wget \\ file \\ openssl \\ appmenu-gtk-module \\ libappindicator-gtk3 \\ librsvg sudo dnf check-update sudo dnf install webkit2gtk4.1-devel \\ openssl-devel \\ curl \\ wget \\ file \\ libappindicator-gtk3-devel \\ librsvg2-devel sudo dnf group install "C Development Tools and Libraries" 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html11/270 Gentoo openSUSE Node.js Node.js can be installed in many different ways for linux. The prefered method is to use your Linux Distributions default package manager to install Nodejs and NPM. If this fails it is possible to install using 2 other methods. 1. Installation Via Your Distributions Default Package Manager Debian, Ubuntu and Raspbian Afterwards run these commands to ensure that both npm and nodejs are installed sudo emerge --ask \\ net-libs/webkit-gtk:4.1 \\ dev-libs/libappindicator \\ net-misc/curl \\ net-misc/wget \\ sys-apps/file sudo zypper up sudo zypper in webkit2gtk3-devel \\ libopenssl-devel \\ curl \\ wget \\ file \\ libappindicator3-1 \\ librsvg-devel sudo zypper in -t pattern devel\_basis sudo apt update # Only one or both of these packages may be required sudo apt install npm sudo apt install nodejs 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html12/270 Arch Linux Fedora And Red Hat Enterprise Linux Installation Via A Node Package Manager While not as simple Nodejs has package managers meant for managing installations and updates for nodejs FNM (Fast Node Manager) Running this script will install FNM as well. If for some reason you do not want to install FNM, please try using another method. npm -v # 10.8.2 node -v # v22.6.0 sudo pacman -Syu sudo pacman -S --needed \\ npm \\ nodejs sudo dnf check-update sudo dnf install \\ nodejs \\ npm # installs fnm (Fast Node Manager) curl -fsSL https://fnm.vercel.app/install | bash # activate fnm source ~/.bashrc # download and install Node.js fnm use --install-if-missing 20 # verifies the right Node.js version is in the environment node -v # should print \`v20.17.0\` # verifies the right npm version is in the environment npm -v # should print \`10.8.2\` 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html13/270 Installation with NVM (Node Version Manager) Running this script will install NVM as well. If for some reason you do not wish to install NVM, please try using another method. Installing with Snap (Requires installation of Snap) Installation using Snap is simple, however it is imperative that you have completed the prerequisites for installing Snapcraft prior to running these commands as it will fail otherwise. This snap also provides nodejs , npm , npx , and yarn . Rust Rust is a low-level programming language that aims to compile to the smallest binary possible, very quickly, and with very little overhead. It provides the user with a large amount of control and simplifies dependency management. Installation The recommended installation method is to use the provided script. It is recommend to use the default installation. If you wish to use newer, less stable rust features, you can change your default toolchain to nightly. It is important to note that you can # installs nvm (Node Version Manager) curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.40.0/install.sh | bash # download and install Node.js (you may need to restart the terminal) nvm install 20 # verifies the right Node.js version is in the environment node -v # should output something similar to \`v20.17.0\` # verifies the right npm version is in the environment npm -v # should output something similar to \`10.8.2\` sudo snap install node --channel=22/stable --classic curl --proto '=https' --tlsv1.2 https://sh.rustup.rs -sSf | sh 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html14/270 always change your toolchain later by running the following command. Android 1. Download and install Android Studio from the Android Developer Website https://developer.android.com/studio 2. Set the JAVA\_HOME Environment variable in the terminal. The location may be different depending on your method of installation. 3. Open a Project in your newly installed version of Android Studio and click the settings icon in the top right corner. Click on SDK Manager which should appear in the dropdown after the settings button has been clicked. Install the following. Android SDK Platform (API Level 24 and onwards) Android SDK Platform-Tools NDK (Side by side) Android SDK Build-Tools Android SDK Command-line Tools 4. Set the ANDROID\_HOME and NDK\_HOME environment variables. The locations may be different depending on your installation 5. Add the following targets with rustup rustup default stable # Change 'stable' to either 'nightly' or 'beta' export JAVA\_HOME=/opt/android-studio/jbr export ANDROID\_HOME="$HOME/Android/Sdk" export NDK\_HOME="$ANDROID\_HOME/ndk/$(ls -1 $ANDROID\_HOME/ndk)" rustup target add aarch64-linux-android armv7-linux-androideabi i686-linux-android x86\_64-linux-android 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html15/270 Getting Started 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html16/270 Project Structure Understanding the structure of your Tauri project is crucial for efficient development. Let's take a closer look at the various files and directories that make up a typical Tauri application. The package.json File The package.json file, located at the root of your project, contains essential information about your application, such as its name, version, and dependencies. It also includes scripts that can be executed using npm. C:. │ package.json │ ├───src │ index.html │ main.js │ styles.css │ └───src-tauri │ build.rs │ Cargo.toml │ tauri.conf.json │ └───src lib.rs main.rs { "name": "example", "private": true, "version": "0.1.0", "type": "module", "scripts": { "tauri": "tauri" }, "devDependencies": { "@tauri-apps/cli": ">=2.0.0-rc.0" } } 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html17/270 The src Directory This directory houses your frontend code, which is responsible for the user interface. It includes three main files: index.html , styles.css , and main.js . src/index.html The index.html file within the src directory contains the HTML structure of your application. Initially, it should look like this: src/styles.css The styles.css file contains the CSS rules that define the appearance of your application, including text alignment, image sizes, colors, and backgrounds. <!doctype html> <html lang="en"> <head> <meta charset="UTF-8" /> <link rel="stylesheet" href="styles.css" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>Tauri App</title> <script type="module" src="/main.js" defer></script> </head> <body> <h1>Welcome to Tauri!</h1> </body> </html> 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html18/270 src/main.js The main.js file adds interactivity to your application. For example, it can handle events such as button clicks. Initially, it should contain the following code: The src-tauri Directory This directory contains the backend code and configuration files for your Tauri application. It includes build.rs , Cargo.toml , and tauri.conf.json . src-tauri/build.rs The build.rs file is used to build the application. Most projects will use a file that looks like this: :root { font-family: Inter, Avenir, Helvetica, Arial, sans-serif; font-size: 16px; line-height: 24px; font-weight: 400; color: #0f0f0f; background-color: #f6f6f6; font-synthesis: none; text-rendering: optimizeLegibility; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; -webkit-text-size-adjust: 100%; } h1 { text-align: center; } const { invoke } = window.\_\_TAURI\_\_.core; fn main() { tauri\_build::build() } 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html19/270 src-tauri/Cargo.toml The Cargo.toml file contains information that controls how the code is compiled and what optimizations are used. src-tauri/tauri.conf.json The tauri.conf.json file controls various settings for your application, such as its title and the installers/bundles that will be produced with the build command. \[package\] name = "example" version = "0.1.0" description = "A Tauri App" authors = \["you"\] edition = "2021" \[lib\] name = "example\_lib" crate-type = \["lib", "cdylib", "staticlib"\] \[build-dependencies\] tauri-build = { version = "2", features = \[\] } \[dependencies\] tauri = { version = "2", features = \[\] } serde = { version = "1", features = \["derive"\] } serde\_json = "1" 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html20/270 The src-tauri/src Directory Within the src-tauri directory, there is a src subdirectory that contains two files: lib.rs and main.rs . src-tauri/src/lib.rs The lib.rs file serves as the mobile entry point for Android and iOS devices. It should look like this: { "productName": "example", "version": "0.1.0", "identifier": "com.example.app", "build": { "frontendDist": "../src" }, "app": { "withGlobalTauri": true, "windows": \[ { "title": "example", "label": "main", "maximized": true } \], "security": { "csp": null } }, "bundle": { "active": true, "targets": \["deb", "rpm", "nsis", "msi"\], "icon": \[ "icons/32x32.png", "icons/128x128.png", "icons/128x128@2x.png", "icons/icon.icns", "icons/icon.ico" \] } } 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html21/270 src-tauri/src/main.rs The main.rs file is the entry point for non-mobile users. It should look like this: Running Your Project Once all your files are set up, open the project's main directory in the terminal and run the following commands: #\[cfg\_attr(mobile, tauri::mobile\_entry\_point)\] pub fn run() { tauri::Builder::default() .run(tauri::generate\_context!()) .expect("error while running tauri application"); } #!\[cfg\_attr(not(debug\_assertions), windows\_subsystem = "windows")\] fn main() { example\_lib::run() } npm install # This installs the frontend dependencies npm run tauri dev # This opens the developer window, which reloads every time one of the project's files is modified and saved C:. │ package.json │ ├───src │ index.html │ main.js │ styles.css │ └───src-tauri │ build.rs │ Cargo.toml │ tauri.conf.json │ └───src lib.rs main.rs 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html22/270 package.json The package.json file in your projects root contains information such as your apps name, version and dependencies. It also holds scripts which can be run using npm. The src Directory This directory contains your frontend code. This is information that is displayed to the user. It contains 3 files, index.html , styles.css , and main.js respectively. src/index.html Within the src directory, the index.html file contains all of the images, and text that will be displayed. For now, it should look like this. { "name": "example", "private": true, "version": "0.1.0", "type": "module", "scripts": { "tauri": "tauri" }, "devDependencies": { "@tauri-apps/cli": ">=2.0.0-rc.0" } } <!doctype html> <html lang="en"> <head> <meta charset="UTF-8" /> <link rel="stylesheet" href="styles.css" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>Tauri App</title> <script type="module" src="/main.js" defer></script> </head> <body> <h1>Welcome to Tauri!</h1> </body> </html> 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html23/270 src/styles.css In the src directory the styles.css contains all of the info regarding text alignment, image sizes, colors, and backgrounds that will be displayed on the page. src/main.js The main.js file adds interactivity to the app. For example, if a button is clicked, the background will change color. For now all that is required is this. The src-tauri Directory This directory contains all of the backend code along with some app configuration files. Within it are the build.rs , tauri.conf.json , and Cargo.toml files. src-tauri/build.rs This is the code that is used to build the app. Most projects will use files that look like this. :root { font-family: Inter, Avenir, Helvetica, Arial, sans-serif; font-size: 16px; line-height: 24px; font-weight: 400; color: #0f0f0f; background-color: #f6f6f6; font-synthesis: none; text-rendering: optimizeLegibility; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; -webkit-text-size-adjust: 100%; } h1 { text-align: center; } const { invoke } = window.\_\_TAURI\_\_.core; 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html24/270 src-tauri/Cargo.toml This file contains information that controls how the code is compiled and what optimizations are used. src-tauri/tauri.conf.json This file controls information such as your apps title, and what installers/bundles will be produced with the build command. For now the file should look like this. fn main() { tauri\_build::build() } \[package\] name = "example" version = "0.1.0" description = "A Tauri App" authors = \["you"\] edition = "2021" # See more keys and their definitions at https://doc.rust- lang.org/cargo/reference/manifest.html \[lib\] name = "example\_lib" crate-type = \["lib", "cdylib", "staticlib"\] \[profile.release\] panic = "abort" # Strip expensive panic clean-up logic codegen-units = 1 # Compile crates one after another so the compiler can optimize better lto = true # Enables link to optimizations opt-level = "s" # Optimize for binary size \[build-dependencies\] tauri-build = { version = "2.0.0-rc", features = \[\] } \[dependencies\] tauri = { version = "2.0.0-rc", features = \[\] } serde = { version = "1", features = \["derive"\] } serde\_json = "1" 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html25/270 The src-tauri/src Directory Within the src-tauri directory there is a src subdirectory. Within this subdirectory are two files, lib.rs , and main.rs respectively. src-tauri/src/lib.rs This file is the mobile entry point that is used on Android and IOS devices. This file should look like this. { "productName": "example", "version": "0.1.0", "identifier": "com.example.app", "build": { "frontendDist": "../src" }, "app": { "withGlobalTauri": true, "windows": \[ { "title": "example", "label": "main", "maximized": true } \], "security": { "csp": null } }, "bundle": { "active": true, "targets": \["deb", "rpm", "nsis", "msi"\], "icon": \[ "icons/32x32.png", "icons/128x128.png", "icons/128x128@2x.png", "icons/icon.icns", "icons/icon.ico" \] } } 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html26/270 src-tauri/src/main.rs This file is the entrypoint for non mobile users. It should look like this. Once all of your files open the projects main directory in the terminal and run the following. #\[cfg\_attr(mobile, tauri::mobile\_entry\_point)\] pub fn run() { tauri::Builder::default() .run(tauri::generate\_context!()) .expect("error while running tauri application"); } #!\[cfg\_attr(not(debug\_assertions), windows\_subsystem = "windows")\] fn main() { example\_lib::run() } npm install # This installs the frontend dependencies npm run tauri dev # This opens the developer window which reloads everytime one of the projects files are modified and saved 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html27/270 Tauri Configuration In this section, we will explore the tauri.conf.json file, which is the main configuration file for Tauri applications. This file allows you to customize various aspects of your application, such as the window title, default window size, and the types of bundles produced during the build process. tauri.conf.json Below is an example of a tauri.conf.json file: Let's break down the key components of this configuration file: { "productName": "example", "version": "0.1.0", "identifier": "com.example.app", "build": { "frontendDist": "../src" }, "app": { "withGlobalTauri": true, "windows": \[ { "title": "example", "label": "main", "maximized": true } \], "security": { "csp": null } }, "bundle": { "active": true, "targets": \["deb", "rpm", "nsis", "msi"\], "icon": \[ "icons/32x32.png", "icons/128x128.png", "icons/128x128@2x.png", "icons/icon.icns", "icons/icon.ico" \] } } 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html28/270 Product Name and Version: The productName and version fields are used to name the bundles and installers. For example, the bundle might be named example\_0.1.0\_arm64.deb . Windows: The windows array contains a list of windows that can be displayed by your application. Each window has a title field that specifies the title displayed to the user. Targets: The targets field lists the types of bundles and installers that will be produced when you run npm run tauri build . In this example, the targets include deb , rpm , nsis , and msi . Icons: The icon field contains a list of image files that will be used as the application's icon. By configuring these fields, you can tailor your Tauri application to meet your specific needs and preferences. 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html29/270 Using Templates Commands Creating a new Tauri application is straightforward, and you can choose from several commands depending on your preferred environment. Let's explore the different options available: Shell Script For Unix-based systems, you can use the following shell script to create a new Tauri application. This method is quick and efficient, allowing you to get started in no time: PowerShell If you are a Windows user, the PowerShell command is the way to go. This command will set up your new Tauri application seamlessly: npm For those who prefer using npm, you can create a new Tauri app with the following command. This method integrates well with the npm ecosystem, making it a popular choice among developers: yarn Yarn users can also create a new Tauri application with ease. The following command leverages yarn's capabilities to set up your project efficiently: sh <(curl https://create.tauri.app/sh) irm https://create.tauri.app/ps | iex npm create tauri-app@latest 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html30/270 pnpm If you are a fan of pnpm, you can use the following command to create a new Tauri app. Pnpm is known for its speed and efficient package management: deno For developers who use deno, the following command will help you create a new Tauri application. Deno offers a secure runtime for JavaScript and TypeScript: bun If you prefer using bun, you can create a new Tauri app with the following command. Bun is a fast all-in-one JavaScript runtime: cargo Rust enthusiasts can use cargo to create a new Tauri application. The following commands will guide you through the process, leveraging Rust's powerful capabilities: Customization Options When you run the create-tauri-app command, you will be prompted to select various options to tailor your project to your specific needs. These customization options ensure that yarn create tauri-app pnpm create tauri-app deno run -A npm:create-tauri-app bun create tauri-app cargo install create-tauri-app --locked cargo create-tauri-app 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html31/270 your Tauri application is set up exactly the way you want it. Package Manager One of the first choices you will make is selecting your preferred package manager. You can choose from the following options: yarn npm bun Rust Templates When creating a Tauri application with Rust, you have several UI templates to choose from. Each template caters to different development preferences and styles, allowing you to select the one that best fits your needs: Vanilla: This minimal template provides a clean slate for your Rust-based Tauri application, with no additional frameworks included. Yew: A modern Rust framework for building multi-threaded front-end web apps with WebAssembly. Yew is known for its performance and ease of use. Leptos: A full-stack framework for building fast, interactive web applications with Rust. Leptos offers a comprehensive solution for web development. Sycamore: A reactive framework for creating web applications in Rust, inspired by React. Sycamore focuses on simplicity and reactivity. TypeScript / JavaScript Templates For developers using TypeScript or JavaScript, Tauri offers a variety of UI templates to match your preferred framework. These templates provide a solid starting point for your project: Vanilla: A basic template without any additional frameworks, ideal for those who prefer to start from scratch. Vue: A progressive framework for building user interfaces, known for its simplicity and flexibility. Vue is a popular choice for modern web development. Svelte: A compiler that generates minimal and highly efficient JavaScript code, offering a unique approach to building web applications. Svelte is known for its performance and developer experience. 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html32/270 React: A popular library for building user interfaces, particularly single-page applications, with a component-based architecture. React is widely used in the industry. Solid: A declarative JavaScript library for creating user interfaces, focusing on fine-grained reactivity. Solid offers a modern approach to UI development. Angular: A platform and framework for building single-page client applications using HTML and TypeScript. Angular provides a comprehensive solution for large-scale applications. Preact: A fast 3kB alternative to React with the same modern API, providing a lightweight solution for building web applications. Preact is ideal for performance-critical applications. You can also choose the flavor of your project, either TypeScript or JavaScript, depending on your preference and project requirements. .NET Templates For developers working with .NET, Tauri provides a template for building web applications using Blazor. Blazor allows you to leverage the power of .NET for your Tauri application: Blazor: A framework for building interactive web UIs using C# instead of JavaScript. Blazor enables you to create rich web applications with the familiarity of .NET. More information can be found at Blazor. By selecting the appropriate template and flavor, you can tailor your Tauri project to your specific development needs and preferences. This flexibility ensures that you can build your application with the tools and frameworks you are most comfortable with, leading to a more efficient and enjoyable development experience. Once you have generated your template, in order to open your dev window, you must first enter your projects root, and run the proper command for you prefered package manager. For Example: pnpm run tauri dev 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html33/270 Learning To Code HTML 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html34/270 Elements HTML (Hypertext Markup Language) is the standard markup language for creating web pages. It consists of various elements that define the structure and content of a web page. Commonly Used HTML Elements Headings <h1> to <h6> : These tags define headings of different levels, with <h1> being the highest level and <h6> being the lowest. Headings are important for SEO and accessibility as they help to structure the content and make it easier to navigate. Text Content <p> : This tag defines a paragraph of text. Paragraphs are block-level elements, meaning they start on a new line and take up the full width available. <a> : The anchor tag is used to create hyperlinks, which are clickable links that navigate to other web pages or resources. The href attribute specifies the URL of the linked resource. <span> : This is an inline container element used to apply styles or manipulate text within a larger block of content. Unlike <div> , it does not start on a new line. Images and Media <img> : This tag is used to embed images in a web page. It is a self-closing tag and requires the src attribute to specify the path to the image file, and the alt attribute to provide alternative text for accessibility. Lists <ul> : Unordered list, which displays a list of items with bullet points. <ol> : Ordered list, which displays a list of items with numbers. <li> : List item, used within <ul> or <ol> to define individual list items. 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html35/270 Containers <div> : A generic block-level container element used to group other elements. It is often used with CSS to apply styles or JavaScript to manipulate sections of the page. Tables <table> : This tag is used to create a table to display tabular data. It contains <tr> for table rows, <th> for table headers, and <td> for table data cells. Forms <form> : This tag is used to create interactive forms for user input. It can contain various input elements like <input> , <textarea> , <button> , <select> , and <label> . The action attribute specifies where to send the form data when submitted, and the method attribute specifies the HTTP method to use (GET or POST). Best Practices Always close HTML elements properly by using the closing tag ( </tagname> ), unless the element is self-closing (e.g., <img> ). Use semantic HTML elements to improve the accessibility and SEO of your web pages. Validate your HTML code to ensure it follows the standards and is free of errors. 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html36/270 Attributes Attributes in HTML provide additional information about an element. They are used to modify the behavior or appearance of an HTML element. Here are a few examples of commonly used attributes in HTML: Common HTML Attributes HTML attributes provide additional information about elements and are essential for modifying their behavior and appearance. Understanding how to use these attributes effectively can greatly enhance the functionality and accessibility of your web pages. Let's explore some of the most commonly used attributes in HTML: Class Attribute The class attribute is used to specify one or more class names for an element. This attribute is particularly useful for applying the same styles to multiple elements. For example: In this example, the div element has two classes: container and main-content . These classes can be targeted with CSS to apply specific styles. ID Attribute The id attribute is used to uniquely identify an element. This is useful for targeting specific elements with CSS or JavaScript. For instance: Here, the h1 element has an id of header-title , which can be used to apply unique styles or manipulate the element with JavaScript. <div class="container main-content"></div> <h1 id="header-title">Welcome to My Website</h1> 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html37/270 Src Attribute The src attribute specifies the source URL of an external resource, such as an image or a script. For example: In this case, the src attribute points to the path of the image file. Href Attribute The href attribute defines the destination URL of a hyperlink, commonly used in <a> tags. For example: Here, the href attribute specifies the URL that the link will navigate to when clicked. Alt Attribute The alt attribute provides alternative text for an image, which is displayed if the image fails to load or for accessibility purposes. For example: The alt attribute offers a textual description of the image, which is beneficial for screen readers and when the image cannot be displayed. These examples illustrate just a few of the many attributes available in HTML. Each element has its own set of attributes that can be used to customize its behavior and appearance. Other commonly used attributes include title , style , data-\* , disabled , readonly , and placeholder . For a comprehensive list of attributes and their usage, always refer to the official HTML documentation. Proper use of attributes can significantly improve the functionality and accessibility of your web pages. <img src="image.jpg" alt="A beautiful scenery"> <a href="https://www.example.com">Visit Example</a> <img src="image.jpg" alt="A beautiful scenery"> 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html38/270 Comments Comments in HTML are an essential tool for developers, allowing them to add explanatory notes or reminders within the code that are not displayed on the webpage. These comments are invaluable for documenting your code, providing context, or temporarily disabling certain sections without deleting them. To add a comment in HTML, you use the <!-- --> syntax. Anything placed between these opening and closing comment tags will be ignored by the browser when rendering the webpage. For example: In this example, the comment This is a comment will not be displayed on the webpage, but the paragraph element <p>This is a paragraph.</p> will be rendered. Comments can also span multiple lines: In this case, the entire block of text between the opening <!-- and closing --> tags will be treated as a comment. Best Practices for Using Comments 1. Clarity and Relevance: Ensure that comments are clear and relevant. They should explain the purpose of the code, especially if it is complex or not immediately understandable. 2. Avoid Over-Commenting: Do not overuse comments. Code should be self-explanatory where possible. Use comments to explain the "why" rather than the "what". 3. Update Comments: Keep comments up-to-date with code changes. Outdated comments can be misleading and confusing. 4. Sensitive Information: Avoid placing sensitive information in comments, as they can be viewed in the source code by anyone with access. <!-- This is a comment --> <p>This is a paragraph.</p> <!-- This is a multi-line comment. --> <p>This is another paragraph.</p> 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html39/270 Use Cases for Comments Documentation: Provide explanations for complex logic or algorithms. Debugging: Temporarily disable code by commenting it out. Collaboration: Leave notes for other developers working on the same project. Version Control: Mark sections of code that are under development or need review. Example of Commenting Out Code Sometimes, you might want to disable a section of code without deleting it. This can be useful for testing or debugging purposes: In this example, the first paragraph is commented out and will not be rendered by the browser, while the second paragraph will be displayed. Conclusion Comments are a powerful tool for making your HTML code more understandable and maintainable. By following best practices and using comments judiciously, you can improve the readability and quality of your code, making it easier for yourself and others to work with. Remember that comments are not visible to users visiting your webpage, but they can be invaluable for developers who are reading or maintaining your code. <!-- <p>This paragraph is temporarily disabled.</p> --> <p>This paragraph is active.</p> 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html40/270 Head The <head> element is a crucial part of an HTML document. It contains metadata and other non-visible information about the document. In this chapter, we will explore some commonly used elements that can be nested within the <head> element. Title Element The <title> element specifies the title of the document, which is displayed in the browser's title bar or tab. Example: Explanation: This sets the title of the webpage to "My Website". Meta Element The <meta> element is used to provide metadata about the HTML document, such as character encoding, viewport settings, and keywords. Example: <title>My Website</title> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="description" content="A brief description of the webpage"> <meta name="keywords" content="HTML, CSS, JavaScript"> <meta name="author" content="John Doe"> 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html41/270 Explanation: The first <meta> element sets the character encoding to UTF-8, ensuring proper rendering of special characters. The second <meta> element sets the viewport to the device's width and initial scale, making the webpage responsive on different devices. The third <meta> element provides a brief description of the webpage, which can be used by search engines. The fourth <meta> element specifies keywords related to the content of the webpage, aiding in search engine optimization (SEO). The fifth <meta> element specifies the author of the document. Link Element The <link> element is used to link external stylesheets, icon files, or other external resources to the HTML document. Example: Explanation: The first <link> element links an external CSS file called "styles.css" to the HTML document, allowing you to style the webpage. The second <link> element links a favicon file (an icon displayed in the browser's tab) called "favicon.ico" to the HTML document. The third <link> element preconnects to the Google Fonts API, which can improve loading performance. The fourth <link> element links a specific Google Font (Roboto) to the HTML document, allowing you to use this font in your styles. <link rel="stylesheet" href="styles.css"> <link rel="icon" href="favicon.ico"> <link rel="preconnect" href="https://fonts.googleapis.com"> <link rel="stylesheet" href="https://fonts.googleapis.com/css2? family=Roboto:wght@400;700&display=swap"> 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html42/270 Base Element The <base> element specifies the base URL for all relative URLs within the document. Example: Explanation: This sets the base URL for all relative URLs in the document to "https://example.com/". So, if you have an anchor tag with a relative URL like <a href="/about">About</a> , it will resolve to "https://example.com/about". Style Element The <style> element allows you to include internal CSS styles directly within the HTML document. Example: Explanation: This <style> element includes internal CSS that sets the font family to Roboto and the background color of the body to a light gray. <base href="https://example.com/"> <style> body { font-family: 'Roboto', sans-serif; background-color: #f0f0f0; } </style> 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html43/270 Script Element The <script> element allows you to include or reference JavaScript code within the HTML document. Example: Explanation: This <script> element references an external JavaScript file called "scripts.js" and uses the defer attribute to ensure the script is executed after the HTML document has been fully parsed. These are just a few examples of elements that can be nested within the <head> element. Remember to close the <head> element with </head> after including all necessary elements. <script src="scripts.js" defer></script> 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html44/270 Headings In HTML, headings are defined with the <h1> to <h6> tags. Each heading tag represents a different level of importance, with <h1> being the most important and <h6> being the least important. Headings help to structure the content on a webpage, making it easier for users and search engines to understand the hierarchy and organization of the information. Heading Levels <h1> : This is the main heading of the page, typically used for the title or the most important heading. <h2> : This is used for subheadings under <h1> , representing the second level of importance. <h3> : This is used for subheadings under <h2> , representing the third level of importance. <h4> : This is used for subheadings under <h3> , representing the fourth level of importance. <h5> : This is used for subheadings under <h4> , representing the fifth level of importance. <h6> : This is used for subheadings under <h5> , representing the sixth level of importance. Code Example Here is an example of how to use the different heading tags in HTML: <!DOCTYPE html> <html> <head> <title>HTML Headings Example</title> </head> <body> <h1>This is an h1 heading</h1> <h2>This is an h2 heading</h2> <h3>This is an h3 heading</h3> <h4>This is an h4 heading</h4> <h5>This is an h5 heading</h5> <h6>This is an h6 heading</h6> </body> </html> 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html45/270 Result The above code will render the following headings on a webpage: This is an h1 heading This is an h2 heading This is an h3 heading This is an h4 heading This is an h5 heading This is an h6 heading Importance of Headings Using headings correctly is important for several reasons: 1. Accessibility: Screen readers use headings to help users navigate the content. 2. SEO: Search engines use headings to understand the structure and relevance of the content. 3. Readability: Headings break up the text, making it easier for users to scan and find the information they need. By using headings appropriately, you can create a well-structured and accessible webpage that is easy to navigate and understand. 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html46/270 Paragraphs In HTML, the <p> tag is fundamental for defining paragraphs. As a block-level element, it naturally begins on a new line and spans the full width of its container. This behavior ensures that paragraphs are visually distinct, with most browsers adding default margins before and after the text to enhance readability. Code Example Consider the following example, which demonstrates the use of the <p> tag within an HTML document: Detailed Explanation The <!DOCTYPE html> declaration specifies the HTML version and ensures proper rendering. The <html> tag serves as the root element of the document. Within the <head> section, meta-information such as the document's title is defined. The <body> section contains the visible content, including headings and paragraphs. The <h1> tag denotes a primary heading. Each <p> tag encapsulates a paragraph, ensuring that text is neatly organized and separated. <!DOCTYPE html> <html> <head> <title>Paragraph Example</title> </head> <body> <h1>This is a heading</h1> <p>This is a paragraph.</p> <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p> </body> </html> 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html47/270 Rendering in Browsers When viewed in a browser, the content within <p> tags appears as distinct paragraphs, each separated by space. This spacing is governed by the browser's default stylesheet but can be tailored using CSS. 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html48/270 Text Formatting To format text in HTML, you can use various elements. Here are some commonly used ones, along with their semantic meanings and usage examples: Emphasis and Italics Emphasis (<em>) The <em> element is used to emphasize text, which typically renders as italicized text. This element should be used to stress the importance of a word or phrase within a sentence. For example: Italic (<i>) The <i> element is used to indicate text that is in an alternate voice or mood, such as a technical term, a phrase from another language, or a thought. It also renders as italicized text. For example: Text Size and Highlighting Small Text (<small>) The <small> element is used to render text in a smaller font size, often for fine print or disclaimers. For example: <p>This is <em>emphasized</em> text.</p> <p>This is <i>italicized</i> text.</p> <p>This is <small>smaller</small> text.</p> 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html49/270 Highlighted Text (<mark>) The <mark> element is used to highlight or mark a specific portion of text, typically rendering with a yellow background. This is useful for drawing attention to important information. For example: Deletions and Insertions Deleted Text (<del>) The <del> element is used to indicate deleted or removed text, which typically renders with a strikethrough effect. This can be useful for showing edits or changes in a document. For example: Inserted Text (<ins>) The <ins> element is used to indicate inserted or added text, which typically renders with an underline effect. This can be useful for showing additions in a document. For example: Importance and Subscripts Strong Importance (<strong>) The <strong> element is used to indicate strong importance or seriousness, typically rendering as bold text. This element should be used to highlight critical information. For example: <p>This is <mark>highlighted</mark> text.</p> <p>This is <del>deleted</del> text.</p> <p>This is <ins>inserted</ins> text.</p> <p>This is <strong>strong</strong> text.</p> 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html50/270 Subscript (<sub>) The <sub> element is used to render text as subscript, which is positioned below the normal text line. This is often used in chemical formulas or mathematical expressions. For example: Superscript (<sup>) The <sup> element is used to render text as superscript, which is positioned above the normal text line. This is often used for footnotes, exponents, or ordinal indicators. For example: Remember to always use these elements semantically, based on their intended meaning, rather than just for visual styling. Proper use of these elements ensures that your HTML is accessible and meaningful to all users, including those using assistive technologies. <p>This is <sub>subscript</sub> text.</p> <p>This is <sup>superscript</sup> text.</p> 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html51/270 Links Links in HTML are created using the <a> tag, which stands for "anchor." This tag is essential for creating hyperlinks that connect different web pages or resources. To specify the destination of the link, the href attribute is used. For instance, if you want to create a link to the Google homepage, you would write: The target attribute is another important aspect of links. It controls where the linked document will open. Most browsers support the \_blank and \_self targets. The \_blank target opens the link in a new tab, providing a way for users to keep the current page open while exploring the new one. On the other hand, the \_self target opens the link in the same tab, replacing the current page. There are two main types of links in HTML: absolute links and relative links. Understanding the difference between these two is crucial for effective web development. Absolute Links An absolute link contains the full URL, including the protocol (e.g., http , https ). This type of link is used to link to external websites. Absolute links are straightforward and always point to the same location, regardless of where they are used. Example: Relative Links A relative link, in contrast, does not contain the full URL. Instead, it provides a path relative to the current page's location. This type of link is particularly useful for linking to other pages within the same website. Relative links make it easier to manage internal links, especially when moving files around within the site structure. Example: <a href="https://google.com">Google's Homepage</a> <a href="https://google.com">This is an absolute link</a> <a href="otherpages/otherpage.html">This is a relative link</a> 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html52/270 Target Attribute The target attribute specifies where to open the linked document. The most common values are \_blank and \_self . \_blank : Opens the link in a new tab. \_self : Opens the link in the same tab. Examples: By mastering these concepts, you can create and manage links in your HTML documents effectively. Whether you are linking to external resources or navigating within your own site, understanding how to use absolute and relative links, as well as the target attribute, will enhance your web development skills. <a href="https://google.com" target="\_blank">This page opens in another tab</a> <a href="https://google.com" target="\_self">This page opens in the current tab</a> 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html53/270 Iframes Iframes in HTML are a powerful tool that allows you to embed another web page within your current page. This feature is particularly useful when you want to display content from an external source, such as a video, map, or social media feed, directly on your website. Basic Usage To add an iframe to your web page, you use the <iframe> tag and specify the source URL using the src attribute. Here is a simple example: This code will embed the web page located at https://www.example.com into your current page. Customizing Appearance and Behavior You can customize the appearance and behavior of the iframe using various attributes: Width and Height: You can set the dimensions of the iframe using the width and height attributes. For example: Border: The frameborder attribute controls the presence of a border around the iframe. Setting it to 0 removes the border, while 1 adds it: Scrolling: The scrolling attribute specifies whether the iframe should have scrollbars. You can set it to yes , no , or auto : <iframe src="https://www.example.com"></iframe> <iframe src="https://www.example.com" width="500" height="300"></iframe> <iframe src="https://www.example.com" frameborder="0"></iframe> <iframe src="https://www.example.com" scrolling="no"></iframe> 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html54/270 Fullscreen: The allowfullscreen attribute allows the iframe to be viewed in fullscreen mode: Security Considerations When embedding content from another source, it is crucial to ensure that the source URL is secure and trustworthy. This helps prevent security risks such as man-in-the-middle attacks. Using HTTPS is highly recommended for this purpose. Advanced Features Sandboxing: The sandbox attribute adds an extra layer of security by restricting the actions that the embedded content can perform. For example, you can disallow scripts or forms by specifying the appropriate restrictions: Cross-Origin Resource Sharing (CORS): If the embedded content needs to interact with your page, ensure that the server hosting the iframe content has the proper CORS headers set. Responsive Iframes: To make iframes responsive, you can use CSS to adjust their size based on the viewport. For instance, the following CSS makes an iframe responsive: And you can apply this class to your iframe like so: <iframe src="https://www.example.com" allowfullscreen></iframe> <iframe src="https://www.example.com" sandbox="allow-scripts"></iframe> .responsive-iframe { width: 100%; height: auto; aspect-ratio: 16 / 9; } <iframe src="https://www.example.com" class="responsive-iframe"></iframe> 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html55/270 By understanding and utilizing these features, you can effectively embed and manage iframes within your web pages, enhancing the user experience by seamlessly integrating external content. 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html56/270 Images Images in HTML are embedded using the <img> tag. Unlike most other elements, the <img> tag is self-closing, meaning it does not have a closing tag. This is because it does not contain any content within it, only attributes that define the image source and other properties. Attributes of the <img> Tag The <img> tag comes with several attributes that you can use to specify the image source and other properties: src : This attribute specifies the path to the image you want to display. It can be an absolute URL (link to an online image) or a relative URL (link to an image within your project directory). alt : This attribute provides alternative text for the image if it cannot be displayed. It is important for accessibility and SEO. width and height : These attributes define the dimensions of the image. Examples Relative Link A relative link points to an image located within the same directory or a subdirectory of the HTML file. This is useful for images that are part of your project. Absolute Link An absolute link points to an image hosted on an external server. This is useful for images that are not part of your project. <h1>This is a relative link to an image located within the same directory as the HTML file.</h1> <img src="America.jpg" alt="Image of America" width="500" height="300" /> 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html57/270 Best Practices When using images in your HTML documents, consider the following best practices: Always include the alt attribute: This improves accessibility for users who rely on screen readers and also benefits your site's SEO. Use relative links for project images: This ensures that images are included when the project is moved or shared. Use absolute links for external images: This can help reduce the size of your project by not including large image files. Specify the width and height attributes: This controls the display size of the image and can improve page load times by allowing the browser to allocate space for the image before it loads. By following these guidelines, you can effectively use images in your HTML documents to enhance the visual appeal and user experience of your web pages. <h1>This is an absolute link to an online image</h1> <img src="https://cdn.britannica.com/68/7068-004-7848FEB4/Flag-Canada.jpg" alt="Flag of Canada" width="500" height="300" /> 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html58/270 Tables In this section, we will explore the use of tables in HTML, which are essential for displaying data in a structured format of rows and columns. Understanding how to create and style tables will enable you to present information clearly and effectively on your web pages. Table Elements Tables in HTML are composed of several key elements, each serving a specific purpose: The <table> tag represents the table element and contains all other table elements. The <th> tag represents the table header element. It is used to define the header cells in the table, which are typically displayed in bold and centered. The <tr> tag represents the table row element. It is used to define a row in the table and typically contains the table header ( <th> ) and table data ( <td> ) elements. The <td> tag represents the table data element. It is used to define a cell in the table that contains data. Table Borders By default, HTML tables do not have borders. To add borders to your table, you can use CSS. For example, you can add a border to the table, table rows, and table cells using the border property in CSS. Example: Creating a Simple Table Let's create a simple HTML table to display student names and their scores. Here is the HTML code: 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html59/270 Adding Borders with CSS To enhance the appearance of our table, we can add borders using CSS. Here is the CSS code to achieve this: This CSS will add a 1-pixel solid black border around the table, table headers, and table data cells. The border-collapse: collapse; property ensures that the borders are collapsed into a single border, making the table look cleaner. The padding property adds space inside each cell, and the text-align property aligns the text to the left. Summary Tables are a powerful way to display data in a structured format. By understanding the basic table elements and how to style them with CSS, you can create clean and organized tables for your web pages. This knowledge will help you present information in a clear and professional manner, enhancing the overall user experience. <table> <tr> <th>Student</th> <th>Score</th> </tr> <tr> <td>Maria</td> <td>8</td> </tr> <tr> <td>Jeff</td> <td>4</td> </tr> <tr> <td>Kaden</td> <td>10</td> </tr> </table> table, th, td { border: 1px solid black; border-collapse: collapse; } th, td { padding: 10px; text-align: left; } 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html60/270 Lists Ordered Lists Ordered lists are a great way to present items in a specific sequence. They use the <ol> element, and each item within the list is wrapped in an <li> element. By default, the items are numbered starting from 1, making it perfect for instructions, rankings, or any scenario where the order matters. Here's an example of an ordered list in HTML: If you need to start the numbering from a different value, you can use the start attribute: Unordered Lists Unordered lists are used when the order of items is not important. They use the <ul> element, and each item is also wrapped in an <li> element. Instead of numbers, each item is typically prefixed with a bullet point. Here's an example of an unordered list in HTML: <h2>This is an ordered list</h2> <ol> <li>This is number 1</li> <li>This is number 2</li> <li>This is number 3</li> </ol> <h2>This is an ordered list starting from 5</h2> <ol start="5"> <li>This is number 5</li> <li>This is number 6</li> <li>This is number 7</li> </ol> <h2>This is an unordered list</h2> <ul> <li>This is item 1</li> <li>This is item 2</li> <li>This is item 3</li> </ul> 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html61/270 You can customize the bullet points using CSS to change their appearance: Description Lists Description lists are ideal for defining terms and their descriptions. They use the <dl> element, with each term wrapped in a <dt> element and each description in a <dd> element. This format is particularly useful for glossaries, definitions, or metadata. Here's an example of a description list in HTML: You can also group multiple descriptions under a single term: <h2>This is a customized unordered list</h2> <ul style="list-style-type: square;"> <li>This is item 1</li> <li>This is item 2</li> <li>This is item 3</li> </ul> <h2>This is a description list</h2> <dl> <dt>Espresso</dt> <dd>- black hot drink</dd> <dt>Milk</dt> <dd>- white cold drink</dd> </dl> <h2>This is a grouped description list</h2> <dl> <dt>Coffee</dt> <dd>- black hot drink</dd> <dd>- can be served with milk</dd> <dt>Tea</dt> <dd>- hot drink</dd> <dd>- can be served with lemon</dd> </dl> 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html62/270 Identifiers Classes and IDs are important concepts in HTML for styling and targeting elements. In HTML, you can assign a class or an ID to an element using the class and id attributes, respectively. Classes Classes in HTML are used to group multiple elements together, allowing you to apply the same styles to all of them. This is particularly useful when you want to maintain a consistent look and feel across different parts of your web page. To assign a class to an element, you use the class attribute followed by the class name. For example: One of the key characteristics of classes is that they are not unique. This means you can use the same class on multiple elements, which is beneficial for applying the same styles to a group of elements. Consider the following example: In CSS, you can target elements with a specific class using the dot notation. This allows you to define styles that will be applied to all elements with that class. For example: Additionally, you can assign multiple classes to a single element by separating the class names with a space. This enables you to combine different styles. For example: In CSS, you can target elements with multiple classes by chaining the class selectors together. For example: <div class="my-class">This is a div with a class</div> <p class="my-class">This is a paragraph with a class</p> <span class="my-class">This is a span with the same class</span> .my-class { color: red; } <div class="class1 class2">This div has two classes</div> 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html63/270 IDs IDs in HTML are used to uniquely identify a specific element on a page. This uniqueness is crucial when you need to target a particular element precisely. To assign an ID to an element, you use the id attribute followed by the ID name. For example: Unlike classes, IDs must be unique within a page, meaning no two elements should share the same ID. This uniqueness allows you to target a specific element with precision. In CSS, you can target elements with a specific ID using the hash notation. For example: IDs are also commonly used in JavaScript to manipulate specific elements. For instance, you can use document.getElementById('my-id') to select an element with a particular ID. Best Practices When working with classes and IDs, it's important to follow some best practices to ensure your code is clean and maintainable: Use classes for styling multiple elements and IDs for unique elements. Avoid using IDs for styling when classes can achieve the same result. Ensure IDs are unique within a page to avoid conflicts. Use meaningful names for classes and IDs to make your code more readable. By using classes and IDs effectively in HTML, you can apply styles and manipulate specific elements, making your web pages more dynamic and visually appealing. .class1.class2 { background-color: yellow; } <p id="my-id">This is a paragraph with an ID</p> #my-id { font-size: 20px; } 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html64/270 Symbols In the world of HTML, symbols hold a special place. These symbols, known as entities, are characters that have reserved meanings within the HTML language. They are represented using entity references, which always start with an ampersand ( & ) and end with a semicolon ( ; ). These entities are essential for displaying characters that might otherwise be interpreted as HTML code. Let's explore some of the most commonly used entities in HTML: &lt; stands for the less-than symbol ( < ). &gt; stands for the greater-than symbol ( > ). &amp; stands for the ampersand symbol ( & ). &quot; stands for the double quotation mark ( " ). &apos; stands for the single quotation mark ( ' ). These entities are incredibly useful when you need to display special characters in your HTML documents without them being mistaken for actual HTML code. This is particularly handy when you want to include HTML code examples within your web pages. For instance, if you want to display the less-than symbol ( < ) in your HTML, you can use the entity reference &lt; like this: &lt;p&gt;This is a paragraph.&lt;/p&gt; . This will render as <p>This is a paragraph.</p> in the browser, allowing you to show the HTML tags without them being processed. Beyond these basic entities, HTML supports a vast array of other entities for various symbols, including mathematical operators, currency symbols, and accented characters. Here are a few examples: &copy; stands for the copyright symbol ( © ). &euro; stands for the euro currency symbol ( € ). &trade; stands for the trademark symbol ( ™ ). &alpha; stands for the Greek letter alpha ( α ). &beta; stands for the Greek letter beta ( β ). Using these entities ensures that your content is displayed correctly across different browsers and platforms. It also helps prevent issues with character encoding, as these entities are universally recognized. A crucial point to remember is to always end entity references with a semicolon ( ; ). This ensures proper rendering in all browsers. Omitting the semicolon can lead to unexpected results, as the browser may not correctly interpret the entity. 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html65/270 In summary, HTML entities are a powerful tool for including special characters in your web pages. By using entity references, you can ensure that your content is displayed as intended, without being misinterpreted as HTML code. 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html66/270 Favicons Favicons are those tiny yet significant icons displayed in the browser tab or bookmark bar, representing a website. They play a crucial role in helping users quickly identify and differentiate between various websites. Despite their small size, favicons contribute to the overall branding and user experience of a website. To incorporate a favicon into your website, follow these detailed steps: 1. Create a Favicon Image: Begin by designing a square image that embodies your website's brand or logo. The most common sizes are 16x16 pixels and 32x32 pixels, but you can also create larger versions for high-resolution displays. Save this image in a widely-used format such as PNG, ICO, or SVG. Tools like Adobe Photoshop, GIMP, or online favicon generators can help you create and optimize your favicon. 2. Place the Favicon Image in the Root Directory: Upload your favicon image to your website's root directory, which is usually the same directory where your index.html file resides. This ensures that the browser can easily locate the favicon when loading your website. 3. Add the Favicon Link Tag to Your HTML: Open your HTML file and find the <head> section. Insert the following line of code between the <head> and </head> tags: Ensure you replace favicon.ico with the actual filename of your favicon image. If you have multiple favicon sizes or formats, you can include additional link tags to specify each one: 4. Test the Favicon: Save your HTML file and open it in a web browser. Your favicon should now be visible in the browser tab or bookmark bar. If it doesn't appear, clear your browser cache and refresh the page. You can also use online tools to check if your favicon is correctly implemented. 5. Consider Adding a Favicon for Different Platforms: Modern websites often include favicons for various platforms, such as iOS, Android, and Windows. These platforms may require different sizes and formats. You can use a tool like RealFaviconGenerator to <link rel="icon" href="favicon.ico" type="image/x-icon"> <link rel="icon" href="favicon-32x32.png" sizes="32x32" type="image/png"> <link rel="icon" href="favicon-16x16.png" sizes="16x16" type="image/png"> 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html67/270 create a comprehensive set of favicons and the corresponding HTML code to include in your website. By following these steps, you have successfully added a favicon to your website. This small addition can significantly enhance the overall user experience by providing a visual cue that helps users recognize your site more easily. Additionally, a well-designed favicon can reinforce your brand identity and make your website stand out among others in bookmarks and browser tabs. 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html68/270 Audio The <audio> element is used to embed sound content in documents. It provides a standard way to embed audio files with various controls and attributes to enhance the user experience. Attributes controls : This attribute adds audio controls, such as play, pause, and volume, to the audio player. autoplay : When present, the audio will automatically start playing as soon as it is ready. loop : This attribute causes the audio to start over again, every time it is finished. muted : This attribute mutes the audio by default. preload : This attribute specifies if and how the author thinks the audio should be loaded when the page loads. It can have the following values: none : The audio should not be loaded when the page loads. metadata : Only metadata should be loaded when the page loads. auto : The audio should be loaded entirely when the page loads. The <source> element The <source> element is used to specify multiple media resources for the <audio> element. It allows the browser to choose the best format that it supports. The src attribute specifies the path to the audio file, and the type attribute specifies the MIME type of the audio file. Example In this example, the <audio> element includes the controls and autoplay attributes. Two <source> elements are nested inside the <audio> element, providing the audio in both OGG and MP3 formats. The text "Your browser does not support the audio element." is displayed if the browser does not support the <audio> element. <audio controls autoplay> <source src="dog.ogg" type="audio/ogg"> <source src="dog.mp3" type="audio/mpeg"> Your browser does not support the audio element. </audio> 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html69/270 Result Browser Support The <audio> element is supported by all modern browsers, but not all browsers support the same audio formats. It is a good practice to provide multiple formats to ensure compatibility across different browsers. Accessibility To make audio content accessible, consider providing text transcripts or captions for users who are deaf or hard of hearing. Additionally, ensure that the audio controls are keyboard accessible for users who rely on keyboard navigation. Conclusion The <audio> element is a powerful tool for embedding audio content in web pages. By using various attributes and providing multiple audio formats, you can create a flexible and accessible audio experience for users. 0:000:00/ 0:00/ 0:00 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html70/270 Video Just like with the audio element, the source is defined within the <source> element. In order to play video on most browsers, it is also required that the type attribute be defined. This attribute specifies the MIME type of the video file, which helps the browser determine if it can play the file. The <video> element supports various attributes: width and height : Define the dimensions of the video player. controls : Adds video controls like play, pause, and volume. autoplay : Starts playing the video as soon as it is ready. loop : Makes the video start over again, every time it is finished. muted : Mutes the audio of the video by default. Here is an example of a basic video element with multiple sources: In this example: The width and height attributes set the size of the video player. The controls attribute adds playback controls. Two <source> elements are provided, each with a different video format ( mp4 and ogg ). This ensures better compatibility across different browsers. The text "Your browser does not support the video tag." is displayed if the browser does not support the <video> element. By using multiple <source> elements, you can provide different video formats to ensure that your video plays on various browsers and devices. <video width="320" height="240" controls> <source src="movie.mp4" type="video/mp4"> <source src="movie.ogg" type="video/ogg"> Your browser does not support the video tag. </video> 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html71/270 Learning To Code CSS 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html72/270 Basics Of CSS Internal CSS is a way to include CSS styles directly within an HTML document. It is defined within the <style> tags in the <head> section of the HTML file. This allows you to apply styles specifically to that HTML document. Example of Internal CSS: External CSS is a separate file that contains all the CSS styles for your website. It is linked to the HTML document using the <link> tag in the <head> section. This approach allows you to keep your CSS code separate from your HTML code, making it easier to maintain and reuse styles across multiple HTML files. Example of External CSS: HTML file ( index.html ): CSS file ( styles.css ): <!DOCTYPE html> <html> <head> <style> body { background-color: lightblue; } h1 { color: red; } </style> </head> <body> <h1>Welcome to my website!</h1> <p>This is an example of internal CSS.</p> </body> </html> <!DOCTYPE html> <html> <head> <link rel="stylesheet" href="styles.css"> </head> <body> <h1>Welcome to my website!</h1> <p>This is an example of external CSS.</p> </body> </html> 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html73/270 Inline CSS is applied directly to individual HTML elements using the style attribute. This allows you to define styles inline with the HTML tags themselves. While it can be useful for making quick style changes, it is generally not recommended for larger projects as it can make the HTML code harder to read and maintain. Example of Inline CSS: By using these different types of CSS, you have the flexibility to choose the most appropriate approach for your specific needs. body { background-color: lightblue; } h1 { color: red; } <!DOCTYPE html> <html> <body> <h1 style="color: red;">Welcome to my website!</h1> <p style="font-size: 18px;">This is an example of inline CSS.</p> </body> </html> 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html74/270 Syntax CSS (Cascading Style Sheets) is a powerful stylesheet language that plays a crucial role in web development. It is used to describe the presentation of a document written in HTML or XML, dictating how elements should be rendered on various media such as screens, paper, or even in speech. Basic Syntax At the heart of CSS lies its basic syntax, which consists of a selector and a declaration block: Selector: This part of the rule targets the HTML element(s) you wish to style. Declaration Block: Enclosed in curly braces, this block contains one or more declarations separated by semicolons. Each declaration pairs a CSS property with a value, separated by a colon. Example Consider the following example: In this snippet, h1 is the selector, and color: blue; and font-size: 20px; are the declarations that style the h1 element. Selectors Selectors are fundamental in CSS as they determine which HTML elements are targeted for styling. There are several types of selectors: selector { property: value; } h1 { color: blue; font-size: 20px; } 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html75/270 Element Selector: Targets elements by their tag name. Class Selector: Targets elements by their class attribute. ID Selector: Targets elements by their id attribute. Attribute Selector: Targets elements based on an attribute or attribute value. Pseudo-class Selector: Targets elements based on their state. Pseudo-element Selector: Targets parts of elements. p { color: red; } .classname { color: green; } #idname { color: blue; } \[type="text"\] { border: 1px solid black; } a:hover { color: orange; } p::first-line { font-weight: bold; } 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html76/270 Properties and Values CSS properties are used to apply styles to elements, and each property can take a range of values. Here are some common properties: color: Sets the color of the text. background-color: Sets the background color of an element. font-size: Sets the size of the font. margin: Sets the space outside an element. padding: Sets the space inside an element. border: Sets the border around an element. Cascading and Specificity The "Cascading" in CSS stands for the way styles cascade down from multiple sources, with the order and specificity of the rules determining which styles are applied. Cascading: When multiple rules apply to the same element, the rule that appears last in the CSS file takes precedence. Specificity: This concept determines which rule is applied by assigning weights to different types of selectors. ID selectors have higher specificity than class selectors, which color: red; background-color: yellow; font-size: 16px; margin: 10px; padding: 10px; border: 1px solid black; 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html77/270 in turn have higher specificity than element selectors. Example of Specificity In this example, although the p selector sets the color to red, the #unique ID selector overrides it and sets the color to blue due to its higher specificity. Inheritance CSS properties can be inherited from parent elements to child elements. For instance, if you set the color property on a parent element, its child elements will inherit that color unless they have their own color property set. Example of Inheritance In this example, both the div and the p elements will have green text because the color property is inherited. p { color: red; } #unique { color: blue; } <p id="unique">This text will be blue.</p> div { color: green; } <div> This text will be green. <p>This text will also be green.</p> </div> 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html78/270 Conclusion Mastering CSS syntax is essential for creating visually appealing web pages. By understanding selectors, properties, values, cascading, specificity, and inheritance, you can precisely control the presentation of your HTML documents, ensuring a polished and professional look. 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html79/270 Comments Comments in CSS are a way to add notes or explanations to your code that are not interpreted by the browser. They are useful for documenting your styles or temporarily disabling a block of code. To add a comment in CSS, you can use the /\* \*/ syntax. Anything between these two symbols will be ignored by the browser when rendering the page. Here's an example of a CSS comment: You can also use comments to provide additional information about specific styles or sections of your code. This can be helpful for yourself or other developers who may need to understand or modify your code in the future. It's important to note that comments should be used sparingly and only when necessary. Too many comments can clutter your code and make it harder to read and maintain. Remember to always start and end your comments with /\* and \*/ respectively, and keep them concise and relevant to the code they are associated with. /\* This is a comment \*/ 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html80/270 Colors In CSS the color attribute can be used to change the color of text on the page. Example In this example, all text within the <p> element turn red. p { color: "red"; } 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html81/270 Backgrounds In CSS background properties are used to add different background effects to different elements on a page. The background-color attribute affects what color will appear in the background of the element. Example The background-image property specifies the image that will be used as the background for your chosen element. Example By default this image will repeat so that it covers the entire element. h2 { width: 100%; text-align:center; background-color: "red"; } h2 { width: 100%; text-align:center; background-image: url("america.png"); } 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html82/270 Borders In CSS border width can be specified by setting the border-width property Example Setting border color can be done by specifying the border-color property as shown below. Example The border-style property controls whether the border is dotted, dashed, solid, etc. This can be done in the same manner as shown below. Example Border properties can be specified using shorthand as shown below. Example This will create a border that is 1 pixel thick, and solid black. header { border-width: 5px; } header { border-color: "red"; } header { border-style: "dotted"; } header { border: 1px solid black; } 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html83/270 Dimensions In CSS, an objects dimensions can be specified using the width and height properties. Example Furthermore, these properties can use the vw , vy , and % units. The vw unit changes an elements width to the number of pixels that occupies the given numbers percentage of the screen width. For example if the width is 50vw the object will take up 50% of the screens width. Example This shows a paragraph that has a height and width equal to that of the screens total width. One can also specify the height and width properties as a percentage Example p { width: 500px; height: 700px; } p { width: 50vw; height: 50vw; } p { width: 50%; height: 50%; } 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html84/270 Align In CSS the text-align property controls whether text appears in the left, center, or right side within its element. Example /\* This aligns the text to the left \*/ p { text-align: left; } /\* This aligns the text to the center \*/ p { text-align: center; } /\* This aligns the text to the right \*/ p { text-align: right; } 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html85/270 Margins In CSS, margins control the space outside an element's border, creating space between the element and its neighboring elements. Margins can be set for each side of an element (top, right, bottom, and left) using individual properties or a shorthand property. Individual Margin Properties There are four individual properties to specify an element's margin: margin-top : Sets the top margin of an element. margin-right : Sets the right margin of an element. margin-bottom : Sets the bottom margin of an element. margin-left : Sets the left margin of an element. Example Shorthand Margin Property The shorthand margin property allows you to set all four margins at once. It can take one to four values: One value: Applies to all four sides. Two values: The first value applies to the top and bottom, and the second value applies to the right and left sides. Three values: The first value applies to the top, the second to the right and left sides, and the third to the bottom. Four values: The values apply to the top, right, bottom, and left sides respectively. p { margin-top: 3px; margin-right: 2px; margin-bottom: 2px; margin-left: 3px; } 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html86/270 One Value When one value is specified, the margin applies to all four sides. Example Two Values When two values are specified, the first value applies to the top and bottom, and the second value applies to the right and left sides. Example Three Values When three values are specified, the first value applies to the top, the second to the right and left sides, and the third to the bottom. Example Four Values When four values are specified, the first value applies to the top, the second to the right, the third to the bottom, and the fourth to the left side. p { margin: 50px; } p { margin: 50px 20px; } p { margin: 50px 20px 30px; } 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html87/270 Example Negative Margins Margins can also be negative, which can pull elements closer together or even overlap them. Example Auto Margins The margin property can take the value auto , which is commonly used for centering elements horizontally. Example In this example, the div element will be centered horizontally within its container. Margin Collapsing In CSS, vertical margins between adjacent block-level elements sometimes collapse, meaning the larger of the two margins is used. This can affect the layout and spacing of elements. p { margin: 50px 20px 30px 50px; } p { margin-top: -10px; } div { width: 50%; margin: 0 auto; } 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html88/270 Example In this example, the margin between element1 and element2 will be 30px, not 50px, due to margin collapsing. Understanding how margins work in CSS is crucial for creating well-structured and visually appealing web layouts. By mastering both individual and shorthand margin properties, as well as concepts like negative margins, auto margins, and margin collapsing, you can have precise control over the spacing and alignment of elements on your web pages. <style> .element1 { margin-bottom: 20px; } .element2 { margin-top: 30px; } </style> <div class="element1">Element 1</div> <div class="element2">Element 2</div> 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html89/270 Padding Understanding Padding in CSS Padding is a fundamental concept in CSS that controls the distance between an element's inner content and its border. This property is essential for managing the spacing within elements, ensuring that content is visually appealing and readable. In this chapter, we will delve deep into the padding property, exploring its syntax, various units, and how it interacts with other CSS properties. The Syntax of Padding The padding property can be specified in multiple ways, using one, two, three, or four values. Each value represents the padding for one or more sides of the element. Single Value When a single value is specified, the padding applies uniformly to all four sides (top, right, bottom, and left). Example In this example, the paragraph element will have 50px of padding on all sides, creating a consistent space around the content. Two Values When two values are specified, the first value applies to the top and bottom, while the second value applies to the right and left sides. p { padding: 50px; } 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html90/270 Example Here, the paragraph element will have 50px of padding on the top and bottom, and 20px on the right and left sides, providing a balanced yet varied spacing. Three Values When three values are specified, the first value applies to the top, the second to the right and left sides, and the third to the bottom. Example In this case, the paragraph element will have 50px of padding on the top, 20px on the right and left sides, and 30px on the bottom, creating a more complex spacing pattern. Four Values When four values are specified, the first value applies to the top, the second to the right, the third to the bottom, and the fourth to the left side. Example For this example, the paragraph element will have 50px of padding on the top, 20px on the right, 30px on the bottom, and 40px on the left side, allowing for precise control over the element's padding. p { padding: 50px 20px; } p { padding: 50px 20px 30px; } p { padding: 50px 20px 30px 40px; } 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html91/270 Exploring Different Units for Padding Padding can be specified using various units, such as pixels ( px ), ems ( em ), percentages ( % ), and more. Each unit has its unique use case depending on the design requirements. Example with Pixels Pixels provide a fixed and precise measurement, making them ideal for designs that require exact spacing. Example with Percentages Percentages are relative to the parent element's width, allowing for responsive designs that adapt to different screen sizes. Example with Ems Ems are relative to the font size of the element, making them useful for scalable designs that maintain proportional spacing. Combining Padding with Other CSS Properties Padding is often used in conjunction with other CSS properties such as margin , border , and width to create well-structured and visually appealing layouts. div { padding: 10px 20px 30px 40px; } div { padding: 5% 10% 15% 20%; } div { padding: 1em 2em 3em 4em; } 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html92/270 Example In this example, the div element has padding, margin, a border, and a specified width, creating a clear and defined space around the content. This combination of properties helps in achieving a balanced and aesthetically pleasing design. Conclusion Understanding and using the padding property effectively is crucial for creating well-designed web pages. By controlling the space within elements, you can enhance the readability and overall aesthetics of your site. Experiment with different values and units to see how they affect your layout and find the best combination for your design needs. Mastering padding will empower you to create visually appealing and user-friendly web designs. div { padding: 20px; margin: 10px; border: 1px solid black; width: 200px; } 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html93/270 Text In this section, we will explore various techniques to style text using CSS. Text styling is a fundamental aspect of web design, and mastering it can significantly enhance the visual appeal of your web pages. Color The color property in CSS allows you to change the color of text. This property accepts various types of values, including color names, hexadecimal values, RGB, RGBA, HSL, and HSLA. Let's start with a simple example using a named color: For more precise color control, you can use hexadecimal values: RGB and RGBA values offer dynamic color settings: HSL and HSLA values allow you to define colors based on hue, saturation, and lightness: p { color: blue; } p { color: #1e90ff; } p { color: rgb(30, 144, 255); } p { color: rgba(30, 144, 255, 0.8); } p { color: hsl(207, 100%, 50%); } p { color: hsla(207, 100%, 50%, 0.8); } 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html94/270 Alignment Text alignment within its container is controlled using the text-align property. This property can take several values, including left , right , center , justify , and start or end for more flexible alignment based on the writing mode. For example, to center text: To justify text, aligning it to both the left and right margins: Decoration Text decoration properties add visual effects to text. The text-decoration property is shorthand for setting text-decoration-line , text-decoration-color , text-decoration- style , and text-decoration-thickness . For example, to underline or strike through text: You can also customize the color and style of the decoration: Transformation Text transformation properties change the case of text. The text-transform property can take values such as uppercase , lowercase , capitalize , and none . For example, to make text h1 { text-align: center; } p { text-align: justify; } a { text-decoration: underline; } del { text-decoration: line-through; } a { text-decoration: underline; text-decoration-color: red; text-decoration-style: wavy; } 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html95/270 uppercase or lowercase: To capitalize the first letter of each word: Spacing Control the spacing between characters and words using the letter-spacing and word- spacing properties. letter-spacing adjusts the space between characters, while word- spacing adjusts the space between words. For example: For more precise control, use negative values to decrease spacing: Shadow Add a shadow effect to text using the text-shadow property. This property accepts values for horizontal offset, vertical offset, blur radius, and color. For example: h2 { text-transform: uppercase; } p { text-transform: lowercase; } h3 { text-transform: capitalize; } h3 { letter-spacing: 2px; } p { word-spacing: 5px; } h3 { letter-spacing: -1px; } 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html96/270 Add multiple shadows by separating them with commas: Advanced Techniques Gradients Apply gradients to text using the background property in combination with -webkit- background-clip and -webkit-text-fill-color : Clipping and Masking Text can be clipped or masked using CSS properties like clip-path and mask-image : These advanced techniques allow for creative and visually appealing text effects, enhancing the overall design of your web pages. h4 { text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5); } h4 { text-shadow: 1px 1px 2px black, 0 0 5px blue; } h1 { background: linear-gradient(to right, red, orange, yellow, green, blue, indigo, violet); -webkit-background-clip: text; -webkit-text-fill-color: transparent; } h2 { clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%); } h3 { mask-image: url('mask.png'); } 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html97/270 Links Links in CSS allow you to style and customize the appearance of hyperlinks on your web page. By using various CSS properties, you can change the color, font, size, and other visual aspects of links to enhance the user experience and maintain a consistent design throughout your site. Basic Link Styling Here's an example of how you can style links in CSS: In the above example, the a selector targets all anchor elements (links) on the page. The color property is used to change the link color. The :hover pseudo-class is used to apply styles when the link is being hovered over. The :visited pseudo-class is used to style visited links, and the :active pseudo-class is used to style links when they are being clicked. Advanced Link Styling You can also apply other CSS properties like text-decoration , font-size , and font-weight to further customize the appearance of links. Here are some examples: /\* Styling the default link color \*/ a { color: blue; } /\* Styling the link hover effect \*/ a:hover { color: red; } /\* Styling the visited link color \*/ a:visited { color: purple; } /\* Styling the active link color \*/ a:active { color: green; } 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html98/270 Using CSS Variables for Link Styling CSS variables can be used to maintain consistency and make it easier to update styles across your site. Here's an example: /\* Removing the underline from links \*/ a { text-decoration: none; } /\* Adding an underline only on hover \*/ a:hover { text-decoration: underline; } /\* Changing the font size and weight of links \*/ a { font-size: 16px; font-weight: bold; } :root { --link-color: blue; --link-hover-color: red; --link-visited-color: purple; --link-active-color: green; } a { color: var(--link-color); } a:hover { color: var(--link-hover-color); } a:visited { color: var(--link-visited-color); } a:active { color: var(--link-active-color); } 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html99/270 Responsive Link Styling To ensure that your links look good on all devices, you can use media queries to apply different styles based on the screen size: Conclusion Styling links with CSS is a powerful way to enhance the visual appeal and usability of your web pages. By using a combination of basic and advanced CSS properties, CSS variables, and responsive design techniques, you can create a consistent and engaging user experience. Remember to place your CSS code within a <style> tag in your HTML document or in an external CSS file linked to your HTML using the <link> tag. /\* Default link styles \*/ a { color: blue; font-size: 16px; } /\* Larger font size for larger screens \*/ @media (min-width: 768px) { a { font-size: 18px; } } /\* Even larger font size for very large screens \*/ @media (min-width: 1200px) { a { font-size: 20px; } } 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html100/270 List Customization in CSS CSS provides a wide range of options for customizing lists. You can modify the appearance of list items, change bullet styles, and even create your own custom markers. Let's explore some of these customization techniques in detail. Changing Bullet Styles The default bullet style of an unordered list can be changed using the list-style-type property. This property allows you to specify different types of bullet points, such as circles, squares, or none. For example, to use square bullets, you can add the following CSS rule: Other possible values for list-style-type include disc , circle , and none . Each of these values changes the appearance of the bullet points in the list. Changing Bullet Styles in Depth The list-style-type property is a versatile tool in CSS that allows you to control the appearance of list item markers. By default, unordered lists ( <ul> ) use a disc-shaped bullet, but this can be easily changed to suit your design needs. For instance, if you prefer a square bullet, you can set the list-style-type to square : This simple change can significantly alter the look and feel of your lists, making them more aligned with your design preferences. ul { list-style-type: square; } ul { list-style-type: square; } 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html101/270 Creating Custom Markers CSS also allows you to create your own custom markers for lists. You can use images, icons, or even Unicode characters as markers. This can be achieved using the list-style-image property. Here's an example of using a custom image as a bullet: In addition to images, you can use the ::before pseudo-element to add custom content before each list item. For example, you can use Unicode characters to create unique markers: Advanced List Customization For more advanced customization, you can combine multiple CSS properties and techniques. For example, you can use the counter-reset and counter-increment properties to create custom counters for list items: This example creates a custom counter for an ordered list, with each list item displaying a bold, blue number followed by a period. ul { list-style-image: url('bullet.png'); } ul li::before { content: '\\2022'; /\* Unicode for bullet \*/ color: red; /\* Custom color for the bullet \*/ font-size: 20px; /\* Custom size for the bullet \*/ margin-right: 10px; /\* Space between bullet and text \*/ } ol.custom-counter { counter-reset: custom-counter; } ol.custom-counter li { counter-increment: custom-counter; } ol.custom-counter li::before { content: counter(custom-counter) '. '; font-weight: bold; color: blue; } 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html102/270 Conclusion With CSS, you have the power to customize lists in various ways. Whether you want to change bullet styles, modify numbering formats, or create custom markers, CSS provides the flexibility to make your lists visually appealing and unique. By combining different CSS properties and techniques, you can achieve a wide range of effects and tailor the appearance of your lists to match your design requirements. 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html103/270 Position The position property in CSS is a powerful tool that allows you to control the placement of elements on a web page. By understanding and utilizing its five possible values, you can manipulate the layout and behavior of elements to create dynamic and visually appealing designs. 1. static The static value is the default for the position property. Elements with position: static are positioned according to the normal flow of the document. They are unaffected by the top , bottom , left , right , or z-index properties. This means that the element will appear in the order it is written in the HTML, maintaining its default position without any offsets. 2. relative When you set an element's position to relative , it is positioned relative to its normal position in the document flow. You can then use the top , bottom , left , and right properties to offset the element from its original position. Importantly, this does not affect the layout of other elements on the page; they will still behave as if the relative element is in its original position. Example: In this example, .my-element will be moved 20px down and 10px to the right from where it would normally be. 3. fixed Elements with position: fixed are positioned relative to the viewport, meaning they will always stay in the same place even if the page is scrolled. This is particularly useful for creating elements that need to remain visible at all times, such as a fixed header or a floating action .my-element { position: relative; top: 20px; left: 10px; } 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html104/270 button. The top , bottom , left , and right properties can be used to specify the exact position of the element within the viewport. Example: Here, .my-element will be fixed to the top-right corner of the viewport. 4. absolute Elements with position: absolute are positioned relative to their nearest positioned ancestor (i.e., the nearest ancestor with a position value other than static ). If there is no such ancestor, the element will be positioned relative to the initial containing block, which is usually the <html> element. The top , bottom , left , and right properties can be used to specify the exact position of the element. Example: In this example, .my-element will be positioned 50px from the top and 50px from the left of its nearest positioned ancestor, which is .container . Absolute positioning removes the element from the normal document flow, meaning it does not affect the layout of other elements on the page. This can be useful for creating complex layouts where elements need to overlap or be precisely placed within a container. .my-element { position: fixed; top: 0; right: 0; } .container { position: relative; width: 200px; height: 200px; } .my-element { position: absolute; top: 50px; left: 50px; } 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html105/270 5. sticky Elements with position: sticky are positioned based on the user's scroll position. They behave like relative elements until the user scrolls to a certain point, at which they become fixed and stay in place. This is useful for creating sticky headers or navigation bars that stick to the top of the page when scrolling. The top , bottom , left , and right properties can be used to specify the offset from the scrolling container. Example: In this example, .my-element will act as a relatively positioned element until the user scrolls down 20px, at which point it will become fixed and stay 20px from the top of the viewport. Additional Considerations Z-Index: The z-index property can be used in conjunction with position to control the stacking order of elements. Elements with a higher z-index will appear above those with a lower z-index . Containing Block: The containing block for an absolutely positioned element is the nearest ancestor with a position other than static . For fixed elements, the containing block is the viewport. Overflow: Positioned elements can affect the overflow behavior of their containing block. For example, an absolutely positioned element can extend outside the bounds of its containing block if the overflow property is set to visible . Mastering the position property and its values is crucial for creating complex layouts and ensuring that elements behave as expected in different scenarios. By gaining a deep understanding of these concepts, you can achieve greater control over the design and functionality of your web pages. .my-element { position: sticky; top: 20px; } 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html106/270 Z-Index The z-index property in CSS is a powerful tool that controls the vertical stacking order of elements that overlap on a webpage. This property is essential for managing the visibility and layering of elements, ensuring that the most important content is accessible to users. However, it only works on elements that have a position value other than static , such as relative , absolute , fixed , or sticky . Understanding Stacking Contexts To fully grasp the concept of z-index , it's crucial to understand stacking contexts. A stacking context is an element that contains a group of layers with a specific stacking order. When an element is positioned and has a z-index value other than auto , it forms a new stacking context. Each stacking context is treated independently, meaning that elements within a stacking context are stacked relative to each other without affecting the stacking order of elements in other stacking contexts. Creating a Stacking Context There are several ways to create a new stacking context: Setting a z-index value on a positioned element. Applying an opacity value less than 1. Using CSS properties like transform , filter , perspective , clip-path , and mask . These properties not only create a new stacking context but also influence the rendering and visual effects of the elements. The Default Stacking Order By default, elements on a webpage are stacked in a specific order from bottom to top: 1. The background and borders of the root element. 2. Descendant non-positioned elements in the order they appear in the HTML. 3. Descendant positioned elements in the order they appear in the HTML. This default stacking order ensures that background elements are rendered first, followed by non-positioned and then positioned elements. 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html107/270 Practical Examples To illustrate how z-index works, consider the following example: In this example, .box2 will appear above .box1 because it has a higher z-index value. This demonstrates how z-index can be used to control the layering of overlapping elements. Using Negative Z-Index Values Elements can also have a negative z-index , which places them behind other elements with a z-index of 0 or higher. For example: This technique is useful for creating background elements that should appear behind all other content. Practical Use Cases for Z-Index The z-index property is particularly useful in various scenarios, such as: .container { position: relative; } .box1 { position: absolute; top: 20px; left: 30px; z-index: 1; /\* This will appear below .box2 \*/ } .box2 { position: absolute; top: 40px; left: 50px; z-index: 2; /\* This will appear above .box1 \*/ } .background { position: absolute; top: 0; left: 0; z-index: -1; /\* This will appear behind elements with z-index 0 or higher \*/ } 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html108/270 Modals and Popups: Ensuring they appear above other content to capture user attention. Tooltips: Displaying above other elements to provide additional information. Overlapping Images: Controlling which image appears on top to create visually appealing designs. By mastering the z-index property, you can effectively manage the layering of elements on your webpage, ensuring that the most important content is always visible and accessible to users. Understanding and using the z-index property effectively can help manage the layering of elements on a webpage, ensuring that the most important content is visible and accessible to users. 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html109/270 Overflow Understanding Overflow in CSS In the world of web design, managing how content behaves when it exceeds the boundaries of its container is a fundamental skill. This is where the concept of overflow in CSS comes into play. The overflow property in CSS allows you to control the display of content that spills out of its container, ensuring your designs remain both functional and visually appealing. The overflow Property The overflow property in CSS can be set to one of several values, each dictating a different behavior for overflowing content: 1. visible (default): When set to visible , content is not clipped and may overflow its container. This is the default behavior, meaning that if no overflow property is specified, the content will be allowed to overflow the container. 2. hidden : Setting overflow to hidden clips the content that overflows, making it invisible. This is useful when you want to hide any content that exceeds the container's boundaries. 3. scroll : With scroll , content that overflows is clipped, but a scrollbar is added to allow scrolling. This ensures that all content can be accessed by the user, even if it exceeds the container's size. 4. auto : The auto value clips content if it overflows and adds a scrollbar only if necessary. This is a more flexible option compared to scroll , as it only adds a scrollbar when the content actually overflows. Detailed Examples To better understand how the overflow property works, let's look at some examples: 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html110/270 Explanation of Examples 1. Hidden Overflow: In this example, the .container element has overflow: hidden , which means any content that exceeds its dimensions will be clipped and not visible. This is useful for creating clean layouts where excess content should not be displayed. 2. Visible Overflow: .container { width: 200px; height: 100px; border: 1px solid black; overflow: hidden; } .container-overflow-visible { width: 200px; height: 100px; border: 1px solid black; overflow: visible; } .container-overflow-scroll { width: 200px; height: 100px; border: 1px solid black; overflow: scroll; } .container-overflow-auto { width: 200px; height: 100px; border: 1px solid black; overflow: auto; } .container { width: 200px; height: 100px; border: 1px solid black; overflow: hidden; } 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html111/270 The .container-overflow-visible element has overflow: visible , allowing the content to overflow and be visible outside the container. This can be useful for certain design effects where overflow content is intentionally shown. 3. Scrollable Overflow: The .container-overflow-scroll element has overflow: scroll , which adds a scrollbar to the container when the content overflows. This ensures that all content can be accessed by the user, even if it exceeds the container's size. 4. Auto Overflow: The .container-overflow-auto element has overflow: auto , which behaves like scroll but only adds a scrollbar when necessary. This is a more flexible option compared to scroll , as it only adds a scrollbar when the content actually overflows. .container-overflow-visible { width: 200px; height: 100px; border: 1px solid black; overflow: visible; } .container-overflow-scroll { width: 200px; height: 100px; border: 1px solid black; overflow: scroll; } .container-overflow-auto { width: 200px; height: 100px; border: 1px solid black; overflow: auto; } 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html112/270 Practical Use Cases Responsive Design: Managing overflow is essential for responsive design. By using overflow: auto or overflow: scroll , you can ensure that content remains accessible on different screen sizes. Modal Windows: In modal windows, overflow: hidden can be used to prevent background content from scrolling when the modal is open. Image Galleries: For image galleries, overflow: scroll can be used to allow users to scroll through images that exceed the container's dimensions. Conclusion Mastering the overflow property in CSS is crucial for creating effective and visually appealing web designs. By choosing the appropriate overflow value, you can control how content is displayed and ensure a better user experience. Remember to adjust the dimensions and styles according to your specific needs, and you'll be well on your way to crafting beautiful, functional web pages. 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html113/270 Inline-Block The display property in CSS is used to define how an element should be rendered on the web page. There are three commonly used values for the display property: inline , block , and inline-block . Inline An element with display: inline is rendered inline with the surrounding content. It does not start on a new line and only takes up as much width as necessary. Examples of inline elements include <span> , <a> , and <strong> . Inline elements are typically used for text and small content pieces that should flow with the surrounding text. Here's an example: In this example, the .inline-example class will make the element appear inline with the text around it, with a border and padding applied. Block An element with display: block is rendered as a block-level element. It starts on a new line and takes up the full width available. Examples of block elements include <div> , <p> , and <h1> . Block elements are used for larger content sections that should stand alone on their own lines. Here's an example: In this example, the .block-example class will make the element take up the full width of its container, with a border, padding, and margin applied. .inline-example { display: inline; border: 1px solid black; padding: 5px; } .block-example { display: block; border: 1px solid black; padding: 10px; margin-bottom: 10px; } 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html114/270 Inline-block An element with display: inline-block is rendered inline like an inline element, but it can have a width and height like a block-level element. It starts on a new line only if necessary. Examples of inline-block elements include <img> , <button> , and <input> . Inline-block elements are useful for creating layouts where elements need to be inline but also need to have specific dimensions. Here's an example: In this example, the .inline-block-example class will make the element appear inline with other elements, but it will have a fixed width and height, with a border, padding, and margin applied. Detailed Comparison Inline vs Block Inline elements do not start on a new line and only take up as much width as necessary. They are typically used for small pieces of content within a line of text. Block elements start on a new line and take up the full width available. They are used for larger sections of content that should stand alone. Inline-block vs Inline Inline-block elements are similar to inline elements in that they do not start on a new line. However, unlike inline elements, they can have a width and height specified. Inline elements cannot have a width and height specified, and their dimensions are determined by their content. .inline-block-example { display: inline-block; width: 200px; height: 100px; border: 1px solid black; padding: 10px; margin-right: 10px; } 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html115/270 Inline-block vs Block Inline-block elements do not start on a new line unless necessary, and they can have a width and height specified. Block elements always start on a new line and take up the full width available. Practical Use Cases Inline Elements Inline elements are best used for styling text or small pieces of content within a line. For example, you might use an inline element to highlight a word within a paragraph: Block Elements Block elements are best used for larger sections of content that should stand alone. For example, you might use a block element to create a section of a webpage: Inline-block Elements Inline-block elements are useful for creating layouts where elements need to be inline but also need specific dimensions. For example, you might use inline-block elements to create a row of boxes: By using the display property with these values, you can control the layout and behavior of elements on your web page, allowing for a wide range of design possibilities. <p>This is an <span class="highlight">important</span> word.</p> <div class="section"> <h1>Section Title</h1> <p>This is a paragraph within the section.</p> </div> <div class="box inline-block-example">Box 1</div> <div class="box inline-block-example">Box 2</div> <div class="box inline-block-example">Box 3</div> 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html116/270 Opacity Opacity is a fundamental concept in web design that controls the transparency of an element. When an element has an opacity of 100%, it appears completely solid. Conversely, an element with an opacity of 0% is entirely transparent. This property is crucial for creating visually appealing designs and enhancing user experience. Understanding Opacity Opacity is a CSS property that allows you to control the transparency level of an element. The value of the opacity property ranges from 0 to 1, where 0 means fully transparent and 1 means fully opaque. This property can take decimal values to represent different levels of transparency. Syntax The syntax for using the opacity property in CSS is straightforward: value : A number between 0.0 (fully transparent) and 1.0 (fully opaque). Examples Here are some examples to illustrate how opacity works: element { opacity: value; } 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html117/270 Practical Use Cases Opacity can be used in various scenarios to enhance the visual appeal of web pages. Here are some practical use cases: 1. Hover Effects: You can use opacity to create hover effects that highlight elements when a user hovers over them. 2. Background Images: Adjusting the opacity of background images can create a more subtle effect, making text or other elements more readable. 3. Layering Elements: Using opacity to layer elements on top of each other can create a sense of depth and dimension. /\* Fully opaque element \*/ .opaque-element { opacity: 1; /\* Equivalent to 100% \*/ } /\* Fully transparent element \*/ .transparent-element { opacity: 0; /\* Equivalent to 0% \*/ } /\* Semi-transparent element \*/ .semi-transparent-element { opacity: 0.5; /\* Equivalent to 50% \*/ } .button { opacity: 0.8; transition: opacity 0.3s; } .button:hover { opacity: 1; } .background-image { background-image: url('image.jpg'); opacity: 0.7; } 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html118/270 Important Considerations When using the opacity property, there are a few important considerations to keep in mind: Inheritance: The opacity property affects not only the element it is applied to but also all of its children. This means that if you set an opacity of 0.5 on a parent element, all child elements will also appear semi-transparent. Performance: Using opacity can sometimes impact performance, especially on complex pages with many elements. Use it judiciously to avoid performance issues. Cross-Browser Compatibility: The opacity property is well-supported across modern browsers. However, for older versions of Internet Explorer (IE8 and below), you might need to use the filter property. By understanding and utilizing the opacity property effectively, you can enhance the visual appeal and user experience of your web projects. Whether you are creating subtle hover effects, layering elements, or adjusting background images, opacity is a powerful tool in your CSS toolkit. .layer1 { opacity: 0.9; } .layer2 { opacity: 0.6; } .old-browser-compatibility { opacity: 0.5; filter: alpha(opacity=50); /\* For IE8 and below \*/ } 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html119/270 Combinators Combinators in CSS are selectors that allow you to target specific elements based on their relationship with other elements. There are four types of combinators in CSS: 1. Descendant combinator (space): It selects an element that is a descendant of another element. For example, div p selects all <p> elements that are descendants of <div> elements. 2. Child combinator (>): It selects an element that is a direct child of another element. For example, ul > li selects all <li> elements that are direct children of <ul> elements. 3. Adjacent sibling combinator (+): It selects an element that is the next sibling of another element. For example, h1 + p selects the <p> element that is the next sibling of an <h1> element. 4. General sibling combinator (~): It selects all elements that are siblings of another element. For example, h2 ~ p selects all <p> elements that are siblings of an <h2> element. Here are some examples: These combinators provide powerful ways to target specific elements in your CSS selectors based on their relationship with other elements. /\* Descendant combinator \*/ div p { color: red; } /\* Child combinator \*/ ul > li { font-weight: bold; } /\* Adjacent sibling combinator \*/ h1 + p { margin-top: 10px; } /\* General sibling combinator \*/ h2 ~ p { font-style: italic; } 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html120/270 Pseudo Classes Pseudo classes in CSS allow you to select and style elements based on their state or position within the document tree. They are denoted by a colon followed by the pseudo class name. Here are some commonly used pseudo classes: 1. :hover - Selects an element when the mouse pointer is over it. Example: 2. :active - Selects an element when it is being activated (clicked or tapped). Example: 3. :focus - Selects an element when it has focus (e.g., when it is selected by keyboard navigation). Example: 4. :first-child - Selects the first child element of its parent. Example: 5. :nth-child() - Selects elements based on their position within their parent. Example: These are just a few examples of the many pseudo classes available in CSS. They provide powerful ways to style elements based on various conditions and states. a:hover { color: red; } button:active { background-color: blue; } input:focus { border-color: green; } ul li:first-child { font-weight: bold; } ul li:nth-child(odd) { background-color: lightgray; } 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html121/270 Pseudo Elements Pseudo-elements in CSS are powerful tools that enable developers to style specific parts of an element without the need for additional HTML markup. By using pseudo-elements, you can enhance the visual presentation of your web pages while keeping your HTML clean and semantic. Pseudo-elements are identified by a double colon ( :: ) to differentiate them from pseudo-classes, which use a single colon ( : ). Common Pseudo-Elements ::before The ::before pseudo-element allows you to insert content before the actual content of an element. This can be particularly useful for adding decorative elements, icons, or additional text without modifying the HTML structure. In the example above, the word "Note: " is inserted before the content of every <p> element, and it is styled in red. ::after Similar to ::before , the ::after pseudo-element inserts content after the content of an element. This is often used for decorative purposes or to clear floats in a layout. Here, the text " - Read more" is appended to the content of each <p> element, styled in blue. p::before { content: "Note: "; color: red; } p::after { content: " - Read more"; color: blue; } 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html122/270 ::first-line The ::first-line pseudo-element targets the first line of a block-level element, allowing you to apply unique styles to it. This can be useful for creating typographic effects such as drop caps or emphasizing the first line of a paragraph. In this example, the first line of each paragraph is made bold and slightly larger, drawing attention to the beginning of the text. ::first-letter The ::first-letter pseudo-element styles the first letter of the first line of a block-level element. This is commonly used to create drop caps, a typographic style where the first letter of a paragraph is larger and more prominent. With this code, the first letter of each paragraph is enlarged and colored green, creating a visually striking effect. ::selection The ::selection pseudo-element allows you to customize the appearance of text when it is selected by the user. This can enhance the user experience by providing a consistent and branded selection style. In this example, any selected text will have a yellow background and black text, making it stand out clearly. p::first-line { font-weight: bold; font-size: 1.2em; } p::first-letter { font-size: 2em; color: green; } ::selection { background: yellow; color: black; } 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html123/270 Usage and Best Practices Pseudo-elements are invaluable for adding stylistic touches without altering the underlying HTML structure. They can be combined with classes, IDs, and other selectors to target specific elements more precisely. Always use the double colon ( :: ) notation for pseudo-elements to ensure compatibility with modern browsers. Consider accessibility when using pseudo-elements, as content added with ::before and ::after may not be read by screen readers. By mastering pseudo-elements, you can create more dynamic and visually appealing web pages with minimal changes to your HTML. This not only improves the aesthetics of your site but also maintains clean and maintainable code. 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html124/270 Visibility Visibility in CSS determines whether an element is visible or hidden on a web page. It is controlled using the visibility property. The visibility property in CSS is a fundamental tool for controlling the visibility of elements on a web page. It allows developers to hide or show elements without affecting the layout of the page. This property accepts several values, but the most commonly used are visible and hidden . visible : The element is displayed as normal. It occupies space on the page and is visible to the user. hidden : The element is not displayed, but it still occupies space on the page. It is effectively invisible, but its space is preserved. Syntax The basic syntax for using the visibility property is straightforward: Values The visibility property can take on several values, each with its own specific behavior: visible : This is the default value. The element is visible. hidden : The element is hidden but still takes up space in the layout. collapse : This value is specific to table elements. For table rows, columns, column groups, and row groups, collapse removes the element from display and also removes the space it occupied. For other elements, collapse is treated as hidden . initial : Sets the property to its default value. inherit : Inherits the property from its parent element. Example Here's a simple example of how to use the visibility property in CSS: element { visibility: value; } 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html125/270 In this example, the element with the class my-element will be hidden on the page, but it will still occupy space in the layout. Differences Between visibility and display It's crucial to understand the difference between the visibility and display properties: visibility: hidden : The element is not visible, but it still occupies space in the layout. Other elements around it will behave as if the hidden element is still there. display: none : The element is completely removed from the document flow. It does not occupy any space, and other elements will be laid out as if the element does not exist. Use Cases When to Use visibility: hidden Preserving Layout: Use visibility: hidden when you want to hide an element but maintain the layout of the page. For example, you might have a placeholder that you want to hide but keep the space it occupies. Accessibility: Use visibility: hidden when you want to hide an element visually but still make it accessible to screen readers or JavaScript. When to Use display: none Removing Elements: Use display: none when you want to completely remove an element from the document flow. This is useful for elements that should not affect the layout of the page at all. Conditional Rendering: Use display: none when you want to conditionally render elements based on certain conditions, such as user interactions or media queries. Interaction with JavaScript Elements hidden with visibility: hidden can still be interacted with using JavaScript. For example, you can change their properties, add event listeners, or manipulate them in other .my-element { visibility: hidden; } 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html126/270 ways. However, they will not be visible to the user. Accessibility Considerations When using visibility: hidden , the element is still accessible to screen readers. This can be useful for providing additional context or information to users who rely on assistive technologies. However, if you want to completely hide an element from screen readers as well, you should use display: none . Conclusion The visibility property in CSS is a powerful tool for controlling the visibility of elements on a web page. By understanding the differences between visibility and display , and knowing when to use each, you can create more flexible and accessible web designs. Remember to use visibility when you want to hide an element while preserving its space, and use display: none when you want to remove it from the document flow entirely. 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html127/270 Columns Multiple columns in CSS and HTML allow you to create a layout where content is divided into multiple columns, similar to a newspaper or magazine. This can be useful for displaying long blocks of text or organizing content in a more visually appealing way. Creating Multiple Columns To create multiple columns, you can use the CSS column-count property. This property specifies the number of columns you want to divide your content into. For example, if you want to divide your content into three columns, you can set column-count: 3; . Example Here's an example of how you can use internal CSS to create multiple columns: <!DOCTYPE html> <html> <head> <style> .column-container { column-count: 3; column-gap: 20px; } </style> </head> <body> <div class="column-container"> <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed euismod, nunc id aliquet tincidunt, odio nunc lacinia nunc, nec lacinia nunc nunc id nunc. Sed euismod, nunc id aliquet tincidunt, odio nunc lacinia nunc, nec lacinia nunc nunc id nunc.</p> <p>Nullam auctor, nunc id aliquet tincidunt, odio nunc lacinia nunc, nec lacinia nunc nunc id nunc. Sed euismod, nunc id aliquet tincidunt, odio nunc lacinia nunc, nec lacinia nunc nunc id nunc.</p> <p>Phasellus euismod, nunc id aliquet tincidunt, odio nunc lacinia nunc, nec lacinia nunc nunc id nunc. Sed euismod, nunc id aliquet tincidunt, odio nunc lacinia nunc, nec lacinia nunc nunc id nunc.</p> </div> </body> </html> 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html128/270 In the example above, the column-container class is applied to a <div> element that wraps the content we want to divide into columns. The column-count property is set to 3, which creates three columns. The column-gap property is used to add some spacing between the columns. Additional Properties column-width The column-width property specifies the ideal width of each column. The browser will then determine the optimal number of columns to fit within the container. For example: column-rule The column-rule property allows you to add a rule (line) between columns. This can help to visually separate the columns. For example: column-span The column-span property allows an element to span across multiple columns. This can be useful for headings or other elements that should not be confined to a single column. For example: .column-container { column-width: 200px; } .column-container { column-count: 3; column-gap: 20px; column-rule: 1px solid #000; } .heading { column-span: all; } 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html129/270 Browser Support Most modern browsers support the CSS multi-column layout properties. However, it is always a good practice to check for compatibility and provide fallbacks if necessary. Conclusion By using multiple columns, you can create a more visually appealing and organized layout for your content in CSS and HTML. Experiment with the various properties to achieve the desired layout for your project. <div class="column-container"> <h2 class="heading">Heading Spanning All Columns</h2> <p>Content in multiple columns...</p> </div> 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html130/270 Gradients Gradients in CSS are a powerful tool that allows you to create smooth transitions between two or more colors. They add depth and visual interest to your web pages, making them more engaging and dynamic. In this chapter, we will explore how to use gradients in CSS and the different types of gradients available. Introduction to Gradients Gradients can be applied to various CSS properties such as backgrounds, borders, and text. They are defined using the linear-gradient , radial-gradient , conic-gradient , and repeating-linear-gradient functions. Let's start with a simple example to illustrate how gradients work in CSS. Example: Basic Gradient Consider the following HTML and CSS code: In this example, we use the linear-gradient function to create a gradient that transitions from red (#ff0000) to blue (#0000ff) horizontally from left to right. You can customize the direction and colors of the gradient to achieve different effects. Remember to place the CSS code within the <style> tags in the <head> section of your HTML document. This is called internal CSS, as the styles are defined within the HTML file itself. <!DOCTYPE html> <html> <head> <title>Gradients Example</title> <style> body { background: linear-gradient(to right, #ff0000, #0000ff); } </style> </head> <body> <h1>Gradients Example</h1> <p>This is an example of using gradients in CSS.</p> </body> </html> 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html131/270 Types of Gradients There are several types of gradients you can use in CSS, each with its own unique properties and effects. Let's explore each type in detail. Linear Gradients Linear gradients transition colors along a straight line. You can control the direction of the gradient using angles or keywords like to right , to left , to top , and to bottom . Example: Linear Gradient This creates a gradient at a 45-degree angle from red to blue. Radial Gradients Radial gradients radiate from an origin point, creating a circular or elliptical gradient. You can specify the shape, size, and position of the gradient. Example: Radial Gradient This creates a circular gradient from red to blue. Conic Gradients Conic gradients rotate colors around a center point, similar to the way a pie chart is colored. Example: Conic Gradient This creates a conic gradient starting from 0 degrees, transitioning through red, blue, and green. background: linear-gradient(45deg, #ff0000, #0000ff); background: radial-gradient(circle, #ff0000, #0000ff); background: conic-gradient(from 0deg, #ff0000, #0000ff, #00ff00); 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html132/270 Repeating Gradients Repeating gradients allow you to create patterns by repeating the gradient. Example: Repeating Linear Gradient This creates a repeating linear gradient with red and blue stripes. Using Multiple Gradients You can layer multiple gradients to create complex designs. Example: Multiple Gradients This layers a linear gradient over a radial gradient. Conclusion Gradients are a versatile and visually appealing way to enhance your web designs. By experimenting with different color combinations, gradient directions, and types of gradients, you can create unique and engaging effects that will captivate your audience. In the next chapter, we will delve deeper into advanced CSS techniques to further enhance your web design skills. background: repeating-linear-gradient(45deg, #ff0000, #ff0000 10px, #0000ff 10px, #0000ff 20px); background: linear-gradient(to right, #ff0000, #0000ff), radial-gradient(circle, #00ff00, #0000ff); 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html133/270 Shadows In the world of CSS, shadows are a powerful tool that can add depth and dimension to your web elements, making your designs more realistic and visually appealing. The cornerstone of creating shadows in CSS is the box-shadow property, which offers a range of customization options to achieve various shadow effects. Understanding the Syntax The box-shadow property is versatile and takes several values in a specific order: 1. Horizontal offset (required): This value determines the shadow's horizontal distance from the element. Positive values move the shadow to the right, while negative values move it to the left. 2. Vertical offset (required): This value sets the shadow's vertical distance from the element. Positive values move the shadow down, while negative values move it up. 3. Blur radius (optional): This value defines the blur effect of the shadow. A higher value results in a more blurred shadow. If omitted, the default value is 0, meaning the shadow will have a sharp edge. 4. Spread radius (optional): This value affects the size of the shadow. Positive values increase the shadow's size, while negative values decrease it. If omitted, the default value is 0. 5. Color (optional): This value sets the shadow's color, which can be specified using any valid CSS color format, such as hex, RGB, RGBA, HSL, or HSLA. If omitted, the default color is the current text color. A Simple Example Let's start with a basic example of how to use box-shadow : In this example: The shadow is positioned 2 pixels to the right and 2 pixels down from the element. .my-element { box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.2); } 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html134/270 The blur radius is set to 4 pixels, giving the shadow a soft edge. The color of the shadow is specified using the rgba() function, where the first three values represent the RGB color values (black), and the fourth value represents the opacity (20%). Creating Multiple Shadows You can also apply multiple shadows to a single element by separating the shadow values with commas: In this example: The first shadow is positioned 2 pixels to the right and 2 pixels down, with a blur radius of 4 pixels and a dark color. The second shadow is positioned 2 pixels to the left and 2 pixels up, with a blur radius of 4 pixels and a light color. Advanced Techniques Inset Shadows By default, shadows are applied outside the element's box. However, you can create an inset shadow (inside the element) by adding the inset keyword: Combining Shadows with Transitions and Animations CSS transitions and animations can be used to create dynamic shadow effects. For example, you can animate the shadow to create a "hover" effect: .my-element { box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.2), -2px -2px 4px rgba(255, 255, 255, 0.2); } .my-element { box-shadow: inset 2px 2px 4px rgba(0, 0, 0, 0.2); } 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html135/270 In this example: The transition property is used to smoothly animate the box-shadow property over 0.3 seconds. When the element is hovered over, the shadow becomes larger and darker. Practical Tips Performance: Be mindful of performance when using multiple or complex shadows, as they can impact rendering performance, especially on lower-end devices. Consistency: Maintain consistency in your shadow styles across your design to create a cohesive look. Accessibility: Ensure that shadows do not negatively impact the readability of text or the usability of interactive elements. Experiment with different values and combinations to achieve the desired shadow effect for your design. When used thoughtfully, shadows can significantly enhance the visual appeal of your web pages. Remember to always end your CSS rules with a semicolon to ensure proper syntax. .my-element { transition: box-shadow 0.3s ease-in-out; } .my-element:hover { box-shadow: 4px 4px 8px rgba(0, 0, 0, 0.3); } 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html136/270 Rounded Corners In CSS, rounded corners can be achieved using the border-radius property. This property allows you to round the corners of an element, giving it a more visually appealing look. To apply rounded corners using shorthand notation, you can use the following syntax: This will apply rounded corners with a radius of 10 pixels to all four corners of the element. If you want to specify different radii for each corner, you can use the longhand notation. Here's an example: In this example, each corner has a different radius, allowing you to create more complex shapes. To demonstrate the usage of rounded corners, here's an example of an HTML document with internal CSS: selector { border-radius: 10px; } selector { border-top-left-radius: 10px; border-top-right-radius: 20px; border-bottom-right-radius: 30px; border-bottom-left-radius: 40px; } 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html137/270 In this example, a div element with the class box is styled with rounded corners using the shorthand notation. The border-radius property is set to 10px , giving the element rounded corners. <!DOCTYPE html> <html> <head> <style> body { background-color: #f2f2f2; } .box { width: 200px; height: 200px; background-color: #fff; border: 1px solid #ccc; border-radius: 10px; margin: 20px; } </style> </head> <body> <div class="box"></div> </body> </html> 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html138/270 Transitions Transitions in CSS allow you to smoothly animate changes in CSS properties over a specified duration. They provide a way to add visual effects and enhance user experience on your website or application. Basic Usage To create a transition, you need to specify the CSS property you want to animate and the duration of the transition. For example, let's say you want to animate the background color of an element when the user hovers over it: In this example, when the user hovers over the element, the background color will transition from blue to red over a duration of 0.3 seconds. Advanced Properties You can also specify additional properties such as timing function and delay to further customize the transition. The timing function determines the speed curve of the transition, allowing you to create effects like ease-in, ease-out, or linear. The delay property allows you to introduce a delay before the transition starts. .element { background-color: blue; transition: background-color 0.3s; } .element:hover { background-color: red; } .element { background-color: blue; transition: background-color 0.3s ease-in-out 0.2s; } .element:hover { background-color: red; } 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html139/270 In this updated example, the transition will start with a delay of 0.2 seconds and have an ease- in-out timing function, creating a smoother effect. Timing Functions The timing function can be one of the following values: linear : The transition has a constant speed. ease : The transition starts slowly, accelerates in the middle, and slows down at the end. ease-in : The transition starts slowly and accelerates towards the end. ease-out : The transition starts quickly and slows down towards the end. ease-in-out : The transition starts slowly, accelerates in the middle, and slows down at the end. cubic-bezier(n,n,n,n) : A custom timing function defined by four values. Delays The delay property allows you to specify a delay before the transition starts. This can be useful for creating more complex animations where different elements transition at different times. In this example, the transition will start 0.2 seconds after the hover event is triggered. Multiple Properties You can also transition multiple properties at once by separating them with commas: .element { background-color: blue; transition: background-color 0.3s ease-in-out 0.2s; } .element:hover { background-color: red; } 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html140/270 In this example, both the background color and width of the element will transition when the user hovers over it. The background color will transition over 0.3 seconds, while the width will transition over 0.5 seconds. Transition Shorthand The transition property is a shorthand for four other properties: transition-property : Specifies the name of the CSS property to which the transition is applied. transition-duration : Specifies the duration of the transition. transition-timing-function : Specifies the timing function of the transition. transition-delay : Specifies the delay before the transition starts. You can use these properties individually or combine them using the shorthand syntax: .element { background-color: blue; width: 100px; transition: background-color 0.3s, width 0.5s; } .element:hover { background-color: red; width: 200px; } .element { background-color: blue; transition: background-color 0.3s ease-in-out 0.2s; } 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html141/270 Practical Examples Opacity Transition In this example, the opacity of the element will transition from fully opaque to half-transparent over 0.5 seconds when the user hovers over it. Transform Transition In this example, the element will scale up by 1.5 times its original size over 0.3 seconds when the user hovers over it. Combining Transitions with Media Queries Transitions can be combined with media queries to create responsive animations that adapt to different screen sizes: .element { opacity: 1; transition: opacity 0.5s ease-in-out; } .element:hover { opacity: 0.5; } .element { transform: scale(1); transition: transform 0.3s ease-in-out; } .element:hover { transform: scale(1.5); } 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html142/270 In this example, the background color of the element will transition to green on smaller screens and to red on larger screens when the user hovers over it. Conclusion Transitions are a powerful tool in CSS that can greatly enhance the user experience of your website or application. By experimenting with different properties, durations, timing functions, and delays, you can create a wide range of visual effects that make your user interface more dynamic and engaging. Remember to combine transitions with other CSS features like pseudo- classes and media queries to create complex and responsive animations. @media (max-width: 600px) { .element { background-color: blue; transition: background-color 0.3s ease-in-out; } .element:hover { background-color: green; } } @media (min-width: 601px) { .element { background-color: blue; transition: background-color 0.3s ease-in-out; } .element:hover { background-color: red; } } 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html143/270 Media Queries Media Queries in CSS are a powerful tool that allows you to apply different styles based on various conditions. They are a cornerstone of responsive web design, enabling you to create a seamless user experience across different devices and screen sizes. In this chapter, we will explore some detailed examples and additional features of media queries. Basic Examples Prefers Color Scheme The prefers-color-scheme media feature allows you to target devices that have a specific color scheme preference. For instance, you can apply different styles for devices that prefer a light or dark color scheme. Here's an example: Orientation You can also use media queries to apply styles based on the orientation of the device. For example, you can change the layout depending on whether the device is in landscape or portrait mode: @media (prefers-color-scheme: dark) { body { background-color: #000; /\* Set background to black for dark mode \*/ color: #fff; /\* Set text color to white for dark mode \*/ } } 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html144/270 Screen Width Another common use of media queries is to apply styles based on the width of the screen. This is particularly useful for creating responsive designs that adapt to different screen sizes: Resolution You can target devices with high-resolution screens using the min-resolution media feature. This is useful for serving high-resolution images to devices that can display them: Aspect Ratio Media queries can also be used to apply styles based on the aspect ratio of the device. This can help you create layouts that look good on both wide and narrow screens: @media (orientation: landscape) { body { display: flex; flex-direction: row; } } @media (orientation: portrait) { body { display: flex; flex-direction: column; } } @media (max-width: 600px) { body { font-size: 14px; } } @media (min-resolution: 2dppx) { img { content: url(high-res-image.png); } } 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html145/270 Hover and Pointer You can use media queries to apply styles based on the user's input method. For example, you can change the appearance of links when the user hovers over them with a mouse: Display Mode The display-mode media feature allows you to apply styles based on the display mode of the application. For example, you can create a full-screen layout for applications running in full- screen mode: @media (min-aspect-ratio: 16/9) { .container { width: 80%; } } @media (max-aspect-ratio: 4/3) { .container { width: 100%; } } @media (hover: hover) { a:hover { text-decoration: underline; } } @media (pointer: fine) { button { padding: 10px 20px; } } @media (display-mode: fullscreen) { .fullscreen { width: 100vw; height: 100vh; } } 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html146/270 Combining Media Features You can combine multiple media features to create more specific styles. For example, you can apply styles for devices that have a minimum width of 600px and prefer a dark color scheme: By using media queries, you can create a responsive design that adapts to different devices and user preferences, providing a better user experience. @media (min-width: 600px) and (prefers-color-scheme: dark) { body { background-color: #333; color: #ccc; } } 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html147/270 Learning To Code JavaScript 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html148/270 Variables Variables in JavaScript are fundamental for storing and manipulating data. Think of them as containers that hold values, which can be of various types such as numbers, strings, booleans, or objects. Understanding how to declare and use variables effectively is crucial for writing robust JavaScript code. Declaring Variables In JavaScript, you can declare variables using the var , let , or const keywords. Each keyword has its own characteristics and specific use cases. Using var The var keyword declares variables with function scope. Variables declared with var are hoisted to the top of their containing function, meaning they can be used before they are declared. However, this can sometimes lead to unexpected behavior and bugs. Using let The let keyword declares variables with block scope. Unlike var , variables declared with let are not hoisted and are only accessible within the block they are defined in. This makes let a better choice for most use cases compared to var . Using const The const keyword declares variables that cannot be reassigned. Similar to let , const also has block scope. However, the value of a const variable can still be mutated if it is an object or an array. var age = 25; console.log(age); // Output: 25 let name = "John"; console.log(name); // Output: John 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html149/270 Initializing Variables You can declare a variable without assigning a value to it. In this case, the variable will have the value undefined . To assign a value to a variable, use the assignment operator ( = ). Using Variables Variables can be used in expressions and combined with operators to perform calculations or manipulate data. Best Practices Use meaningful names: Choose descriptive names for your variables to make your code more readable and maintainable. Declare variables at the top: Declare variables at the top of their scope to avoid unexpected behavior. Prefer let and const over var : Use let and const instead of var to avoid issues with variable hoisting and scope. const PI = 3.14; console.log(PI); // Output: 3.14 let x; console.log(x); // Output: undefined let message = "Hello, world!"; console.log(message); // Output: Hello, world! let num1 = 10; let num2 = 5; let sum = num1 + num2; console.log(sum); // Output: 15 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html150/270 By following these best practices and understanding the differences between var , let , and const , you can write more robust and maintainable JavaScript code. 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html151/270 Operators Operators in JavaScript are fundamental tools that allow developers to perform various operations on values or variables. They are essential for manipulating data and performing calculations, making them a cornerstone of any JavaScript program. JavaScript offers a wide range of operators, each serving a specific purpose. Let's explore these operators in detail: Arithmetic Operators Arithmetic operators are used to perform mathematical calculations. Here are the primary arithmetic operators in JavaScript: Addition (+): This operator adds two operands. For example, a + b will yield the sum of a and b . Subtraction (-): This operator subtracts the second operand from the first. For instance, a - b will give the difference between a and b . Multiplication (\*): This operator multiplies two operands. For example, a \* b results in the product of a and b . Division (/): This operator divides the first operand by the second. For instance, a / b will yield the quotient of a divided by b . Modulus (%): This operator returns the remainder of the division of two operands. For example, a % b gives the remainder when a is divided by b . Exponentiation ()\*\*: This operator raises the first operand to the power of the second operand. For instance, a \*\* b results in a raised to the power of b . Assignment Operators Assignment operators are used to assign values to variables. Here are some common assignment operators: Assignment (=): This operator assigns the value of the right operand to the left operand. For example, a = b assigns the value of b to a . Addition Assignment (+=): This operator adds the right operand to the left operand and assigns the result to the left operand. For instance, a += b is equivalent to a = a + b . 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html152/270 Subtraction Assignment (-=): This operator subtracts the right operand from the left operand and assigns the result to the left operand. For example, a -= b is equivalent to a = a - b . Multiplication Assignment (\*=): This operator multiplies the left operand by the right operand and assigns the result to the left operand. For instance, a \*= b is equivalent to a = a \* b . Division Assignment (/=): This operator divides the left operand by the right operand and assigns the result to the left operand. For example, a /= b is equivalent to a = a / b . Modulus Assignment (%=): This operator takes the modulus using two operands and assigns the result to the left operand. For instance, a %= b is equivalent to a = a % b . Comparison Operators Comparison operators compare two values and return a boolean result. Here are some common comparison operators: Equality (==): This operator checks if two values are equal. For example, a == b returns true if a and b are equal. Strict Equality (===): This operator checks if two values are equal and of the same type. For instance, a === b returns true if a and b are equal and of the same type. Inequality (!=): This operator checks if two values are not equal. For example, a != b returns true if a and b are not equal. Strict Inequality (!==): This operator checks if two values are not equal or not of the same type. For instance, a !== b returns true if a and b are not equal or not of the same type. Greater Than (>): This operator checks if the left operand is greater than the right operand. For example, a > b returns true if a is greater than b . Greater Than or Equal (>=): This operator checks if the left operand is greater than or equal to the right operand. For instance, a >= b returns true if a is greater than or equal to b . Less Than (<): This operator checks if the left operand is less than the right operand. For example, a < b returns true if a is less than b . Less Than or Equal (<=): This operator checks if the left operand is less than or equal to the right operand. For instance, a <= b returns true if a is less than or equal to b . 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html153/270 Logical Operators Logical operators are used to combine or negate boolean values. Here are the primary logical operators in JavaScript: Logical AND (&&): This operator returns true if both operands are true. For example, a && b returns true if both a and b are true. Logical OR (||): This operator returns true if at least one of the operands is true. For instance, a || b returns true if either a or b is true. Logical NOT (!): This operator returns true if the operand is false. For example, !a returns true if a is false. Bitwise Operators Bitwise operators perform operations on binary representations of numbers. Here are some common bitwise operators: Bitwise AND (&): This operator performs a bitwise AND operation. For example, a & b performs a bitwise AND on a and b . Bitwise OR (|): This operator performs a bitwise OR operation. For instance, a | b performs a bitwise OR on a and b . Bitwise XOR (^): This operator performs a bitwise XOR operation. For example, a ^ b performs a bitwise XOR on a and b . Bitwise NOT (~): This operator performs a bitwise NOT operation. For instance, ~a inverts the bits of a . Left Shift (<<): This operator shifts the bits of the first operand to the left by the number of positions specified by the second operand. For example, a << b shifts the bits of a to the left by b positions. Right Shift (>>): This operator shifts the bits of the first operand to the right by the number of positions specified by the second operand. For instance, a >> b shifts the bits of a to the right by b positions. Unsigned Right Shift (>>>): This operator shifts the bits of the first operand to the right by the number of positions specified by the second operand, filling the leftmost bits with zeros. For example, a >>> b shifts the bits of a to the right by b positions, filling the leftmost bits with zeros. 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html154/270 Unary Operators Unary operators operate on a single operand. Here are some common unary operators: Unary Plus (+): This operator converts the operand to a number. For example, +a converts a to a number. Unary Minus (-): This operator converts the operand to a number and negates it. For instance, -a converts a to a number and negates it. Increment (++): This operator increases the operand by one. For example, a++ or ++a increases a by one. Decrement (--): This operator decreases the operand by one. For instance, a-- or --a decreases a by one. Logical NOT (!): This operator negates the boolean value of the operand. For example, !a returns true if a is false. Typeof: This operator returns the type of the operand. For instance, typeof a returns the type of a . Delete: This operator deletes a property from an object. For example, delete obj.prop deletes the property prop from the object obj . Void: This operator evaluates an expression and returns undefined . For instance, void expression evaluates expression and returns undefined . Ternary Operator The ternary operator is a shorthand for an if-else statement. It takes three operands and returns a value based on a condition. The syntax is condition ? expression1 : expression2 . For example, a > b ? 'a is greater' : 'b is greater or equal' returns 'a is greater' if a is greater than b , otherwise it returns 'b is greater or equal' . These are just a few examples of the operators available in JavaScript. Understanding and using operators effectively is crucial for writing efficient and concise code. 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html155/270 Conditions Conditions in JavaScript allow you to control the flow of your code based on certain criteria being met. They are essential for creating dynamic and interactive applications. In this chapter, we will delve into the different types of conditions and how to use them effectively. If Statement The if statement is the most fundamental type of condition in JavaScript. It enables you to execute a block of code only if a specified condition evaluates to true. The syntax is straightforward: Example: Consider a scenario where you want to check if a person is an adult: If-Else Statement The if-else statement builds upon the if statement by providing an alternative block of code to execute if the condition is false. This is how it looks: Example: Let's modify our previous example to handle both adults and minors: if (condition) { // code to be executed if the condition is true } let age = 18; if (age >= 18) { console.log("You are an adult."); } if (condition) { // code to be executed if the condition is true } else { // code to be executed if the condition is false } 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html156/270 Else-If Statement The else-if statement allows you to check multiple conditions and execute different blocks of code based on the results. It can be used in conjunction with if and if-else statements. The syntax is as follows: Example: Imagine you are grading a test and want to assign a letter grade based on the score: Switch Statement The switch statement offers an alternative way to handle multiple conditions. It allows you to specify different cases and execute code based on the value of an expression. Here is the syntax: let age = 16; if (age >= 18) { console.log("You are an adult."); } else { console.log("You are a minor."); } if (condition1) { // code to be executed if condition1 is true } else if (condition2) { // code to be executed if condition2 is true } else { // code to be executed if all conditions are false } let score = 85; if (score >= 90) { console.log("Grade: A"); } else if (score >= 80) { console.log("Grade: B"); } else if (score >= 70) { console.log("Grade: C"); } else { console.log("Grade: F"); } 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html157/270 Example: Let's use a switch statement to print the name of the day based on a numeric value: Ternary Operator The ternary operator is a concise way to write simple conditions in JavaScript. It allows you to assign a value to a variable based on a condition. The syntax is: Example: Here's how you can use the ternary operator to determine if someone is an adult or a minor: switch (expression) { case value1: // code to be executed if expression matches value1 break; case value2: // code to be executed if expression matches value2 break; default: // code to be executed if expression doesn't match any case } let day = 3; switch (day) { case 1: console.log("Monday"); break; case 2: console.log("Tuesday"); break; case 3: console.log("Wednesday"); break; default: console.log("Another day"); } variable = (condition) ? value1 : value2; let age = 20; let status = (age >= 18) ? "adult" : "minor"; console.log(status); // Output: adult 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html158/270 Logical Operators Logical operators are often used to combine multiple conditions. The most common logical operators are && (AND), || (OR), and ! (NOT). Example: Consider a scenario where you want to check if a person is allowed entry based on their age and whether they have an ID: By mastering these conditional statements, you will be able to create more powerful and flexible JavaScript code. Use them wisely to control the flow of your applications and handle different scenarios effectively. let age = 25; let hasID = true; if (age >= 18 && hasID) { console.log("Entry allowed."); } else { console.log("Entry denied."); } 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html159/270 Loops Loops are an essential part of JavaScript programming. They allow you to repeat a block of code multiple times, making it easier to perform repetitive tasks or iterate over collections of data. There are several types of loops in JavaScript, including the for loop, while loop, and do- while loop. For Loop The for loop is a fundamental construct in JavaScript, particularly useful when the number of iterations is predetermined. It comprises three main components: initialization, condition, and increment/decrement. Consider the following example: In this snippet, the loop executes the code block as long as the condition i < 5 holds true. The variable i is incremented by 1 after each iteration. Detailed Breakdown Initialization: let i = 0; - This segment runs once before the loop commences, initializing the loop counter variable. Condition: i < 5; - This expression is evaluated before each iteration. If it returns true , the loop body executes; if false , the loop terminates. Increment/Decrement: i++ - This part executes after each iteration of the loop body, updating the loop counter. While Loop The while loop is ideal when the number of iterations is not known beforehand but is governed by a condition. Here's an illustrative example: for (let i = 0; i < 5; i++) { console.log(i); } 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html160/270 In this case, the loop continues to execute the code block as long as the condition i < 5 remains true. The variable i is incremented by 1 within the loop. Detailed Breakdown Initialization: let i = 0; - The loop counter is initialized before the loop begins. Condition: i < 5 - This expression is evaluated before each iteration. If it evaluates to true , the loop body executes; if false , the loop stops. Increment/Decrement: i++ - This part runs within the loop body, updating the loop counter. Do-While Loop The do-while loop is akin to the while loop but with a key difference: it ensures that the code block is executed at least once before the condition is checked. Here's an example: In this example, the code block executes first, and then the condition i < 5 is evaluated. If the condition is true, the loop continues to execute. Detailed Breakdown Initialization: let i = 0; - The loop counter is initialized before the loop starts. Loop Body: console.log(i); i++; - This part runs at least once before the condition is checked. Condition: i < 5 - This expression is evaluated after each iteration. If it evaluates to true , the loop body executes again; if false , the loop stops. let i = 0; while (i < 5) { console.log(i); i++; } let i = 0; do { console.log(i); i++; } while (i < 5); 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html161/270 Practical Use Cases For Loop: Ideal for iterating over arrays or when the number of iterations is known. While Loop: Useful for reading data from a source until a condition is met. Do-While Loop: Suitable for scenarios where the loop body must execute at least once, such as user input validation. These basic loop structures in JavaScript provide powerful mechanisms to iterate over data and perform repetitive tasks. Experimenting with different loop types will help you become more adept at using them effectively. 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html162/270 Functions Functions in JavaScript are an essential part of the language, allowing you to encapsulate reusable blocks of code and execute them whenever needed. In this chapter, we will explore the various ways you can define and use functions in JavaScript, providing you with a solid foundation to harness their power effectively. Function Declaration A function declaration defines a named function. The syntax includes the function keyword, followed by the function name, a list of parameters (enclosed in parentheses), and the function body (enclosed in curly braces). This method is straightforward and widely used. For example, consider a simple function that greets the user: Function Invocation To execute a function, you simply need to invoke it by using its name followed by a pair of parentheses. This tells JavaScript to run the code inside the function. Using our previous example, invoking the greet function would look like this: function functionName() { // code to be executed } function greet() { console.log("Hello, world!"); } functionName(); greet(); // Outputs: Hello, world! 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html163/270 Function Parameters Functions can accept parameters, which act as placeholders for values that will be passed when the function is invoked. These parameters allow you to pass data into your functions and use them within the function body. For instance, you can call the addNumbers function with two arguments: Return Statement Functions can also return values using the return statement. This allows you to get the result of a computation or perform further operations with the returned value. For example, you can capture the result of the multiplyNumbers function: Function Expressions Functions can also be assigned to variables, known as function expressions. This allows you to create anonymous functions or pass functions as arguments to other functions. You can then use the variable to invoke the function: function addNumbers(num1, num2) { return num1 + num2; } console.log(addNumbers(5, 10)); // Outputs: 15 function multiplyNumbers(num1, num2) { return num1 \* num2; } console.log(multiplyNumbers(5, 10)); // Outputs: 50 const multiply = function(num1, num2) { return num1 \* num2; }; 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html164/270 Arrow Functions (ES6) Arrow functions provide a more concise syntax for writing functions. They are especially useful for one-liner functions and do not have their own this context, which makes them particularly useful in certain situations. For example, using an arrow function: Default Parameters (ES6) You can set default values for parameters in functions. If no argument is provided for a parameter with a default value, the default value will be used. For instance, calling the greet function without an argument: Rest Parameters (ES6) Rest parameters allow you to represent an indefinite number of arguments as an array. This is useful when you want to work with a variable number of parameters. console.log(multiply(5, 10)); // Outputs: 50 const multiply = (num1, num2) => num1 \* num2; console.log(multiply(5, 10)); // Outputs: 50 function greet(name = "Guest") { console.log(\`Hello, ${name}!\`); } greet(); // Outputs: Hello, Guest! greet("Alice"); // Outputs: Hello, Alice! function sum(...numbers) { return numbers.reduce((total, num) => total + num, 0); } 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html165/270 For example, summing multiple numbers: Higher-Order Functions Functions that operate on other functions, either by taking them as arguments or by returning them, are called higher-order functions. These functions are a powerful feature of JavaScript, enabling you to write more abstract and flexible code. For instance, using a higher-order function to add numbers: In conclusion, functions are powerful tools in JavaScript that enable code reuse and modularization. By understanding and utilizing the different types of functions and their features, you can write more efficient and maintainable code. console.log(sum(1, 2, 3, 4)); // Outputs: 10 function applyOperation(num1, num2, operation) { return operation(num1, num2); } const add = (a, b) => a + b; console.log(applyOperation(5, 10, add)); // Outputs: 15 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html166/270 Events Events in JavaScript are the cornerstone of creating interactive and dynamic web applications. They allow developers to respond to user actions or other occurrences within the application, making the web experience more engaging and responsive. Adding Event Listeners To harness the power of events, JavaScript provides the addEventListener method. This method enables you to attach event handlers to specific elements, allowing you to define what should happen when an event occurs. The addEventListener method requires two arguments: the event type and the event handler function. For instance, to listen for a click event on a button with the id "myButton", you can use the following code: Inline Event Handlers Another way to handle events is by using inline event handlers directly within your HTML markup. This approach involves adding event attributes to HTML elements. For example, to execute a function when a button is clicked, you can write: While inline event handlers are straightforward and easy to implement, they are generally discouraged for larger applications due to potential maintainability issues and the lack of separation between HTML and JavaScript. Types of Events JavaScript supports a diverse range of events, each corresponding to different user interactions or browser actions. Some common types of events include: const button = document.getElementById("myButton"); button.addEventListener("click", function() { // Your code here }); <button onclick="myFunction()">Click me</button> 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html167/270 Mouse Events: click , dblclick , mousedown , mouseup , mouseover , mouseout , mousemove Keyboard Events: keydown , keypress , keyup Form Events: submit , change , focus , blur Window Events: load , resize , scroll , unload For a comprehensive list of events, refer to the MDN Web Docs documentation. Event Object When an event is triggered, the event handler function is executed, and an event object is passed to it. This event object contains valuable information about the event and the element that triggered it. By accessing the event object, you can perform actions based on the event details, manipulate the DOM, or update your application's state. For example: Removing Event Listeners To prevent memory leaks and ensure optimal performance, it is important to remove event listeners when they are no longer needed. The removeEventListener method allows you to detach an event handler from an element. This method requires the same event type and handler function that were used with addEventListener : Event Delegation Event delegation is a powerful technique that involves adding a single event listener to a parent element to manage events for multiple child elements. This approach is particularly useful for handling events on dynamically generated content. For example: button.addEventListener("click", function(event) { console.log("Button clicked:", event.target); }); button.removeEventListener("click", handleClick); 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html168/270 Understanding and effectively utilizing events in JavaScript is crucial for creating interactive and user-friendly web applications. By mastering event handling techniques, you can significantly enhance the user experience and add a layer of interactivity to your projects. Whether you are dealing with simple click events or complex interactions, a solid grasp of events will empower you to build more dynamic and responsive web applications. document.getElementById("parent").addEventListener("click", function(event) { if (event.target && event.target.matches("button.classname")) { // Handle button click } }); 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html169/270 Document Object Model The Document Object Model (DOM) serves as a crucial programming interface for HTML and XML documents. It conceptualizes the structure of a web page as a tree-like structure, where each node signifies an element, attribute, or text. This abstraction allows programming languages to interact seamlessly with the page's content, structure, and style. Commonly Used Methods of the DOM 1. getElementById() The getElementById() method is designed to return the element with a specified ID. This method is one of the most frequently used for quickly accessing a single element. For instance: Use Case: This method is ideal for accessing elements with unique IDs, such as form inputs or specific sections of a page. 2. getElementsByClassName() The getElementsByClassName() method returns a collection of elements that share a specified class name. It is particularly useful for accessing multiple elements simultaneously. For example: Use Case: This method is beneficial for applying changes to a group of elements, such as styling or event handling. 3. getElementsByTagName() The getElementsByTagName() method returns a collection of elements with a specified tag name. It can be employed to access all elements of a particular type. For instance: const element = document.getElementById('myElement'); const elements = document.getElementsByClassName('myClass'); 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html170/270 Use Case: This method is useful for iterating over all elements of a specific type, such as all <div> or <p> tags. 4. querySelector() The querySelector() method returns the first element that matches a specified CSS selector. It provides a powerful way to access elements using CSS selectors. For example: Use Case: This method is ideal for accessing the first occurrence of an element that matches a complex CSS selector. 5. querySelectorAll() The querySelectorAll() method returns a collection of elements that match a specified CSS selector. It is similar to querySelector() but returns all matching elements. For example: Use Case: This method is useful for applying changes to all elements that match a specific CSS selector. 6. createElement() The createElement() method creates a new element with a specified tag name. It is used to dynamically create new elements. For example: Use Case: This method is essential for adding new elements to the DOM, such as creating new content or UI components. const elements = document.getElementsByTagName('div'); const element = document.querySelector('.myClass'); const elements = document.querySelectorAll('div'); const newElement = document.createElement('div'); 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html171/270 7. appendChild() The appendChild() method appends a child element to a parent element. It is used to add new elements to the DOM. For example: Use Case: This method is useful for building up the DOM tree by adding new elements as children of existing elements. 8. removeChild() The removeChild() method removes a child element from its parent element. It is used to delete elements from the DOM. For example: Use Case: This method is useful for removing elements that are no longer needed, such as deleting items from a list. These methods represent just a few examples of the many available in the DOM. They empower developers to manipulate the structure and content of a web page dynamically, enabling the creation of interactive and responsive web applications. parentElement.appendChild(childElement); parentElement.removeChild(childElement); 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html172/270 Objects Objects in JavaScript are a fundamental data type that allows you to store and manipulate collections of key-value pairs. They are versatile and widely used in JavaScript programming. Creating Objects To create an object, you can use either the object literal syntax or the Object constructor. Let's start with the object literal syntax, which is the most common and straightforward way to create an object: In this example, person is an object with three properties: name , age , and profession . Each property has a corresponding value, making it easy to store related data together. Alternatively, you can create an object using the Object constructor. This approach is less common but can be useful in certain scenarios: Both methods achieve the same result, but the object literal syntax is generally preferred for its simplicity and readability. Accessing Properties Once you have an object, you can access its properties using either dot notation or bracket notation. Dot notation is more concise and commonly used: const person = { name: 'John', age: 30, profession: 'Developer' }; const person = new Object(); person.name = 'John'; person.age = 30; person.profession = 'Developer'; console.log(person.name); // Output: John 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html173/270 Bracket notation is useful when property names are dynamic or not valid identifiers: Modifying Properties JavaScript objects are dynamic, meaning you can add or modify properties at any time. For example, you can add a new property or update an existing one: In this example, we added a new property location and updated the age property. Deleting Properties If you need to remove a property from an object, you can use the delete operator: This will remove the profession property from the person object. Methods Objects can also have methods, which are functions stored as object properties. Methods allow objects to perform actions and can be defined using function expressions: console.log(person\['age'\]); // Output: 30 person.location = 'New York'; person.age = 31; delete person.profession; const calculator = { add: function(a, b) { return a + b; }, subtract: function(a, b) { return a - b; } }; console.log(calculator.add(5, 3)); // Output: 8 console.log(calculator.subtract(10, 4)); // Output: 6 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html174/270 In this example, calculator is an object with two methods: add and subtract . These methods can be invoked using dot notation. Nested Objects Objects can contain other objects, allowing you to create complex data structures. For example, you can represent a company with nested objects for its address: This structure allows you to organize related data in a hierarchical manner. Iterating Over Properties To iterate over an object's properties, you can use a for...in loop. This loop will log each property name and value in the person object: Object Methods JavaScript provides several built-in methods for working with objects, such as Object.keys() , Object.values() , and Object.entries() . These methods are useful for extracting and manipulating object data: const company = { name: 'Tech Corp', address: { street: '123 Main St', city: 'Techville', state: 'CA' } }; console.log(company.address.city); // Output: Techville for (let key in person) { console.log(key + ': ' + person\[key\]); } 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html175/270 Conclusion Objects in JavaScript are powerful and flexible, allowing you to represent complex data structures and behaviors. Understanding how to work with objects is essential for JavaScript developers. By mastering object creation, property manipulation, methods, and iteration, you can effectively manage and utilize data in your JavaScript applications. console.log(Object.keys(person)); // Output: \['name', 'age', 'location'\] console.log(Object.values(person)); // Output: \['John', 31, 'New York'\] console.log(Object.entries(person)); // Output: \[\['name', 'John'\], \['age', 31\], \['location', 'New York'\]\] 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html176/270 Arrays Arrays are a fundamental data structure in JavaScript, enabling you to store and manipulate collections of values efficiently. In this chapter, we will delve into the essentials of working with arrays in JavaScript, along with some advanced techniques and methods to enhance your programming skills. Creating an Array To create an array in JavaScript, you can use the array literal syntax, represented by square brackets \[\] . For instance: Alternatively, you can create an array using the Array constructor: Accessing Array Elements Accessing individual elements in an array is straightforward using their index. The index starts at 0 for the first element and increments by 1 for each subsequent element. For example: Modifying Array Elements You can modify the value of an array element by assigning a new value to its corresponding index. For example: let fruits = \['apple', 'banana', 'orange'\]; let fruits = new Array('apple', 'banana', 'orange'); let fruits = \['apple', 'banana', 'orange'\]; console.log(fruits\[0\]); // Output: 'apple' console.log(fruits\[1\]); // Output: 'banana' console.log(fruits\[2\]); // Output: 'orange' 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html177/270 Array Properties Arrays come with several properties that provide useful information. The most commonly used property is length , which returns the number of elements in the array: Array Methods JavaScript offers a variety of built-in methods to manipulate arrays. Some commonly used array methods include: push() : Adds one or more elements to the end of an array. pop() : Removes the last element from an array. shift() : Removes the first element from an array. unshift() : Adds one or more elements to the beginning of an array. splice() : Adds or removes elements from an array at a specified index. slice() : Returns a shallow copy of a portion of an array into a new array object. concat() : Merges two or more arrays into a new array. indexOf() : Returns the first index at which a given element can be found in the array. includes() : Determines whether an array includes a certain value among its entries. forEach() : Executes a provided function once for each array element. map() : Creates a new array populated with the results of calling a provided function on every element in the calling array. filter() : Creates a new array with all elements that pass the test implemented by the provided function. reduce() : Executes a reducer function on each element of the array, resulting in a single output value. Here are some examples demonstrating these methods: let fruits = \['apple', 'banana', 'orange'\]; fruits\[1\] = 'grape'; console.log(fruits); // Output: \['apple', 'grape', 'orange'\] let fruits = \['apple', 'banana', 'orange'\]; console.log(fruits.length); // Output: 3 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html178/270 Conclusion In this chapter, we covered the basics of working with arrays in JavaScript, as well as some advanced techniques and methods. Arrays are powerful tools that allow you to store and manipulate collections of values. By understanding how to create, access, and modify array elements, as well as utilize array properties and methods, you can leverage the full potential of arrays in your JavaScript programs. let fruits = \['apple', 'banana', 'orange'\]; fruits.push('grape'); console.log(fruits); // Output: \['apple', 'banana', 'orange', 'grape'\] fruits.pop(); console.log(fruits); // Output: \['apple', 'banana', 'orange'\] fruits.shift(); console.log(fruits); // Output: \['banana', 'orange'\] fruits.unshift('kiwi'); console.log(fruits); // Output: \['kiwi', 'banana', 'orange'\] fruits.splice(1, 1, 'mango'); console.log(fruits); // Output: \['kiwi', 'mango', 'orange'\] let citrus = fruits.slice(1, 2); console.log(citrus); // Output: \['mango'\] let moreFruits = fruits.concat(\['lemon', 'lime'\]); console.log(moreFruits); // Output: \['kiwi', 'mango', 'orange', 'lemon', 'lime'\] console.log(fruits.indexOf('mango')); // Output: 1 console.log(fruits.includes('banana')); // Output: false fruits.forEach(fruit => console.log(fruit)); // Output: 'kiwi', 'mango', 'orange' let upperCaseFruits = fruits.map(fruit => fruit.toUpperCase()); console.log(upperCaseFruits); // Output: \['KIWI', 'MANGO', 'ORANGE'\] let filteredFruits = fruits.filter(fruit => fruit.startsWith('o')); console.log(filteredFruits); // Output: \['orange'\] let totalLength = fruits.reduce((total, fruit) => total + fruit.length, 0); console.log(totalLength); // Output: 15 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html179/270 Strings Strings in JavaScript are sequences of characters enclosed in single quotes ( ' ) or double quotes ( " ). They are used to represent text and are one of the fundamental data types in the language. Immutability In JavaScript, strings are immutable, which means that once a string is created, it cannot be changed. However, you can create new strings based on operations performed on existing ones. This immutability ensures that strings remain consistent and prevents unintended side effects. Common Operations Concatenation Concatenation is the process of joining two or more strings together. In JavaScript, this is typically done using the + operator: String Interpolation String interpolation allows you to embed expressions within a string using template literals, which are enclosed in backticks ( \` ). This feature makes it easier to construct strings dynamically: let greeting = 'Hello, ' + 'world!'; let name = 'Alice'; let greeting = \`Hello, ${name}!\`; 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html180/270 Accessing Characters You can access individual characters in a string using bracket notation, where the index starts at 0: Built-in Methods JavaScript provides a rich set of built-in methods for working with strings. Some of the most commonly used methods include: Finding the length of a string: Use the length property to get the number of characters in a string. Changing case: Convert a string to uppercase or lowercase using toUpperCase() and toLowerCase() . Searching for a substring: Use indexOf() to find the position of a substring within a string. Extracting a substring: Use substring() , substr() , or slice() to extract parts of a string. let myString = 'Hello'; let firstChar = myString\[0\]; // 'H' let myString = 'Hello'; let length = myString.length; // 5 let myString = 'Hello'; let upper = myString.toUpperCase(); // 'HELLO' let lower = myString.toLowerCase(); // 'hello' let myString = 'Hello, world!'; let position = myString.indexOf('world'); // 7 let myString = 'Hello, world!'; let sub = myString.substring(0, 5); // 'Hello' 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html181/270 Unicode Support JavaScript supports Unicode characters, allowing you to use characters from different languages and scripts in your strings. This is particularly useful for internationalization and working with diverse datasets. Escape Sequences Escape sequences are used to represent special characters within strings. Common escape sequences include: Newline: \\n Tab: \\t Backslash: \\\\ Single quote: \\' Double quote: \\" Strings are a crucial part of JavaScript programming. Understanding how to work with them effectively is essential for building robust and dynamic applications. By mastering string operations and methods, you can manipulate and extract information from text efficiently, making your code more powerful and versatile. let multiline = 'This is line one.\\nThis is line two.'; 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html182/270 Numbers in JavaScript Numbers are a fundamental data type in JavaScript, essential for representing numeric values. JavaScript supports both integers and floating-point numbers, which are stored as 64-bit double-precision IEEE 754 values. This chapter will delve into the various aspects of working with numbers in JavaScript, including declaring variables, performing arithmetic operations, utilizing mathematical functions, converting between types, and handling edge cases. Declaring Number Variables To declare a number variable in JavaScript, you can use the let or const keyword followed by the variable name and an assignment operator. For example: Here, age is a variable that can be reassigned, while pi is a constant that cannot be changed once assigned. Arithmetic Operators JavaScript provides a variety of arithmetic operators that can be used with numbers. These include addition ( + ), subtraction ( - ), multiplication ( \* ), division ( / ), and modulus ( % ). Consider the following example: These operators allow you to perform basic mathematical operations on numeric values. let age = 25; const pi = 3.14; let x = 10; let y = 5; let sum = x + y; // 15 let difference = x - y; // 5 let product = x \* y; // 50 let quotient = x / y; // 2 let remainder = x % y; // 0 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html183/270 Mathematical Functions JavaScript also supports a variety of mathematical functions that can be used with numbers. Some of the most commonly used functions include: Math.sqrt() : Calculates the square root of a number. Math.pow() : Performs exponentiation. Math.random() : Generates a random number between 0 and 1. Here are some examples: These functions provide additional capabilities for performing complex mathematical calculations. Number Conversion In JavaScript, numbers can be converted to strings using the toString() method, and strings can be converted to numbers using the parseInt() or parseFloat() functions. For example: These conversion methods are useful when you need to switch between numeric and string representations of data. Handling Edge Cases When working with numbers in JavaScript, it's important to handle edge cases such as: NaN (Not-a-Number): This value is returned when a mathematical operation fails (e.g., parseInt("abc") ). Infinity: This value is returned when a number exceeds the upper limit of the floating- point range (e.g., 1 / 0 ). let squareRoot = Math.sqrt(16); // 4 let power = Math.pow(2, 3); // 8 let random = Math.random(); // generates a random number between 0 and 1 let number = 42; let numberAsString = number.toString(); // "42" let string = "3.14"; let stringAsNumber = parseFloat(string); // 3.14 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html184/270 Precision Issues: Due to the way floating-point numbers are represented, some calculations may result in precision errors (e.g., 0.1 + 0.2 !== 0.3 ). Consider the following examples: By being aware of these edge cases and handling them appropriately, you can ensure that your code is robust and reliable. In summary, numbers in JavaScript are versatile and powerful, allowing you to perform a wide range of operations and calculations. By understanding how to declare variables, use arithmetic operators, leverage mathematical functions, convert between types, and handle edge cases, you can effectively work with numeric data in your JavaScript programs. let notANumber = parseInt("abc"); // NaN let infinity = 1 / 0; // Infinity let precisionIssue = 0.1 + 0.2; // 0.30000000000000004 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html185/270 Dates In JavaScript, dates can be represented using the Date object. This object provides various methods to work with dates and times. Creating Date Objects To create a new date object in JavaScript, you can use the new Date() constructor. By default, this will create a date object representing the current date and time. For example: This code snippet will output the current date and time when executed. You can also create a date object by passing specific values for the year, month, day, hour, minute, second, and millisecond. It's important to note that the month is zero-indexed, meaning January is represented by 0, February by 1, and so on. Here's an example: In this example, the date object represents January 1, 2022, at 12:00:00 PM. Common Operations Once you have a date object, you can perform various operations on it. Let's explore some common operations you might find useful. Getting Date and Time Components You can extract different components of the date and time using various methods provided by the Date object. For instance: const currentDate = new Date(); console.log(currentDate); const specificDate = new Date(2022, 0, 1, 12, 0, 0, 0); console.log(specificDate); 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html186/270 These methods allow you to retrieve the year, month, day, hour, minute, second, and millisecond from a date object. Formatting Dates Formatting dates as strings can be done using methods like toDateString() , toISOString() , and toLocaleDateString() . Here are some examples: These methods provide different formats for representing dates as strings. Arithmetic Operations You can perform arithmetic operations on dates, such as adding or subtracting days. For example, to get the date for tomorrow: This code snippet creates a new date object representing the day after the current date. Comparing Dates Comparing dates can be done using standard comparison operators. Here's an example: const year = currentDate.getFullYear(); const month = currentDate.getMonth(); // zero-indexed const day = currentDate.getDate(); const hour = currentDate.getHours(); const minute = currentDate.getMinutes(); const second = currentDate.getSeconds(); const millisecond = currentDate.getMilliseconds(); const formattedDate = currentDate.toDateString(); console.log(formattedDate); // e.g., "Mon Jan 01 2022" const isoString = currentDate.toISOString(); console.log(isoString); // e.g., "2022-01-01T12:00:00.000Z" const localeString = currentDate.toLocaleDateString(); console.log(localeString); // e.g., "1/1/2022" in the US const tomorrow = new Date(); tomorrow.setDate(currentDate.getDate() + 1); console.log(tomorrow); 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html187/270 This code compares two date objects and logs the result. Additional Methods The Date object provides many more methods and properties to work with dates and times. Some of these include: getTime() : Returns the number of milliseconds since January 1, 1970. setTime(milliseconds) : Sets the date and time by the number of milliseconds since January 1, 1970. getDay() : Returns the day of the week (0 for Sunday, 1 for Monday, etc.). toUTCString() : Converts the date to a string, using the UTC time zone. Here are some examples: These methods provide additional functionality for working with dates and times in JavaScript. The Date object is a powerful tool for handling dates and times in your applications. const date1 = new Date(2022, 0, 1); const date2 = new Date(2022, 0, 2); if (date1 < date2) { console.log("date1 is before date2"); } else if (date1 > date2) { console.log("date1 is after date2"); } else { console.log("date1 and date2 are equal"); } const timestamp = currentDate.getTime(); console.log(timestamp); const newDate = new Date(); newDate.setTime(timestamp); console.log(newDate); const dayOfWeek = currentDate.getDay(); console.log(dayOfWeek); // e.g., 0 for Sunday const utcString = currentDate.toUTCString(); console.log(utcString); // e.g., "Sat, 01 Jan 2022 12:00:00 GMT" 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html188/270 Math JavaScript provides a built-in Math object that allows you to perform various mathematical operations. Here are some commonly used methods: Commonly Used Math Methods JavaScript provides a built-in Math object that allows you to perform various mathematical operations. Here are some commonly used methods: Math.abs(x) : Returns the absolute value of x . This is useful for converting negative numbers to positive. Math.ceil(x) : Returns the smallest integer greater than or equal to x . This is useful for rounding up numbers. Math.floor(x) : Returns the largest integer less than or equal to x . This is useful for rounding down numbers. Math.round(x) : Returns the value of x rounded to the nearest integer. This is useful for standard rounding. Math.max(x, y, z, ...) : Returns the largest of the given numbers. This is useful for finding the maximum value in a list of numbers. Math.min(x, y, z, ...) : Returns the smallest of the given numbers. This is useful for finding the minimum value in a list of numbers. Math.random() : Returns a random number between 0 (inclusive) and 1 (exclusive). This is useful for generating random values. Math.pow(x, y) : Returns the value of x raised to the power of y . This is useful for exponentiation. Math.sqrt(x) : Returns the square root of x . This is useful for finding the square root of a number. Math.sin(x) , Math.cos(x) , Math.tan(x) : Returns the sine, cosine, and tangent of x (in radians). These are useful for trigonometric calculations. Math.PI : Represents the mathematical constant π (pi). This is useful for calculations involving circles. Example Usage Let's look at some examples to understand how these methods work: 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html189/270 These are just a few examples of what you can do with the Math object in JavaScript. Feel free to explore more methods and experiment with different mathematical calculations in your JavaScript code. Additional Math Methods In addition to the methods listed above, the Math object also includes other useful methods such as: Math.log(x) : Returns the natural logarithm (base e) of x . Math.exp(x) : Returns the value of e raised to the power of x . Math.log10(x) : Returns the base 10 logarithm of x . Math.log2(x) : Returns the base 2 logarithm of x . Math.cbrt(x) : Returns the cube root of x . Math.hypot(x, y, ...) : Returns the square root of the sum of squares of its arguments. const x = -5; console.log(Math.abs(x)); // Output: 5 const y = 3.7; console.log(Math.ceil(y)); // Output: 4 const z = 9.2; console.log(Math.floor(z)); // Output: 9 const a = 2.8; console.log(Math.round(a)); // Output: 3 const numbers = \[1, 5, 3, 9, 2\]; console.log(Math.max(...numbers)); // Output: 9 console.log(Math.random()); // Output: a random number between 0 and 1 console.log(Math.pow(2, 3)); // Output: 8 console.log(Math.sqrt(16)); // Output: 4 console.log(Math.sin(Math.PI / 2)); // Output: 1 console.log(Math.cos(Math.PI)); // Output: -1 console.log(Math.tan(0)); // Output: 0 console.log(Math.PI); // Output: 3.141592653589793 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html190/270 Example Usage of Additional Methods Here are some examples of these additional methods: By leveraging the Math object, you can perform a wide range of mathematical operations in your JavaScript code, making it a powerful tool for developers. console.log(Math.log(1)); // Output: 0 console.log(Math.exp(1)); // Output: 2.718281828459045 console.log(Math.log10(100)); // Output: 2 console.log(Math.log2(8)); // Output: 3 console.log(Math.cbrt(27)); // Output: 3 console.log(Math.hypot(3, 4)); // Output: 5 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html191/270 Type Conversion Type conversion in JavaScript is the process of converting one data type to another. JavaScript provides several built-in functions and operators to facilitate this. Understanding how type conversion works is crucial for writing robust and error-free code. Common Type Conversion Methods 1. String Conversion To convert a value to a string, you can use the String() function or concatenate the value with an empty string ( '' ). Alternatively: 2. Number Conversion To convert a value to a number, use the Number() function or the unary plus operator ( + ). Alternatively: let num = 42; let str = String(num); console.log(typeof str); // Output: string let num = 42; let str = num + ''; console.log(typeof str); // Output: string let str = '42'; let num = Number(str); console.log(typeof num); // Output: number let str = '42'; let num = +str; console.log(typeof num); // Output: number 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html192/270 3. Boolean Conversion JavaScript's Boolean() function converts a value to a boolean. The following values are considered falsy and convert to false : 0 , NaN , null , undefined , false , and an empty string ( '' ). All other values are truthy and convert to true . Alternatively: 4. Implicit Type Conversion JavaScript also performs implicit type conversion in certain situations. For example, using the + operator with a string and a number converts the number to a string and concatenates them. Implicit type conversion can sometimes lead to unexpected results: In the first example, the - operator converts the string '5' to a number before performing the subtraction. In the second example, the + operator concatenates the string '5' with the number 3 . let num = 0; let bool = Boolean(num); console.log(bool); // Output: false let num = 0; let bool = !!num; console.log(bool); // Output: false let num = 42; let str = 'The answer is ' + num; console.log(str); // Output: The answer is 42 console.log('5' - 3); // Output: 2 console.log('5' + 3); // Output: 53 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html193/270 Additional Type Conversion Methods 5. Parsing Integers and Floats JavaScript provides parseInt() and parseFloat() functions to convert strings to integers and floating-point numbers, respectively. 6. Date Conversion To convert a date to a number (timestamp), use the getTime() method or the unary plus operator ( + ). 7. JSON Conversion JavaScript provides JSON.stringify() to convert an object to a JSON string and JSON.parse() to convert a JSON string back to an object. Understanding these type conversion methods will help you handle data more effectively in your JavaScript programs. let str = '42.5'; let intNum = parseInt(str); let floatNum = parseFloat(str); console.log(intNum); // Output: 42 console.log(floatNum); // Output: 42.5 let date = new Date(); let timestamp = date.getTime(); console.log(timestamp); // Output: 1633024800000 (example) let timestamp2 = +date; console.log(timestamp2); // Output: 1633024800000 (example) let obj = { name: 'John', age: 30 }; let jsonString = JSON.stringify(obj); console.log(jsonString); // Output: '{"name":"John","age":30}' let parsedObj = JSON.parse(jsonString); console.log(parsedObj); // Output: { name: 'John', age: 30 } 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html194/270 Error Handling Error handling is an essential aspect of JavaScript programming. It allows developers to gracefully handle and manage errors that may occur during the execution of their code. Proper error handling ensures that your application can recover from unexpected issues and continue to function correctly. Try-Catch Blocks One common approach to error handling in JavaScript is using try-catch blocks. The try block contains the code that may potentially throw an error, while the catch block is used to handle and process the error if it occurs. By wrapping the code in a try-catch block, you can prevent the entire program from crashing and provide a fallback mechanism. Here's an example of how try-catch blocks can be used for error handling: In the above example, if an error is thrown within the try block, it will be caught by the catch block. The error object can then be accessed and processed accordingly. In this case, we simply log the error message to the console using console.error() . The Finally Block Additionally, JavaScript provides the finally block, which can be used to execute code regardless of whether an error occurred or not. This block is useful for performing cleanup tasks or releasing resources. try { // Code that may throw an error throw new Error('Something went wrong!'); } catch (error) { // Handle the error console.error(error); } 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html195/270 The finally block will always execute after the try and catch blocks, whether an error was thrown or not. This makes it an ideal place to put code that you want to run no matter what, such as closing files, stopping timers, or releasing resources. Custom Error Types JavaScript also allows you to create custom error types by extending the built-in Error class. This can be useful for creating more specific error messages and handling different types of errors in a more granular way. In this example, we define a CustomError class that extends the built-in Error class. When an instance of CustomError is thrown, it can be caught and handled specifically in the catch block. try { // Code that may throw an error throw new Error('Something went wrong!'); } catch (error) { // Handle the error console.error(error); } finally { // Cleanup or resource release console.log('Error handling complete.'); } class CustomError extends Error { constructor(message) { super(message); this.name = 'CustomError'; } } try { throw new CustomError('This is a custom error!'); } catch (error) { if (error instanceof CustomError) { console.error('Caught a custom error:', error.message); } else { console.error('Caught an error:', error.message); } } 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html196/270 Best Practices When handling errors in JavaScript, consider the following best practices: 1. Be Specific: Catch only the errors you expect and know how to handle. Avoid using generic catch-all error handling. 2. Log Errors: Always log errors to help with debugging and monitoring. Use tools like logging libraries or external services for better error tracking. 3. Graceful Degradation: Provide fallback mechanisms to ensure your application can continue to function even when an error occurs. 4. Avoid Silent Failures: Do not suppress errors without handling them. This can make debugging difficult and hide potential issues. 5. Use Custom Errors: Create custom error types for more specific error handling and better code readability. By following these practices and utilizing try-catch blocks, the finally block, and custom error types, you can effectively manage errors in your JavaScript code and build more robust applications. 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html197/270 Classes Classes are a fundamental aspect of object-oriented programming in JavaScript. They offer a structured way to define blueprints for creating objects that share common properties and methods, enhancing code organization and reusability. Defining a Class To define a class in JavaScript, you use the class keyword followed by the class name. Consider the following example: In this example, we define a Person class with a constructor method that accepts name and age as parameters. The constructor initializes these values to the object's properties. Additionally, the sayHello method logs a greeting message to the console. Creating an Instance To create an instance of a class, you use the new keyword followed by the class name and any required arguments. Here's how you can instantiate a Person object: Static Methods and Properties Classes can also have static methods and properties that are shared among all instances. These are accessed using the class name itself. For example: class Person { constructor(name, age) { this.name = name; this.age = age; } sayHello() { console.log(\`Hello, my name is ${this.name} and I'm ${this.age} years old.\`); } } const john = new Person('John Doe', 25); john.sayHello(); // Output: Hello, my name is John Doe and I'm 25 years old. 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html198/270 In this example, the Circle class has a static property PI and a static method calculateArea . The static method can be invoked directly on the class without needing an instance. Inheritance JavaScript classes support inheritance, allowing you to create subclasses that inherit properties and methods from a parent class. This is achieved using the extends keyword. Consider the following example: In this example, the Animal class has a speak method. The Dog class extends Animal and overrides the speak method to provide a specific implementation. class Circle { static PI = 3.14159; static calculateArea(radius) { return Circle.PI \* radius \* radius; } } console.log(Circle.calculateArea(5)); // Output: 78.53975 class Animal { constructor(name) { this.name = name; } speak() { console.log(\`${this.name} makes a sound.\`); } } class Dog extends Animal { speak() { console.log(\`${this.name} barks.\`); } } const dog = new Dog('Buddy'); dog.speak(); // Output: Buddy barks. 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html199/270 Private Fields and Methods JavaScript supports private fields and methods, which are not accessible outside the class. Private fields are declared using the # prefix. For example: In this example, the #engineStatus field is private and can only be accessed within the Car class. Getters and Setters Getters and setters allow you to define methods that are accessed like properties. They are useful for controlling access to an object's properties. For example: class Car { #engineStatus = 'off'; startEngine() { this.#engineStatus = 'on'; console.log('Engine started.'); } getEngineStatus() { return this.#engineStatus; } } const car = new Car(); car.startEngine(); // Output: Engine started. console.log(car.getEngineStatus()); // Output: on class Rectangle { constructor(width, height) { this.width = width; this.height = height; } get area() { return this.width \* this.height; } set area(value) { throw new Error('Area is a read-only property.'); } } const rect = new Rectangle(10, 5); console.log(rect.area); // Output: 50 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html200/270 In this example, the area getter calculates the rectangle's area, and the setter throws an error if someone tries to set the area directly. Classes in JavaScript provide a powerful way to organize and structure your code, making it easier to manage objects and their behaviors. 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html201/270 Rust 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html202/270 Variables and Mutability In Rust, variables are declared using the let keyword. By default, variables are immutable, meaning their values cannot be changed once assigned. However, you can make a variable mutable by using the mut keyword. Here's an example of declaring an immutable variable: And here's an example of declaring a mutable variable: With mutable variables, you can change their values later in the code: It's important to note that Rust encourages immutability by default, as it helps prevent bugs and enables better concurrency. Therefore, it's recommended to use immutable variables whenever possible and only resort to mutability when necessary. By using immutable variables, Rust ensures that you can reason about your code more easily and avoid unexpected changes to values. This helps in writing safer and more reliable programs. let x = 5; let mut y = 10; y = 20; 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html203/270 Data Types In Rust, there are several built-in data types that you can use to define variables. Here are some of the commonly used data types: Integer Types Rust provides a variety of integer types, which differ in size and signedness. Here are a few examples: i8 : Signed 8-bit integer (-128 to 127) u16 : Unsigned 16-bit integer (0 to 65,535) i32 : Signed 32-bit integer (-2,147,483,648 to 2,147,483,647) Example: Floating-Point Types Rust supports two floating-point types: f32 and f64 . The f32 type is a single-precision float, while f64 is a double-precision float. Example: Boolean Type The boolean type in Rust is bool , which can have two possible values: true or false . Example: let age: u8 = 25; let count: i32 = -10; let pi: f32 = 3.14; let gravity: f64 = 9.8; let is\_rust\_fun: bool = true; let is\_python\_fun: bool = false; 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html204/270 Character Type The character type in Rust is char , which represents a Unicode scalar value. Example: String Type Rust has a built-in string type called String , which is a growable, UTF-8 encoded string. Example: These are just a few examples of the data types available in Rust. You can explore more data types and their usage in the Rust documentation. let heart\_emoji: char = '❤'; let smiley\_emoji: char = ''; let greeting: String = String::from("Hello, world!"); let name: String = "Alice".to\_string(); 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html205/270 Functions Functions in Rust allow you to encapsulate a block of code that can be reused and called multiple times. They are defined using the fn keyword followed by the function name, optional parameters, and a return type. Here's an example of a simple function in Rust: In this example, the greet function takes a parameter name of type &str (a string slice) and prints a greeting message using the println! macro. You can call the greet function like this: This will output: Functions can also have a return type. Here's an example of a function that calculates the sum of two numbers and returns the result: In this example, the add function takes two parameters a and b of type i32 (32-bit signed integer) and returns the sum of a and b . You can call the add function and store the result in a variable like this: This will output: fn greet(name: &str) { println!("Hello, {}!", name); } greet("Alice"); Hello, Alice! fn add(a: i32, b: i32) -> i32 { a + b } let result = add(3, 5); println!("The sum is: {}", result); The sum is: 8 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html206/270 Functions in Rust can also have default parameter values, variable-length arguments, and closures. You can explore these advanced topics in the Rust documentation. Remember to always define your functions before calling them in your code. 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html207/270 Comments Comments in Rust are used to add explanatory or descriptive text within your code. They are ignored by the compiler and have no impact on the execution of the program. There are two types of comments in Rust: single-line comments and multi-line comments. Single-line comments start with // and continue until the end of the line. They are commonly used for short explanations or clarifications. Here's an example: Multi-line comments start with /\* and end with \*/ . They can span multiple lines and are useful for longer explanations or commenting out blocks of code. Here's an example: Remember to use comments to make your code more readable and understandable for yourself and others who may read your code. // This is a single-line comment let x = 5; // Assigning the value 5 to variable x /\* This is a multi-line comment. It can span multiple lines. \*/ /\* fn some\_function() { // This code is commented out // It won't be executed } \*/ 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html208/270 Control Flow Control flow in Rust allows you to dictate the order in which statements and expressions are executed. It includes conditional statements, loops, and branching. Conditional statements: Rust provides the if , else if , and else keywords for conditional execution. Here's an example: Loops: Rust offers different types of loops, such as loop , while , and for . Here's an example of a for loop: Branching: Rust provides the match keyword for pattern matching and branching. Here's an example: These are just a few examples of control flow in Rust. You can explore more advanced concepts like if let and while let for more specific scenarios. let number = 7; if number < 5 { println!("Number is less than 5"); } else if number == 5 { println!("Number is equal to 5"); } else { println!("Number is greater than 5"); } let numbers = \[1, 2, 3, 4, 5\]; for number in numbers.iter() { println!("Number: {}", number); } let fruit = "apple"; match fruit { "apple" => println!("It's an apple"), "banana" => println!("It's a banana"), \_ => println!("It's something else"), } 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html209/270 Ownership In Rust, ownership is a unique feature that helps ensure memory safety and prevent data races. It is a key concept that sets Rust apart from other programming languages. Ownership Rules 1. Each value in Rust has a variable that is its owner. 2. There can only be one owner at a time. 3. When the owner goes out of scope, the value is dropped. Borrowing To allow multiple references to a value without taking ownership, Rust introduces the concept of borrowing. Borrowing can be done through references, which are pointers to a value. Ownership Transfer Ownership can be transferred using the move keyword. This is useful when you want to transfer ownership of a value to a different scope. fn main() { let s = String::from("Hello, world!"); // Borrowing the value using a reference let len = calculate\_length(&s); println!("The length of '{}' is {}.", s, len); } fn calculate\_length(s: &String) -> usize { s.len() } 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html210/270 Ownership and Functions When a value is passed to a function, ownership is transferred unless the value is borrowed using references. Conclusion Understanding ownership is crucial in Rust programming. It allows for safe and efficient memory management, preventing common issues like dangling pointers and data races. fn main() { let s1 = String::from("Hello"); let s2 = take\_ownership(s1); println!("{}", s2); } fn take\_ownership(s: String) -> String { s } 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html211/270 The Slice Type The slice type in Rust allows you to reference a contiguous sequence of elements in a collection. It is represented by the &\[T\] type, where T is the type of the elements in the slice. Slices are commonly used to work with arrays, vectors, and other collections. They provide a flexible and efficient way to access and manipulate subsets of data without needing to copy the entire collection. Here are a few examples of using slices in Rust: 1. Creating a slice from an array: 2. Passing a slice as a function parameter: 3. Modifying a slice: Slices provide a convenient way to work with subsets of data in Rust, allowing you to avoid unnecessary copying and improve performance. let numbers = \[1, 2, 3, 4, 5\]; let slice = &numbers\[1..4\]; // creates a slice containing elements 2, 3, and 4 fn sum(numbers: &\[i32\]) -> i32 { let mut total = 0; for &num in numbers { total += num; } total } let numbers = \[1, 2, 3, 4, 5\]; let result = sum(&numbers); // pass a slice of the array to the function let mut numbers = \[1, 2, 3, 4, 5\]; let slice = &mut numbers\[1..4\]; // creates a mutable slice slice\[0\] = 10; // modifies the second element of the slice assert\_eq!(numbers, \[1, 10, 3, 4, 5\]); // original array is modified 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html212/270 Structures Structs in Rust are a way to define custom data types that can hold multiple values of different types. They are similar to structs in other programming languages like C or C++. Here's an example of how to define a struct in Rust: In the above example, we define a struct called Person with three fields: name of type String , age of type u32 (unsigned 32-bit integer), and is\_student of type bool . You can create an instance of the Person struct and access its fields like this: Structs can also have methods associated with them using the impl keyword. Here's an example: struct Person { name: String, age: u32, is\_student: bool, } let person = Person { name: String::from("John Doe"), age: 25, is\_student: true, }; println!("Name: {}", person.name); println!("Age: {}", person.age); println!("Is Student: {}", person.is\_student); impl Person { fn introduce(&self) { println!("Hi, my name is {} and I'm {} years old.", self.name, self.age); } } let person = Person { name: String::from("John Doe"), age: 25, is\_student: true, }; person.introduce(); 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html213/270 In the above example, we define an impl block for the Person struct and define a method called introduce that takes a reference to self (the instance of the struct) and prints a message introducing the person. Structs in Rust are a powerful way to organize and manipulate data. They provide a flexible and efficient way to define custom data types with their own fields and methods. 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html214/270 Enumerations Enums in Rust are a powerful feature that allow you to define a type by enumerating its possible values. They are useful for representing a fixed set of options or states. Here's an example of how to define an enum in Rust: In this example, we define an enum called Color with three possible values: Red , Green , and Blue . Each value is treated as a distinct variant of the Color enum. Enums can also have associated data. For example, let's say we want to represent different types of messages: In this case, the Move variant has associated data of type x: i32 and y: i32 , the Write variant has associated data of type String , and the ChangeColor variant has associated data of type Color . Enums can be used in pattern matching to handle different cases. Here's an example: In this example, the process\_message function takes a Message enum as an argument and uses pattern matching to handle each variant accordingly. enum Color { Red, Green, Blue, } enum Message { Quit, Move { x: i32, y: i32 }, Write(String), ChangeColor(Color), } fn process\_message(message: Message) { match message { Message::Quit => println!("Received Quit message"), Message::Move { x, y } => println!("Received Move message: x={}, y={}", x, y), Message::Write(text) => println!("Received Write message: {}", text), Message::ChangeColor(color) => println!("Received ChangeColor message: {:?}", color), } } 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html215/270 Enums in Rust provide a flexible and expressive way to define and work with different types of data. They are a fundamental concept in the language and are widely used in Rust codebases. 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html216/270 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html217/270 Creating A New Package To create a new package with Cargo, you can use the following command: This will create a new directory called "my-package" with the basic structure for a Rust package. You can replace "my-package" with the desired name for your package. Once the package is created, you can navigate into the directory using: Inside the package directory, you will find a "src" directory where you can place your Rust source code files. By convention, the entry point of your package is usually a file called "main.rs" located in the "src" directory. To build and run your package, you can use the following command: This will compile and execute your package. If your package has a "main.rs" file, it will be executed as the entry point. You can also build your package without running it using: This will compile your package and generate the executable file in the "target/debug" directory. To include dependencies in your package, you can specify them in the "Cargo.toml" file. For example, to include the "rand" crate, you can add the following line under the "\[dependencies\]" section: After adding the dependency, you can use it in your code by adding an import statement at the top of your source code file. That's it! You have now created a new package with Cargo and learned how to build, run, and include dependencies in it. cargo new my-package cd my-package cargo run cargo build rand = "0.8.4" 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html218/270 Dependencies To edit dependencies in Cargo, you need to modify the Cargo.toml file in your Rust project. This file contains the configuration for your project's dependencies. To add a new dependency, you can use the following syntax: Replace dependency\_name with the name of the dependency you want to add, and version with the desired version number or version constraint. For example, to add the serde dependency with version 1.0 , you would write: To update an existing dependency, simply change the version number in the Cargo.toml file. After modifying the Cargo.toml file, you can run cargo build or cargo update to fetch and update the dependencies specified in the file. Remember to save the Cargo.toml file after making any changes. \[dependencies\] dependency\_name = "version" \[dependencies\] serde = "1.0" 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html219/270 Development 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html220/270 Reducing App Size In app development, reducing your application's size is crucial for performance and user experience. This chapter will guide you through various strategies to achieve a smaller app size. Remove Unnecessary Custom Fonts Custom fonts can significantly increase your application's size, especially if multiple font files are included. Consider not shipping custom fonts or using more modern alternatives. Instead, use system fonts or web-safe fonts that are already available on most devices. This approach can save a considerable amount of space. Use Modern Image Formats Older image formats such as jpeg can take up a lot of space unnecessarily. Converting your assets into more modern formats such as webp and webm can offer better compression and quality, reducing the overall size of your application. Additionally, using vector graphics (e.g., SVG) where possible is beneficial as they are resolution-independent and often smaller in size. Optimize Your Rust Configuration Enabling certain optimizations in Rust can significantly reduce your app's size. Add the following code to the bottom of your Cargo.toml file to enable these optimizations: Explanation codegen-units : Reduces the number of code generation units, allowing LLVM to perform better optimization, leading to smaller binaries and improved performance. \[profile.dev\] incremental = true # Compile your binary in smaller steps. \[profile.release\] codegen-units = 1 lto = true opt-level = "s" # Prioritizes small binary size. Use \`3\` if you prefer speed. panic = "abort" # Higher performance by disabling panic handlers. strip = true # Ensures debug symbols are removed. 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html221/270 lto (Link Time Optimization): Enables optimizations at the linking stage, significantly reducing the size of the final binary. opt-level : Controls your optimization level. For speed, set opt-level to 3 . For size, use opt-level of "s" . The "z" level is even more aggressive in reducing size but may impact performance. panic = "abort" : Configures the application to abort on panic instead of unwinding, saving space by removing the panic handling code. strip = true : Ensures that debug symbols are removed from the final binary, further reducing its size. By following these steps, you can significantly reduce the size of your Rust application, leading to faster downloads, reduced storage requirements, and improved performance. 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html222/270 Calling Rust Functions From The Frontend Tauri offers a robust system to safely call Rust functions from your frontend using commands, and an event-system for more dynamic interactions. Commands The command system in Tauri allows your web app to call Rust functions. Commands can handle arguments, return values, errors, and can be asynchronous. Basic Example To define commands, annotate functions in your src-tauri/src/lib.rs file with # \[tauri::command\] : It is important to note that Command names must be unique. Commands within lib.rs cannot be public due to glue code limitations. Creating public commands within lib.rs will result in an error. Register your commands with the builder function: Invoke the command from JavaScript: #\[tauri::command\] fn my\_custom\_command() { println!("I was invoked from JavaScript!"); } #\[cfg\_attr(mobile, tauri::mobile\_entry\_point)\] pub fn run() { tauri::Builder::default() .invoke\_handler(tauri::generate\_handler!\[my\_custom\_command\]) .run(tauri::generate\_context!()) .expect("error while running tauri application"); } 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html223/270 Commands in Separate Modules For better organization, define commands in separate modules: Commands in separate modules should be public to allow for their use within lib.rs . In lib.rs , include the module and register the commands: WASM For Rust frontends calling invoke() without arguments, adapt your code: import { invoke } from '@tauri-apps/api/core'; const invoke = window.\_\_TAURI\_\_.core.invoke; invoke('my\_custom\_command'); #\[tauri::command\] pub fn my\_custom\_command() { println!("I was invoked from JavaScript!"); } mod commands; #\[cfg\_attr(mobile, tauri::mobile\_entry\_point)\] pub fn run() { tauri::Builder::default() .invoke\_handler(tauri::generate\_handler!\[commands::my\_custom\_command\]) .run(tauri::generate\_context!()) .expect("error while running tauri application"); } #\[wasm\_bindgen\] extern "C" { #\[wasm\_bindgen(js\_namespace = \["window", "\_\_TAURI\_\_", "core"\], js\_name = invoke)\] async fn invoke\_without\_args(cmd: &str) -> JsValue; #\[wasm\_bindgen(js\_namespace = \["window", "\_\_TAURI\_\_", "core"\])\] async fn invoke(cmd: &str, args: JsValue) -> JsValue; } 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html224/270 Passing Arguments Commands can accept arguments: Pass arguments as a JSON object with camelCase keys: In order to pass arguements with Snake Case keys you can use snake\_case with the rename\_all attribute: Returning Data Commands can return data: The invoke function returns a promise: Returning Array Buffers For large data, use \[ tauri::ipc::Response \]: #\[tauri::command\] fn my\_custom\_command(invoke\_message: String) { println!("I was invoked from JavaScript, with this message: {}", invoke\_message); } invoke('my\_custom\_command', { invokeMessage: 'Hello!' }); #\[tauri::command(rename\_all = "snake\_case")\] fn my\_custom\_command(invoke\_message: String) {} invoke('my\_custom\_command', { invoke\_message: 'Hello!' }); #\[tauri::command\] fn my\_custom\_command() -> String { "Hello from Rust!".into() } invoke('my\_custom\_command').then((message) => console.log(message)); 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html225/270 Error Handling Commands can return errors using Result : Handle errors in JavaScript: For non- serde::Serialize errors, convert them to String : Create custom error types with thiserror : use tauri::ipc::Response; #\[tauri::command\] fn read\_file() -> Response { let data = std::fs::read("/path/to/file").unwrap(); tauri::ipc::Response::new(data) } #\[tauri::command\] fn login(user: String, password: String) -> Result<String, String> { if user == "tauri" && password == "tauri" { Ok("logged\_in".to\_string()) } else { Err("invalid credentials".to\_string()) } } invoke('login', { user: 'tauri', password: '0j4rijw8=' }) .then((message) => console.log(message)) .catch((error) => console.error(error)); #\[tauri::command\] fn my\_custom\_command() -> Result<(), String> { std::fs::File::open("path/to/file").map\_err(|err| err.to\_string())?; Ok(()) } 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html226/270 Async Commands For heavy tasks, use async commands: Handle borrowed types with Result : Invoke async commands from JavaScript: #\[derive(Debug, thiserror::Error)\] enum Error { #\[error(transparent)\] Io(#\[from\] std::io::Error) } impl serde::Serialize for Error { fn serialize<S>(&self, serializer: S) -> Result<S::Ok, S::Error> where S: serde::ser::Serializer, { serializer.serialize\_str(self.to\_string().as\_ref()) } } #\[tauri::command\] fn my\_custom\_command() -> Result<(), Error> { std::fs::File::open("path/that/does/not/exist")?; Ok(()) } #\[tauri::command\] async fn my\_custom\_command(value: String) -> String { some\_async\_function().await; value } #\[tauri::command\] async fn my\_custom\_command(value: &str) -> Result<String, ()> { some\_async\_function().await; Ok(format!(value)) } invoke('my\_custom\_command', { value: 'Hello, Async!' }).then(() => console.log('Completed!') ); 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html227/270 Channels Use Tauri channels for streaming data: Accessing WebviewWindow and AppHandle Commands can access WebviewWindow and AppHandle : Managed State Manage state with tauri::Builder and access it in commands: use tokio::io::AsyncReadExt; #\[tauri::command\] async fn load\_image(path: std::path::PathBuf, reader: tauri::ipc::Channel<&\[u8\]>) { let mut file = tokio::fs::File::open(path).await.unwrap(); let mut chunk = vec!\[0; 4096\]; loop { let len = file.read(&mut chunk).await.unwrap(); if len == 0 { break; } reader.send(&chunk).unwrap(); } } #\[tauri::command\] async fn my\_custom\_command(webview\_window: tauri::WebviewWindow) { println!("WebviewWindow: {}", webview\_window.label()); } #\[tauri::command\] async fn my\_custom\_command(app\_handle: tauri::AppHandle) { let app\_dir = app\_handle.path\_resolver().app\_dir(); app\_handle.global\_shortcut\_manager().register("CTRL + U", move || {}); } 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html228/270 Raw Request Access Access the full \[ tauri::ipc::Request \] object in commands: struct MyState(String); #\[tauri::command\] fn my\_custom\_command(state: tauri::State<MyState>) { assert\_eq!(state.0 == "some state value", true); } #\[cfg\_attr(mobile, tauri::mobile\_entry\_point)\] pub fn run() { tauri::Builder::default() .manage(MyState("some state value".into())) .invoke\_handler(tauri::generate\_handler!\[my\_custom\_command\]) .run(tauri::generate\_context!()) .expect("error while running tauri application"); } #\[derive(Debug, thiserror::Error)\] enum Error { #\[error("unexpected request body")\] RequestBodyMustBeRaw, #\[error("missing \`{0}\` header")\] MissingHeader(&'static str), } impl serde::Serialize for Error { fn serialize<S>(&self, serializer: S) -> Result<S::Ok, S::Error> where S: serde::ser::Serializer, { serializer.serialize\_str(self.to\_string().as\_ref()) } } #\[tauri::command\] fn upload(request: tauri::ipc::Request) -> Result<(), Error> { let tauri::ipc::InvokeBody::Raw(upload\_data) = request.body() else { return Err(Error::RequestBodyMustBeRaw); }; let Some(authorization\_header) = request.headers().get("Authorization") else { return Err(Error::MissingHeader("Authorization")); }; Ok(()) } 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html229/270 Invoke with raw request body and headers: Multiple Commands Register multiple commands with tauri::generate\_handler! : const data = new Uint8Array(\[1, 2, 3\]); await \_\_TAURI\_\_.core.invoke('upload', data, { headers: { Authorization: 'apikey', }, }); #\[tauri::command\] fn cmd\_a() -> String { "Command a" } #\[tauri::command\] fn cmd\_b() -> String { "Command b" } #\[cfg\_attr(mobile, tauri::mobile\_entry\_point)\] pub fn run() { tauri::Builder::default() .invoke\_handler(tauri::generate\_handler!\[cmd\_a, cmd\_b\]) .run(tauri::generate\_context!()) .expect("error while running tauri application"); } 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html230/270 Calling the Frontend from Rust In Tauri applications, Rust can communicate with the frontend through the Tauri event system, channels, or by executing JavaScript code directly. The Event System Tauri offers a simple event system for bi-directional communication between Rust and the frontend. This system is perfect for scenarios involving small data streams or multi-producer, multi-consumer patterns like push notifications. However, the event system is not suitable for low latency or high throughput requirements. Key differences between Tauri commands and events include the lack of strong type support for events, JSON string payloads unsuitable for large messages, and no support for the \[capabilities\] system for fine-grained control. The \[AppHandle\] and \[WebviewWindow\] types implement the \[Listener\] and \[Emitter\] traits for the event system. Events can be global (sent to all listeners) or specific to a webview (sent to a listener in a specific webview). Global Events To emit a global event, use the emit function: It is important to note that global events are sent to all listeners. use tauri::{AppHandle, Emitter}; #\[tauri::command\] fn download(app: AppHandle, url: String) { app.emit("download-started", &url).unwrap(); for progress in \[1, 15, 50, 80, 100\] { app.emit("download-progress", progress).unwrap(); } app.emit("download-finished", &url).unwrap(); } 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html231/270 Webview Events To emit an event to a specific webview listener, use the emit\_to function: To emit an event to multiple webviews, use emit\_filter : Webview-specific events are not sent to global event listeners. Use listen\_any to catch all events. Event Payload Event payloads can be any Serialize type that also implements Clone . Here's an enhanced download event example: use tauri::{AppHandle, Emitter}; #\[tauri::command\] fn login(app: AppHandle, user: String, password: String) { let authenticated = user == "tauri-apps" && password == "tauri"; let result = if authenticated { "loggedIn" } else { "invalidCredentials" }; app.emit\_to("login", "login-result", result).unwrap(); } use tauri::{AppHandle, Emitter, EventTarget}; #\[tauri::command\] fn open\_file(app: AppHandle, path: std::path::PathBuf) { app.emit\_filter("open-file", path, |target| match target { EventTarget::WebviewWindow { label } => label == "main" || label == "file- viewer", \_ => false, }).unwrap(); } 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html232/270 Listening to Events Tauri provides APIs for listening to events on both the frontend and Rust sides. use tauri::{AppHandle, Emitter}; use serde::Serialize; #\[derive(Clone, Serialize)\] #\[serde(rename\_all = "camelCase")\] struct DownloadStarted<'a> { url: &'a str, download\_id: usize, content\_length: usize, } #\[derive(Clone, Serialize)\] #\[serde(rename\_all = "camelCase")\] struct DownloadProgress { download\_id: usize, chunk\_length: usize, } #\[derive(Clone, Serialize)\] #\[serde(rename\_all = "camelCase")\] struct DownloadFinished { download\_id: usize, } #\[tauri::command\] fn download(app: AppHandle, url: String) { let content\_length = 1000; let download\_id = 1; app.emit("download-started", DownloadStarted { url: &url, download\_id, content\_length }).unwrap(); for chunk\_length in \[15, 150, 35, 500, 300\] { app.emit("download-progress", DownloadProgress { download\_id, chunk\_length, }).unwrap(); } app.emit("download-finished", DownloadFinished { download\_id }).unwrap(); } 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html233/270 Listening to Events on the Frontend Channels The event system is designed for simple, global two-way communication. For high-performance data streaming, use channels. Channels ensure fast, ordered data delivery and are used internally for tasks like download progress, child process output, and WebSocket messages. Here's the download command example using channels: 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html234/270 To call the download command, create the channel and pass it as an argument: use tauri::{AppHandle, ipc::Channel}; use serde::Serialize; #\[derive(Clone, Serialize)\] #\[serde(rename\_all = "camelCase", tag = "event", content = "data")\] enum DownloadEvent<'a> { #\[serde(rename\_all = "camelCase")\] Started { url: &'a str, download\_id: usize, content\_length: usize, }, #\[serde(rename\_all = "camelCase")\] Progress { download\_id: usize, chunk\_length: usize, }, #\[serde(rename\_all = "camelCase")\] Finished { download\_id: usize, }, } #\[tauri::command\] fn download(app: AppHandle, url: String, on\_event: Channel<DownloadEvent>) { let content\_length = 1000; let download\_id = 1; on\_event.send(DownloadEvent::Started { url: &url, download\_id, content\_length, }).unwrap(); for chunk\_length in \[15, 150, 35, 500, 300\] { on\_event.send(DownloadEvent::Progress { download\_id, chunk\_length, }).unwrap(); } on\_event.send(DownloadEvent::Finished { download\_id }).unwrap(); } 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html235/270 Executing JavaScript To run JavaScript code directly in the webview context, use the \[ WebviewWindow#eval \] function: import { invoke, Channel } from '@tauri-apps/api/core'; type DownloadEvent = | { event: 'started'; data: { url: string; downloadId: number; contentLength: number; }; } | { event: 'progress'; data: { downloadId: number; chunkLength: number; }; } | { event: 'finished'; data: { downloadId: number; }; }; const onEvent = new Channel<DownloadEvent>(); onEvent.onmessage = (message) => { console.log(\`got download event ${message.event}\`); }; await invoke('download', { url: 'https://raw.githubusercontent.com/tauri-apps/tauri/dev/crates/tauri- schema-generator/schemas/config.schema.json', onEvent, }); use tauri::Manager; tauri::Builder::default() .setup(|app| { let webview = app.get\_webview\_window("main").unwrap(); webview.eval("console.log('hello from Rust')")?; Ok(()) }) 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html236/270 For complex scripts requiring Rust object input, consider using the \[serialize-to-javascript\] crate. 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html237/270 Managing State in Tauri Managing the state of your Tauri application is crucial for maintaining its lifecycle and behavior. Tauri offers a straightforward way to handle state using the Manager API, allowing you to access it when commands are executed. Basic Example Let's start with a basic example to illustrate how you can manage state in a Tauri application: In this example, we define a simple AppData struct to hold our state. We then use the setup method to manage this state within our Tauri application. To retrieve your state, you can use any type implementing the Manager trait, such as the App instance: For more details, refer to the Accessing State section. use tauri::{Builder, Manager}; struct AppData { welcome\_message: &'static str, } fn main() { Builder::default() .setup(|app| { app.manage(AppData { welcome\_message: "Welcome to Tauri!", }); Ok(()) }) .run(tauri::generate\_context!()) .unwrap(); } let data = app.state::<AppData>(); 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html238/270 Handling Mutability Rust's ownership model prevents direct mutation of shared values across threads or through shared pointers like Arc or Tauri's State . This is to avoid data races. To modify shared state, you can use interior mutability. The standard library's Mutex can be used to safely lock and unlock the state for modification: To modify the state, lock the mutex: The mutex is automatically unlocked when the MutexGuard is dropped. Using Async Mutex According to the Tokio documentation, the standard library's Mutex is often sufficient for asynchronous code. However, an async mutex is necessary if you need to hold the MutexGuard across await points. Do You Need Arc? In Rust, Arc is commonly used to share ownership of a value across threads, often paired with a Mutex ( Arc<Mutex<T>> ). Tauri handles this for you, so you don't need to use Arc for values use std::sync::Mutex; use tauri::{Builder, Manager}; #\[derive(Default)\] struct AppState { counter: u32, } fn main() { Builder::default() .setup(|app| { app.manage(Mutex::new(AppState::default())); Ok(()) }) .run(tauri::generate\_context!()) .unwrap(); } let state = app.state::<Mutex<AppState>>(); let mut state = state.lock().unwrap(); state.counter += 1; 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html239/270 stored in State . Accessing State In Commands You can access and modify the state within commands: For more on commands, see Calling Rust from the Frontend. Async Commands For async commands using Tokio's async Mutex : The return type must be Result for asynchronous commands. Using the Manager Trait To access state outside commands, such as in event handlers or different threads, use the state() method of types implementing the Manager trait: #\[tauri::command\] fn increase\_counter(state: State<'\_, Mutex<AppState>>) -> u32 { let mut state = state.lock().unwrap(); state.counter += 1; state.counter } #\[tauri::command\] async fn increase\_counter(state: State<'\_, Mutex<AppState>>) -> Result<u32, ()> { let mut state = state.lock().await; state.counter += 1; Ok(state.counter) } 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html240/270 This approach is useful when command injection is not feasible. Type Mismatches It is important to note that using the wrong type for the State parameter results in a runtime panic. For instance, using State<'\_, AppState> instead of State<'\_, Mutex<AppState>> will cause issues. To avoid this, consider using a type alias: Ensure you use the type alias correctly to prevent wrapping it in a Mutex again. use tauri::{Builder, GlobalWindowEvent, Manager}; #\[derive(Default)\] struct AppState { counter: u32, } fn on\_window\_event(event: GlobalWindowEvent) { let app\_handle = event.window().app\_handle(); let state = app\_handle.state::<Mutex<AppState>>(); let mut state = state.lock().unwrap(); state.counter += 1; } fn main() { Builder::default() .setup(|app| { app.manage(Mutex::new(AppState::default())); Ok(()) }) .on\_window\_event(on\_window\_event) .run(tauri::generate\_context!()) .unwrap(); } use std::sync::Mutex; #\[derive(Default)\] struct AppStateInner { counter: u32, } type AppState = Mutex<AppStateInner>; 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html241/270 Distribution 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html242/270 Signing Your App with MSIX Rebundler This guide will walk you through the process of using the MSIX Rebundler to sign your app. Prerequisites Before you begin, ensure you have the following: Windows 10 or later MSIX Packaging Tool installed A valid code signing certificate Steps 1. Install MSIX Rebundler Download and install the MSIX Rebundler from the official MSIX Rebundler GitHub repository. 2. Prepare Your App Ensure your app is packaged in the MSIX format. If not, use the MSIX Packaging Tool to convert your app to MSIX. 3. Sign Your App Open a command prompt and navigate to the directory containing your MSIX package. Run the following command to sign your app: Replace <path-to-your-app.msix> , <path-to-signed-app.msix> , <path-to-your- certificate.pfx> , and <your-certificate-password> with the appropriate values. 4. Verify the Signature To verify that your app has been signed correctly, use the SignTool utility: msixrebundler sign --input <path-to-your-app.msix> --output <path-to-signed- app.msix> --cert <path-to-your-certificate.pfx> --password <your-certificate- password> 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html243/270 Ensure the verification process completes without errors. Conclusion You have successfully signed your app using the MSIX Rebundler. Your app is now ready for distribution. For more information, refer to the official MSIX documentation. signtool verify /pa /v <path-to-signed-app.msix> 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html244/270 Distributing to Android Devices Add apksigner, keytool, and zipalign to Your PATH To distribute your application to Android devices, you need to ensure that apksigner , keytool , and zipalign are available in your system's PATH. Here are the steps to add them: 1. Locate the Tools: apksigner and zipalign are part of the Android SDK Build-Tools. You can find them in the build-tools directory of your Android SDK installation. keytool is part of the JetBrains Runtime (JBR) distributed with Android Studio. You can find it in the bin directory of your JBR installation. 2. Update Your PATH: On Windows: 1. Open the Start Menu and search for "Environment Variables". 2. Click on "Edit the system environment variables". 3. In the System Properties window, click on the "Environment Variables" button. 4. In the Environment Variables window, find the Path variable in the "System variables" section and click "Edit". 5. Add the paths to the directories containing apksigner , keytool , and zipalign to the list. For example: 6. Click "OK" to save the changes. On macOS and Linux: 1. Open a terminal. 2. Edit your shell profile file (e.g., ~/.bashrc , ~/.zshrc , or ~/.profile ) using a text editor. 3. Add the following lines to the file, replacing the paths with the actual locations of your tools: C:\\path\\to\\android-sdk\\build-tools\\version C:\\path\\to\\android-studio\\jbr\\bin 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html245/270 4. Save the file and run source ~/.bashrc (or the appropriate command for your shell profile) to apply the changes. 3. Verify the PATH: If using windows, it is best to restart your device. Open a new terminal or command prompt. Run the following commands to ensure that the tools are accessible: If the commands return version information or help text, the tools have been successfully added to your PATH. Sign Your APK To sign your APK, you need to use keytool , zipalign , and apksigner . Follow these steps: 1. Generate a Keystore: Use keytool to generate a keystore file. This file will contain the key used to sign your APK. You will be prompted to enter some information and a password for the keystore. 2. Build Your APK: Run the following commands in your terminal. export PATH=$PATH:/path/to/android-sdk/build-tools/version export PATH=$PATH:/path/to/android-studio/jbr/bin apksigner -version keytool -help zipalign -version keytool -genkey -v -keystore my-release-key.jks -keyalg RSA -keysize 2048 - validity 10000 -alias my-key-alias npm run tauri android init npm run tauri icon /path/to/your/icon.png npm run tauri android build 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html246/270 It is important to note that if you don't set your icon after running tauri android init that your app will have the default Tauri logo. 3. Align the APK: Use zipalign to optimize the APK file. This step is necessary for the APK to be accepted by the Google Play Store. It is imperative that you run zipalign before you use apksigner or your APK will be invalid. 4. Sign the APK: Use apksigner to sign the aligned APK with your keystore. 5. Verify the APK: Use apksigner to verify that the APK is correctly signed. If the verification is successful, your APK is now signed. Once this is done, you can upload your release to the Google Play Developer Console. zipalign -v -p 4 path/to/your-app-unsigned.apk path/to/your-app-unsigned- aligned.apk apksigner sign --ks my-release-key.jks --out path/to/your-app-release.apk path/to/your-app-unsigned-aligned.apk apksigner verify path/to/your-app-release.apk 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html247/270 Publishing To The Arch User Repository Introduction The Arch User Repository is a collection of git repositories managed by the archlinux community. Within each repository there is a build script that is held within a PKGBUILD file and a .SRCINFO file that contains information regarding the sources used by the build script. Setup First go to https://aur.archlinux.org and make an account. Be sure to add the proper ssh keys. Next, clone an empty git repository using this command. After completing the steps above, create a file with the name PKGBUILD . Once the file is created you can move onto the next step. Writing a PKGBUILD file git clone https://aur.archlinux.org/your-repo-name pkgname=<pkgname> pkgver=1.0.0 pkgrel=1 pkgdesc="Description of your app" arch=('x86\_64' 'aarch64') url="https://github.com/<user>/<project>" license=('mit') depends=('cairo' 'desktop-file-utils' 'gdk-pixbuf2' 'glib2' 'gtk3' 'hicolor-icon- theme' 'libsoup' 'pango' 'webkit2gtk') options=('!strip' '!emptydirs') install=${pkgname}.install source\_x86\_64= ("https://github.com/<user>/<project>/releases/download/v$pkgver/appname\_"$pkgver" \_amd64.deb") source\_aarch64= ("https://github.com/<user>/<project>/releases/download/v$pkgver/appname\_"$pkgver" \_arm64.deb") 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html248/270 At the top of the file, define your package name and assign it the variable pkgname . Set your pkgver variable. Typically it is best to use this variable in the source variable to increase maintainability. The pkgdesc variable on your aur repo's page and tells vistors what your app does. The arch variable controls what architectures can install your package. The url variable, while not required, helps to make your package appear more professional. The install variable defines a file that runs the installation commands. The depends variable includes a list of items that are required to make your app run. For any Tauri app you must include all of the dependencies shown above. The source variable is required and defines the location where your upstream package is. You can make a source architecture specific by adding the architecture to the end of the variable name. Generating SRCINFO In order to push your repo to the aur you must generate an srcinfo file. This can be done with this command. Testing Testing the app is extremely simple. All you have to do is run makepkg -f within the same directory as the pkgbuild file and see if it works Publishing Finally, after the testing phase is over, you can publish the application to the arch user repository with these commands. If all goes well, your repository should now appear on the aur website. makepkg --printsrcinfo >> .SRCINFO git add . git commit -m "Initial Commit" git push 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html249/270 Examples Extracting From A Debian Package # Maintainer: # Contributor: pkgname=<pkgname> pkgver=1.0.0 pkgrel=1 pkgdesc="Description of your app" arch=('x86\_64' 'aarch64') url="https://github.com/<user>/<project>" license=('mit') depends=('cairo' 'desktop-file-utils' 'gdk-pixbuf2' 'glib2' 'gtk3' 'hicolor-icon- theme' 'libsoup' 'pango' 'webkit2gtk') options=('!strip' '!emptydirs') install=${pkgname}.install source\_x86\_64= ("https://github.com/<user>/<project>/releases/download/v$pkgver/appname\_"$pkgver" \_amd64.deb") source\_aarch64= ("https://github.com/<user>/<project>/releases/download/v$pkgver/appname\_"$pkgver" \_arm64.deb") sha256sums\_x86\_64= ('ca85f11732765bed78f93f55397b4b4cbb76685088553dad612c5062e3ec651f') sha256sums\_aarch64= ('ed2dc3169d34d91188fb55d39867713856dd02a2360ffe0661cb2e19bd701c3c') package() { # Extract package data tar -xz -f data.tar.gz -C "${pkgdir}" } post\_install() { gtk-update-icon-cache -q -t -f usr/share/icons/hicolor update-desktop-database -q } post\_upgrade() { post\_install } post\_remove() { gtk-update-icon-cache -q -t -f usr/share/icons/hicolor update-desktop-database -q } 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html250/270 Building from source # Maintainer: pkgname=<pkgname>-git pkgver=1.1.0 pkgrel=1 pkgdesc="Description of your app" arch=('any') url="https://github.com/<user>/<project>" license=('mit') depends=('cairo' 'desktop-file-utils' 'gdk-pixbuf2' 'glib2' 'gtk3' 'hicolor-icon- theme' 'libsoup' 'pango' 'webkit2gtk') makedepends=('git' 'file' 'openssl' 'appmenu-gtk-module' 'libappindicator-gtk3' 'librsvg' 'base-devel' 'curl' 'wget' 'rustup' 'npm' 'nodejs' 'dpkg') provides=('<pkgname>') conflicts=('<binname>' '<pkgname>') options=('!strip' '!emptydirs') source=('git+https://github.com/<user>/<project>') sha256sums=('SKIP') prepare() { cd <project> npm install npm run tauri build } package() { cd "$srcdir"/<project>/src-tauri/target/\*unknown-linux\*/release/bundle/deb dpkg-deb -x \*.deb here cd here install -Dm755 usr/bin/myapp "$pkgdir"/usr/bin/myapp # Install desktop file install -Dm644 usr/share/applications/myapp.desktop "$pkgdir"/usr/share/applications/myapp.desktop # Install icons install -Dm644 usr/share/icons/hicolor/128x128/apps/myapp.png "$pkgdir"/usr/share/icons/hicolor/128x128/apps/myapp.png install -Dm644 usr/share/icons/hicolor/256x256@2/apps/myapp.png "$pkgdir"/usr/share/icons/hicolor/256x256@2/apps/myapp.png install -Dm644 usr/share/icons/hicolor/32x32/apps/myapp.png "$pkgdir"/usr/share/icons/hicolor/32x32/apps/myapp.png # Extract package data } 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html251/270 Pacstall Pacstall is similar to the Arch User Repository, however it is meant for debian based distros. It is rapidly gaining popularity. Step 1. Create a fork of pacstall-programs at https://github.com/pacstall/pacstall-programs Step 2. Create a folder within the packages directory with your apps name. Step 3. Create your pacscript. It is simplest to use the debian package that would be automatically released on github. All pacscripts that use a debian package source are required to be suffixed -deb . Using a debian source makes it much faster to install your application. The pkgname variable is given your apps name with the suffix of -deb The gives variable defines your executables name The pkgver variable is the version of your app and can be used when defining your source to improve maintainability. The pkgdesc is a required variable that contains a short description of your app. The arch variable contains information on which architectures your app supports. The url variable links to your apps homepage. The maintainer variable defines who is currently maintaining the pacscript The depends variable contains a list of packages in which your app is dependent on. The source variable uses previously defined variable to improve maintainability and links to your apps deb files. Step 4. Clone The pacstall-programs Repository pkgname="appname-deb" gives="${pkgname/-deb/}" pkgver="2.0.3" pkgdesc="A Bible App developed with tauri" arch=('amd64' 'arm64' 'armhf') url="https://github.com/Username/Your\_Repository" maintainer=("Firstname Lastname <email>") depends=('libwebkit2gtk-4.1-dev' 'build-essential' 'curl' 'wget' 'file' 'libxdo- dev' 'libssl-dev' 'libayatana-appindicator3-dev' 'librsvg2-dev') source= ("https://github.com/your\_username/your\_repository/releases/download/v${pkgver}/ap p\_${pkgver}\_${CARCH}.deb") sha256sums\_amd64= ('81c917fdce366aa6d417fdae65306c5f4860fb9dc26c8ffa9a9b62c0d206c54a') sha256sums\_arm64= ('bad20bfad1c337db35ee3f95d59ad5e70c4947b64aa6118de0953ddfec4c1538') sha256sums\_armhf= ('8a8140bf7dcea4852a265b55bca332bb904d249627521b1bd1a985b383fd8307') 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html252/270 Step 5. Enter the repositorys main directory Step 6. Generate the SRCINFO for your package Step 7. Upload your changes to github Step 8. Open a Pull request with following title format git clone https://github.com/pacstall/pacstall-programs cd pacstall-programs ./scripts/srcinfo.sh add ${pkgname} add: \`pkgname\` 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html253/270 Snapcraft Snapcraft is a universal software bundler for linux. Software uploaded to Snapcraft.io can be displayed on software stores such as Discover and Gnome Software Step 1. Install Snap On Your Chosen Distro Debian Arch Fedora Step 2. Install a base snap 3. Install snapcraft sudo apt install snapd sudo pacman -S --needed git base-devel git clone https://aur.archlinux.org/snapd.git cd snapd makepkg -si sudo systemctl enable --now snapd.socket sudo systemctl start snapd.socket sudo systemctl enable --now snapd.apparmor.service sudo dnf install snapd # Enable classic snap support sudo ln -s /var/lib/snapd/snap /snap sudo snap install core22 sudo snap install snapcraft --classic 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html254/270 Configuration 1. Create an UbuntuOne account. 2. Go to the Snapcraft website and register an App name. 3. Create a snapcraft.yaml file in your projects root. 4. Adjust the names in the snapcraft.yaml file. 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html255/270 name: appname base: core22 version: '0.1.0' summary: Your summary # 79 char long summary description: | Your description grade: stable confinement: strict layout: /usr/lib/$SNAPCRAFT\_ARCH\_TRIPLET/webkit2gtk-4.1: bind: $SNAP/usr/lib/$SNAPCRAFT\_ARCH\_TRIPLET/webkit2gtk-4.1 apps: appname: command: usr/bin/appname desktop: usr/share/applications/appname.desktop extensions: \[gnome\] #plugs: # - network # Add whatever plugs you need here, see https://snapcraft.io/docs/snapcraft- interfaces for more info. # The gnome extension already includes \[ desktop, desktop-legacy, gsettings, opengl, wayland, x11, mount-observe, calendar-service \] package-repositories: - type: apt components: \[main\] suites: \[noble\] key-id: 78E1918602959B9C59103100F1831DDAFC42E99D url: http://ppa.launchpad.net/snappy-dev/snapcraft-daily/ubuntu parts: build-app: plugin: dump build-snaps: - node/20/stable - rustup/latest/stable build-packages: - libwebkit2gtk-4.1-dev - build-essential - curl - wget - file - libxdo-dev - libssl-dev - libayatana-appindicator3-dev - librsvg2-dev - dpkg stage-packages: - libwebkit2gtk-4.1-0 - libayatana-appindicator3-1 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html256/270 Explanation The name variable defines the name of your app and is required to be set to the name that you have registered earlier. The base variable defines which core you are using. The version variable defines the version, and should be updated with each change to the source repository. The apps section allows you to expose the desktop and binary files to allow the user to run your app. The package-repositories section allows you to add a package repository to help you satisfy your dependencies. build-packages / build-snaps defines the build dependencies for your snap. stage-packages / stage-snaps defines the runtime dependencies for your snap. The override-pull section runs a series of commands before the sources are pulled. craftctl default performs the default pull commands. The organize section moves your files to the proper directories so that the binary and desktop file can be exposed to the apps sections. Building Your Snap When building your snap be sure to run this command while located in the same directory as your manifest Testing source: . override-build: | set -eu npm install npm run tauri build -- --bundles deb dpkg -x src-tauri/target/release/bundle/deb/\*.deb $SNAPCRAFT\_PART\_INSTALL/ sed -i -e "s|Icon=appname|Icon=/usr/share/icons/hicolor/32x32/apps/appname.png|g" $SNAPCRAFT\_PART\_INSTALL/usr/share/applications/appname.desktop sudo snapcraft snap run your-app 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html257/270 Releasing Manually Building automatically 1. Add your manifest to your projects root directory on github 2. On your apps developer page click on the builds tab. 3. Click login with github . 4. Enter in your repository's details. snapcraft login # Login with your UbuntuOne credentials snapcraft upload --release=stable mysnap\_latest\_amd64.snap 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html258/270 Distribution Flathub 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html259/270 Creating MetaInfo for Your Flathub App Crafting Your Metadata File To create a metadata file for your Flathub application, you need to follow a specific XML structure. Below is an example of how your metadata file should look: 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html260/270 <?xml version="1.0" encoding="UTF-8"?> <component type="desktop-application"> <id>org.your.id</id> <launchable type="desktop-id">org.your.id.desktop</launchable> <name>Your App's Name</name> <developer id="io.github.roseblume.rosemusic"> <name>Your Name</name> </developer> <content\_rating type="oars-1.1"> </content\_rating> <keywords> <keyword>Keyword1</keyword> <keyword>Keyword2</keyword> </keywords> <branding> <color type="primary" scheme\_preference="light">#00ffff</color> <color type="primary" scheme\_preference="dark">#0c9aff</color> </branding> <recommends> <display\_length compare="ge">360</display\_length> </recommends> <summary>Your Summary</summary> <metadata\_license>MIT</metadata\_license> <project\_license>MIT</project\_license> <url type="homepage">https://github.com/Your-Username/Your-Repo</url> <supports> <control>pointing</control> <control>keyboard</control> <control>touch</control> </supports> <description> <p> Your Description </p> </description> <screenshots> <screenshot type="default"> <image>https://site.com/your-image.png</image> <caption>Your Caption</caption> </screenshot> </screenshots> <releases> <release version="1.0.0" date="2024-11-02" > <description> <ul> <li>Updated UI</li> <li>Added Electronic Genre</li> </ul> </description> </release> 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html261/270 Required Sections Your metadata file must include the following sections: <id> : A unique identifier for your application, which should match the ID in your manifest file. <project\_license> : Specifies the license under which your project is distributed. <name> : The name of your application as it will appear to users. <summary> : A brief summary of what your application does. <developer> : Information about the developer of the application, including an ID and a name. Example: <description> : A detailed description of your application, which can include paragraphs, emphasized text, code snippets, lists, and more. Example: </releases> <update\_contact>your-email@place.com</update\_contact> </component> <developer id="org.example"> <name>Developer Name</name> </developer> <description> <p>Some <em>description</em></p> <p>Some <code>description</code></p> <p>A list of features</p> <ul> <li>First Feature</li> <li>Second Feature</li> <li>Third Feature</li> </ul> <p>The app can do:</p> <ol> <li>First Feature</li> <li>Second Feature</li> <li>Third Feature</li> </ol> </description> 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html262/270 <launchable> : Specifies how the application can be launched, typically referencing a desktop entry file. Example: Adding Your MetaInfo File to Your Linux Bundles To include your metainfo file in your Linux bundles, you need to specify the file paths in your configuration. Below is an example configuration for Debian and RPM packages: <launchable type="desktop-id">org.example.app.desktop</launchable> "linux": { "deb": { "files": { "/usr/share/metainfo/org.your.id.metainfo.xml": "relative/path/from/your/tauri.conf.json/to/your/org.your.id.metainfo.xml" } }, "rpm": { "files": { "/usr/share/metainfo/org.your.id.metainfo.xml": "relative/path/from/your/tauri.conf.json/to/your/org.your.id.metainfo.xml" } } } 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html263/270 Designing a Manifest Designing a Manifest for Open Source Software 1. Get your required tools First, you need to gather the necessary tools to start building your Flatpak. Use the following commands to add the required submodule and install the necessary dependencies: 2. Generate your sources Depending on whether you use Yarn or NPM, you will need to generate your Node and Cargo sources. Yarn To generate your Node sources with Yarn, use the following command: Next, generate your Cargo sources: NPM If you are using NPM, generate your Node sources with this command: git submodule add https://github.com/flatpak/flatpak-builder-tools.git cd flatpak-builder-tools/node/flatpak\_node\_generator pipx install . # Change this to your preferred installation method flatpak-node-generator --no-requests-cache -o node-sources.json yarn /path/to/your/lock/file/yarn.lock python3 flatpak-builder-tools/cargo/flatpak-cargo-generator.py -o cargo- sources.json src-tauri/Cargo.lock 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html264/270 Then, generate your Cargo sources: 3. Create your manifest Now, create your Flatpak manifest. This file defines the configuration and build instructions for your application. Here is an example manifest: flatpak-node-generator --no-requests-cache -o node-sources.json npm /path/to/your/lock/file/package-lock.json python3 flatpak-builder-tools/cargo/flatpak-cargo-generator.py -o cargo- sources.json src-tauri/Cargo.lock 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html265/270 id: org.your.id runtime: org.gnome.Platform runtime-version: '47' sdk: org.gnome.Sdk command: tauri-app finish-args: - --socket=wayland # Permission needed to show the window - --socket=fallback-x11 # Permission needed to show the window - --device=dri # OpenGL, not necessary for all projects - --share=ipc sdk-extensions: - org.freedesktop.Sdk.Extension.node20 - org.freedesktop.Sdk.Extension.rust-stable build-options: append-path: /usr/lib/sdk/node20/bin:/usr/lib/sdk/rust-stable/bin modules: - name: your-command buildsystem: simple env: HOME: /run/build/your-module CARGO\_HOME: /run/build/your-module/src-tauri XDG\_CACHE\_HOME: /run/build/your-module/flatpak-node/cache yarn\_config\_offline: 'true' yarn\_config\_cache: /run/build/your-module/flatpak-node/yarn-cache sources: - type: git url: https://github.com/Your-Github-Username/Your-Git-Repo.git tag: v1.2.2 - cargo-sources.json - node-sources.json build-commands: - echo -e 'yarn-offline-mirror "/run/build/your-module/flatpak-node/yarn- mirror"\\nyarn-offline-mirror-pruning true' > /run/build/your-module/.yarnrc - mkdir -p src-tauri/.cargo && echo -e '\[source.crates-io\]\\nreplace-with = "vendored-sources"\\n\\n\[source.vendored-sources\]\\ndirectory = "/run/build/your- module/cargo/vendor"' > src-tauri/.cargo/config.toml - yarn install --offline --immutable --immutable-cache --inline-builds - yarn run tauri build -- -b deb - ar -x src-tauri/target/release/bundle/deb/\*.deb - tar -xf src-tauri/target/release/bundle/deb/your-app/data.tar.gz - install -Dm755 src-tauri/target/release/bundle/deb/your- app/data/usr/bin/your-command /app/bin/your-command - install -Dm644 src-tauri/target/release/bundle/deb/your- app/data/usr/share/applications/Rosary-Music.desktop /app/share/applications/org.your.id.desktop - install -Dm644 src-tauri/target/release/bundle/deb/your- app/data/usr/share/icons/hicolor/128x128/apps/your-app.png /app/share/icons/hicolor/128x128/apps/your-app.png - install -Dm644 src-tauri/target/release/bundle/deb/your- app/data/usr/share/icons/hicolor/32x32/apps/your-app.png 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html266/270 Submitting To Flathub To submit your application to Flathub, follow these steps: 1. Fork the Flathub Repository. 2. Clone your forked repository: 3. Enter the repository: 4. Create a new branch: 5. Open a pull request against the new-pr branch on GitHub. 6. Your app will now enter the review process, during which you may be asked to make changes to your project. Designing a Manifest for Closed Source Software Step 1. Install flatpak and flatpak-builder To build Flatpaks locally, you need the flatpak and flatpak-builder tools. Install them using the following commands based on your distribution: /app/share/icons/hicolor/32x32/apps/your-app.png - install -Dm644 src-tauri/target/release/bundle/deb/your- app/data/usr/share/icons/hicolor/256x256@2/apps/your-app.png /app/share/icons/hicolor/512x512/apps/your-app.png - install -Dm644 src-tauri/target/release/bundle/deb/your- app/data/usr/share/icons/hicolor/scalable/apps/your-app.svg /app/share/icons/hicolor/scalable/apps/your-app.svg - install -Dm644 src-tauri/target/release/bundle/deb/your- app/data/usr/share/metainfo/org.your.id /app/share/metainfo/org.your.id git clone --branch=new-pr git@github.com:your\_github\_username/flathub.git cd flathub git checkout -b your\_app\_name 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html267/270 Debian Arch Fedora Gentoo Step 2. Install the Gnome Runtime Install the Gnome runtime with the following command: Step 3. Build the .deb of your tauri-app Follow the instructions here to build the .deb package of your Tauri app. Step 4. Create the manifest Create your Flatpak manifest for the closed source software: sudo apt install flatpak flatpak-builder sudo pacman -S --needed flatpak flatpak-builder sudo dnf install flatpak flatpak-builder sudo emerge --ask \\ sys-apps/flatpak \\ dev-util/flatpak-builder flatpak install flathub org.Gnome.Platform//46 org.Gnome.Sdk//46 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html268/270 The Gnome 46 runtime includes all dependencies of the standard Tauri app with their correct versions. Step 5. Install and Test the app Install and test your Flatpak application with the following commands: id: org.your.id runtime: org.gnome.Platform runtime-version: '46' sdk: org.gnome.Sdk command: tauri-app finish-args: - --socket=wayland # Permission needed to show the window - --socket=fallback-x11 # Permission needed to show the window - --device=dri # OpenGL, not necessary for all projects - --share=ipc modules: - name: binary buildsystem: simple sources: - type: file url: https://github.com/your\_username/your\_repository/releases/download/v1.0.1/yourapp\_ 1.0.1\_amd64.deb sha256: 08305b5521e2cf0622e084f2b8f7f31f8a989fc7f407a7050fa3649facd61469 # This is required if you are using a remote source only-arches: \[x86\_64\] # This source is only used on x86\_64 Computers build-commands: - ar -x \*.deb - tar -xf data.tar.gz - 'install -Dm755 usr/bin/tauri-app /app/bin/tauri-app' - install -Dm644 usr/share/applications/yourapp.desktop /app/share/applications/org.your.id.desktop - install -Dm644 usr/share/icons/hicolor/128x128/apps/yourapp.png /app/share/icons/hicolor/128x128/apps/org.your.id.png - install -Dm644 usr/share/icons/hicolor/32x32/apps/yourapp.png /app/share/icons/hicolor/32x32/apps/org.your.id.png - install -Dm644 usr/share/icons/hicolor/256x256@2/apps/yourapp.png /app/share/icons/hicolor/256x256@2/apps/org.your.id.png - install -Dm644 org.your.id.metainfo.xml /app/share/metainfo/org.your.id.rosary.metainfo.xml 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html269/270 Adding additional libraries If your final binary requires more libraries than the default Tauri app, you need to add them to your Flatpak manifest. There are two ways to do this: 1. For fast local development, you can include the already built library file ( .so ) from your local system. However, this is not recommended for the final build of the Flatpak, as your local library file is not built for the Flatpak runtime environment. This can introduce various bugs that can be very hard to find. 2. It is recommended to build the library your program depends on from source inside the Flatpak as a build step. # Install the flatpak flatpak -y --user install <local repo name> <your flatpak id> # Run it flatpak run <your flatpak id> # Update it flatpak -y --user update <your flatpak id> 1/23/25, 12:49 PMHTML, CSS, JavaScript, and Rust for Beginners: A Guide to Application Development with Tauri localhost:3000/print.html270/270

---

# Tauri Programme Turns 1 and Board Elections | Tauri

[Skip to content](https://tauri.app/blog/tauri-programme-turns-1-and-board-elections/#_top)

You're reading the blog on the prerelease site for Tauri 2.0 - [Go to the Tauri 1.0 site](https://tauri.app/)

Tauri Programme Turns 1 and Board Elections
===========================================

Jul 12, 2022

![Robin van Boven](https://tauri.app/authors/Beanow.png)

Robin van Boven

Tauri Board Director

The one year anniversary for Tauri becoming a programme within [The Commons Conservancy](https://commonsconservancy.org/)
 is upcoming on the 16th of July! On that anniversary, two of our Directors on the Tauri Board will be at the end of their first half-term. The Board will hold an election on the 15th of July to decide the Directors for the next two year term.

The Tauri Board has a minimum of three, and a maximum of seven people. Right at the start we’ve had seven people come on board. Meaning we can’t add any more people during this election. So if you’re applying it means you’ll compete with the two project founders for a seat on the Tauri Board.

Honestly those are big shoes to fill! So to avoid unnecessary disappointment, in this election we decided to add a requirement: _You must be currently part of a working group to apply as a candidate._

If you’re still with me, then here are some additional details:

*   Please notify the board _**before July 15th 00:00 UTC**_ if you would like to apply as a candidate.
*   You can mention `@board` on Discord, or DM `Beanow#5887` if you want your application to be kept private within the Board.
*   Optionally, you can include a short motivation for your application.
*   If there are multiple candidates, the Tauri Board will vote for their preferred candidates.
*   The Directors running for office again will have _**half a vote**_ deducted from votes in their favor (one for each consecutive term served).
*   _**After voting on July 15th**_ we’ll share the results.

All this is governed by our [statutes and core regulations](https://dracc.commonsconservancy.org/0035/)
 if you’re interested in seeing the fine print.

We’ll be back soon with an update.

### [Update: Election results](https://tauri.app/blog/tauri-programme-turns-1-and-board-elections/#update-election-results)

[Section titled “Update: Election results”](https://tauri.app/blog/tauri-programme-turns-1-and-board-elections/#update-election-results)

The results are in, so here is the reveal!

The existing Directors applied for another term and there were no additional applicants. Meaning no vote was necessary to select between candidates. For the Chair position Daniel ran as the only candidate.

The Tauri Board then voted unanimously in favor of the following:

1.  The Board appoints Daniel and Lucas for an additional full term (2 years) as Board Directors, starting the 16th of July.
2.  The Board appoints Daniel as Chairperson for the next term (1 year), starting the 16th of July.

Another election will be held around the same time July next year, now with extra time to apply and for the Board to vote. We’ll announce the specifics in due time.

[Announcing Tauri 1.1.0](https://tauri.app/blog/tauri-1-1/)

[Tauri 1.0 Release](https://tauri.app/blog/tauri-1-0/)

* * *

[Support on Open Collective](https://opencollective.com/tauri)
 [Sponsor on GitHub](https://github.com/sponsors/tauri-apps)

© 2026 Tauri Contributors. CC-BY / MIT

---

# Announcing tauri-egui 0.1.0 | Tauri

[Skip to content](https://tauri.app/blog/tauri-egui-0-1/#_top)

Announcing tauri-egui 0.1.0
===========================

Sep 19, 2022

![Lucas Nogueira](https://tauri.app/authors/lucasfernog.jpeg)

Lucas Nogueira

Tauri Co-Founder

The Tauri team is pleased to announce the first release of [tauri-egui](https://github.com/tauri-apps/tauri-egui)
.

[`egui`](https://github.com/emilk/egui)
 is a GUI library written in Rust. It leverages an OpenGL context via [glutin](https://github.com/rust-windowing/glutin)
.

tauri-egui is a Tauri plugin that connects with the Tauri runtime event loop to allow you to create glutin windows via our [glutin fork](https://github.com/tauri-apps/glutin)
 and use egui through our [egui-tao](https://github.com/tauri-apps/egui)
 integration.

[Setup](https://tauri.app/blog/tauri-egui-0-1/#setup)

------------------------------------------------------

[Section titled “Setup”](https://tauri.app/blog/tauri-egui-0-1/#setup)

The first step is to add the crate to your dependencies in Cargo.toml:

    [dependencies]tauri-egui = "0.1"

Now you need to enable the plugin:

    fn main() {  tauri::Builder::default()    .setup(|app| {      app.wry_plugin(tauri_egui::EguiPluginBuilder::new(app.handle()));      Ok(())    })}

[Create an egui layout](https://tauri.app/blog/tauri-egui-0-1/#create-an-egui-layout)

--------------------------------------------------------------------------------------

[Section titled “Create an egui layout”](https://tauri.app/blog/tauri-egui-0-1/#create-an-egui-layout)

To use egui, all you need to do is implement the `tauri_egui::eframe::App` trait to render elements using the egui API. In the following example, we will create a login layout.

*   Define the struct that will be used to render the layout:

    use std::sync::mpsc::{channel, Receiver, Sender};use tauri_egui::{eframe, egui};
    pub struct LoginLayout {  heading: String,  users: Vec<String>,  user: String,  password: String,  password_checker: Box<dyn Fn(&str) -> bool + Send + 'static>,  tx: Sender<String>,  texture: Option<egui::TextureHandle>,}
    impl LoginLayout {  pub fn new(    password_checker: Box<dyn Fn(&str) -> bool + Send + 'static>,    users: Vec<String>,  ) -> (Self, Receiver<String>) {    let (tx, rx) = channel();    let initial_user = users.iter().next().cloned().unwrap_or_else(String::new);    (      Self {        heading: "Sign in".into(),        users,        user: initial_user,        password: "".into(),        password_checker,        tx,        texture: None,      },      rx,    )  }}

*   Implement `tauri_egui::eframe::App` to use the egui APIs:

    impl eframe::App for LoginLayout {  // Called each time the UI needs repainting  // see https://docs.rs/eframe/latest/eframe/trait.App.html#tymethod.update for more details  fn update(&mut self, ctx: &egui::Context, frame: &mut eframe::Frame) {    let Self {      heading,      users,      user,      password,      password_checker,      tx,      ..    } = self;
        let size = egui::Vec2 { x: 320., y: 240. };    // set the window size    frame.set_window_size(size);
        // adds a panel that covers the remainder of the screen    egui::CentralPanel::default().show(ctx, |ui| {      // our layout will be top-down and centered      ui.with_layout(egui::Layout::top_down(egui::Align::Center), |ui| {        // we will start adding elements here in the next sections      });    });  }}

*   Define some helper functions we will use:

    fn logo_and_heading(ui: &mut egui::Ui, logo: egui::Image, heading: &str) {  let original_item_spacing_y = ui.style().spacing.item_spacing.y;  ui.style_mut().spacing.item_spacing.y = 8.;  ui.add(logo);  ui.style_mut().spacing.item_spacing.y = 16.;  ui.heading(egui::RichText::new(heading));  ui.style_mut().spacing.item_spacing.y = original_item_spacing_y;}
    fn control_label(ui: &mut egui::Ui, label: &str) {  let original_item_spacing_y = ui.style().spacing.item_spacing.y;  ui.style_mut().spacing.item_spacing.y = 8.;  ui.label(label);  ui.style_mut().spacing.item_spacing.y = original_item_spacing_y;}

*   Load an image, allocate it as a texture and add it to the UI (requires the `png` dependency):

    let texture: &egui::TextureHandle = self.texture.get_or_insert_with(|| {  let mut reader = png::Decoder::new(std::io::Cursor::new(include_bytes!("icons/32x32.png")))  .read_info()  .unwrap();  let mut buffer = Vec::new();  while let Ok(Some(row)) = reader.next_row() {    buffer.extend(row.data());  }  let icon_size = [reader.info().width as usize, reader.info().height as usize];  // Load the texture only once.  ctx.load_texture(    "icon",    egui::ColorImage::from_rgba_unmultiplied(icon_size, &buffer),    egui::TextureFilter::Linear,  )});logo_and_heading(  ui,  egui::Image::new(texture, texture.size_vec2()),  heading.as_str(),);

*   Add the user selection ComboBox:

    ui.with_layout(egui::Layout::top_down(egui::Align::Min), |ui| {  control_label(ui, "User");  egui::ComboBox::from_id_source("user")    .width(ui.available_width() - 8.)    .selected_text(egui::RichText::new(user.clone()).family(egui::FontFamily::Monospace))    .show_ui(ui, move |ui| {      for user_name in users {        ui.selectable_value(user, user_name.clone(), user_name.clone());      }    })    .response;});

*   Add an entry for password input:

    ui.style_mut().spacing.item_spacing.y = 20.;
    let textfield = ui  .with_layout(egui::Layout::top_down(egui::Align::Min), |ui| {    ui.style_mut().spacing.item_spacing.y = 0.;    control_label(ui, "Password");    ui.horizontal_wrapped(|ui| {      let field = ui.add_sized(        [ui.available_width(), 18.],        egui::TextEdit::singleline(password).password(true),      );      field    })    .inner  })  .inner;

*   Add a submit button:

    let mut button = ui.add_enabled(!password.is_empty(), egui::Button::new("Unlock"));button.rect.min.x = 100.;button.rect.max.x = 100.;

*   Handle submit:

    if (textfield.lost_focus() && ui.input().key_pressed(egui::Key::Enter)) || button.clicked(){  if password_checker(&password) {    let _ = tx.send(password.clone());    password.clear();    frame.close();  } else {    *heading = "Invalid password".into();    textfield.request_focus();  }}

Now that we have created the layout, let’s put it on a window and show it in the Tauri application:

    use tauri::Manager;fn main() {  tauri::Builder::default()    .setup(|app| {      app.wry_plugin(tauri_egui::EguiPluginBuilder::new(app.handle()));
          // the closure that is called when the submit button is clicked - validate the password      let password_checker: Box<dyn Fn(&str) -> bool + Send> = Box::new(|s| s == "tauri-egui-released");
          let (egui_app, rx) = LoginLayout::new(        password_checker,        vec!["John".into(), "Jane".into(), "Joe".into()],      );      let native_options = tauri_egui::eframe::NativeOptions {        resizable: false,        ..Default::default()      };
          app        .state::<tauri_egui::EguiPluginHandle>()        .create_window(          "login".to_string(),          Box::new(|_cc| Box::new(egui_app)),          "Sign in".into(),          native_options,        )        .unwrap();
          // wait for the window to be closed with the user data on another thread      // you don't need to spawn a thread when using e.g. an async command      std::thread::spawn(move || {        if let Ok(signal) = rx.recv() {          dbg!(signal);        }      });
          Ok(())    })    .run(tauri::generate_context!())    .expect("error while running tauri application")}

Here’s how it will look on **all** platforms:

![tauri_egui layout](https://tauri.app/_astro/example.BGoyoevH_Z2r4mmy.webp)

To customize the look and feel of your egui application, check out the [Context#set\_style API](https://docs.rs/egui/latest/egui/struct.Context.html#method.set_style)
.

[Announcing Tauri 1.2.0](https://tauri.app/blog/tauri-1-2/)

[Announcing Tauri 1.1.0](https://tauri.app/blog/tauri-1-1/)

* * *

[Support on Open Collective](https://opencollective.com/tauri)
 [Sponsor on GitHub](https://github.com/sponsors/tauri-apps)

© 2026 Tauri Contributors. CC-BY / MIT

---

# Announcing Tauri 1.1.0 | Tauri

[Skip to content](https://tauri.app/blog/tauri-1-1/#_top)

Announcing Tauri 1.1.0
======================

Sep 15, 2022

![Lucas Nogueira](https://tauri.app/authors/lucasfernog.jpeg)

Lucas Nogueira

Tauri Co-Founder

![Tauri 1.1 Launch Hero Image](https://tauri.app/_astro/header.CFmsZxST_rt6c5.webp)

After 113 pull requests and nearly two months of work, the Tauri team is pleased to announce the [1.1.0 release](https://github.com/tauri-apps/tauri/releases/tag/tauri-v1.1.0)
. The changes were internally audited and no security issues were found.

You can update the dependencies with:

*   [npm](https://tauri.app/blog/tauri-1-1/#tab-panel-614)
    
*   [yarn](https://tauri.app/blog/tauri-1-1/#tab-panel-615)
    
*   [pnpm](https://tauri.app/blog/tauri-1-1/#tab-panel-616)
    
*   [cargo](https://tauri.app/blog/tauri-1-1/#tab-panel-617)
    

    npm install @tauri-apps/cli@latest @tauri-apps/api@latest

    yarn upgrade @tauri-apps/cli @tauri-apps/api --latest

    pnpm update @tauri-apps/cli @tauri-apps/api --latest

    cargo update

[What’s New in 1.1.0](https://tauri.app/blog/tauri-1-1/#whats-new-in-110)

--------------------------------------------------------------------------

[Section titled “What’s New in 1.1.0”](https://tauri.app/blog/tauri-1-1/#whats-new-in-110)

### [Security patch](https://tauri.app/blog/tauri-1-1/#security-patch)

[Section titled “Security patch”](https://tauri.app/blog/tauri-1-1/#security-patch)

This release includes a patch for a security vulnerability reported by [@martin-ocasek](https://github.com/martin-ocasek)
. The `readDir` function was able to return entries outside the configured scope when a symlink is found. The patch is also available in Tauri [1.0.6](https://github.com/tauri-apps/tauri/releases/tag/tauri-v1.0.6)
. See [the issue on GitHub](https://github.com/tauri-apps/tauri/issues/4882)
 for more details.

### [Icon Generation](https://tauri.app/blog/tauri-1-1/#icon-generation)

[Section titled “Icon Generation”](https://tauri.app/blog/tauri-1-1/#icon-generation)

We have been recommending to use the [tauricon](https://github.com/tauri-apps/tauricon)
 project to generate icons for your Tauri application using a single source PNG. Several issues have been reported, and we decided to “Rewrite It In Rust” to enhance its stability. This allowed us to move this functionality to the main Tauri CLI, so now you can use the [`tauri icon`](https://tauri.app/v1/api/cli#icon)
 command.

### [`cargo-binstall` Support for Tauri CLI](https://tauri.app/blog/tauri-1-1/#cargo-binstall-support-for-tauri-cli)

[Section titled “cargo-binstall Support for Tauri CLI”](https://tauri.app/blog/tauri-1-1/#cargo-binstall-support-for-tauri-cli)

The Tauri CLI can now be installed using [cargo-binstall](https://github.com/cargo-bins/cargo-binstall)
, a mechanism to download and install pre-built Rust binaries. The binaries are available for the main targets and can be installed with:

    $ cargo install cargo-binstall$ cargo binstall tauri-cli$ cargo tauri dev # run any Tauri command!

### [Create System Trays at Runtime](https://tauri.app/blog/tauri-1-1/#create-system-trays-at-runtime)

[Section titled “Create System Trays at Runtime”](https://tauri.app/blog/tauri-1-1/#create-system-trays-at-runtime)

The system tray APIs (previously only available in `tauri::Builder::system_tray`) can now be used at runtime with [`tauri::SystemTray`](https://docs.rs/tauri/1.1.0/tauri/struct.SystemTray.html)
 giving you control over its lifetime and even create multiple trays.

Here’s a quick example on how to use it:

    use tauri::{Builder, CustomMenuItem, SystemTray, SystemTrayEvent, SystemTrayMenu};Builder::default()    .setup(|app| {        let handle = app.handle();        SystemTray::new()            .with_id("main")            .with_menu(                SystemTrayMenu::new().add_item(CustomMenuItem::new("quit", "Quit"))            )            .on_event(move |event| {                let tray_handle = handle.tray_handle_by_id("main").unwrap();                if let SystemTrayEvent::MenuItemClick { id, .. } = event {                    if id == "quit" {                        tray_handle.destroy().unwrap();                    }                }            })            .build(&handle)            .expect("unable to create tray");    });

### [TOML Configuration Support](https://tauri.app/blog/tauri-1-1/#toml-configuration-support)

[Section titled “TOML Configuration Support”](https://tauri.app/blog/tauri-1-1/#toml-configuration-support)

In the 1.0 releases Tauri supports the `JSON` configuration format by default, and `JSON5` when the `config-json5` Cargo feature is enabled, meaning the following configurations are valid:

    {  "build": {    "devPath": "http://localhost:8000",    "distDir": "../dist"  }}

    {  build: {    // devServer URL (comments are allowed!)    devPath: 'http://localhost:8000',    distDir: '../dist',  },}

The 1.1.0 release includes TOML support behind the `config-toml` Cargo feature. Now you can define your Tauri configuration in a `Tauri.toml` file:

    [build]dev-path = "http://localhost:8000"dist-dir = "../dist"

### [Dependency Updates](https://tauri.app/blog/tauri-1-1/#dependency-updates)

[Section titled “Dependency Updates”](https://tauri.app/blog/tauri-1-1/#dependency-updates)

This release includes some dependency updates that must be handled in your app if you implement platform-specific functionalities using these crates. The most important updates are:

*   `windows` updated to 0.39.0
*   `webview2-com` updated to 0.19.1
*   `raw-window-handle` updated to 0.5.0

Make sure you also update plugins such as `window-vibrancy` and `window-shadows` to latest.

[Contributors to 1.1.0](https://tauri.app/blog/tauri-1-1/#contributors-to-110)

-------------------------------------------------------------------------------

[Section titled “Contributors to 1.1.0”](https://tauri.app/blog/tauri-1-1/#contributors-to-110)

The Tauri team thanks the following contributors for the 1.1.0 release:

*   [Berrysoft](https://github.com/Berrysoft)
    
*   [keraf](https://github.com/keraf)
    
*   [jsoref](https://github.com/jsoref)
    
*   [A-kirami](https://github.com/A-kirami)
    
*   [olivierlemasle](https://github.com/olivierlemasle)
    
*   [mateo-gallardo](https://github.com/mateo-gallardo)
    
*   [rockerBOO](https://github.com/rockerBOO)
    
*   [Flecart](https://github.com/Flecart)
    
*   [brian14708](https://github.com/brian14708)
    
*   [koriwi](https://github.com/koriwi)
    
*   [paul-soporan](https://github.com/paul-soporan)
    
*   [shniubobo](https://github.com/shniubobo)
    
*   [horochx](https://github.com/horochx)
    
*   [RubenKelevra](https://github.com/RubenKelevra)
    
*   [LIMPIX31](https://github.com/LIMPIX31)
    
*   [AxlLind](https://github.com/AxlLind)
    

[Other Changes](https://tauri.app/blog/tauri-1-1/#other-changes)

=================================================================

[Section titled “Other Changes”](https://tauri.app/blog/tauri-1-1/#other-changes)

There are a lot of smaller changes and bug fixes in this release. You can see a summary of the release notes in the following sections. The complete changelog can be found on the [releases page](https://tauri.app/releases)
.

[New](https://tauri.app/blog/tauri-1-1/#new)

---------------------------------------------

[Section titled “New”](https://tauri.app/blog/tauri-1-1/#new)

*   `tauri icon` command
*   `exists` API in the `fs` module
*   Option to disable the dev watcher with `tauri dev --no-watch`
*   Automatically use any `.taurignore` file as ignore rules for dev watcher and app path finder
*   Add support to cargo-binstall for the Tauri CLI
*   TOML configuration format (Tauri.toml)
*   Theme APIs on Linux
*   Create system trays at runtime
*   `beforeBundleCommand` configuration
*   `beforeDevCommand` and `beforeBuildCommand` now has an option to configure the current working directory
*   `api::Command::encoding` method to set the stdout/stderr encoding
*   Added `native-tls-vendored` and `reqwest-native-tls-vendored` Cargo features to compile and statically link to a vendored copy of OpenSSL on Linux
*   Implement `raw_window_handle::HasRawDisplayHandle` for `App` and `AppHandle`

[Fixes](https://tauri.app/blog/tauri-1-1/#fixes)

-------------------------------------------------

[Section titled “Fixes”](https://tauri.app/blog/tauri-1-1/#fixes)

*   CLI parser ignoring inner subcommands.
*   Updater breaking the app icon in Finder.
*   Fix root of codegen output when using the `CodegenContext` API.

[Security](https://tauri.app/blog/tauri-1-1/#security)

-------------------------------------------------------

[Section titled “Security”](https://tauri.app/blog/tauri-1-1/#security)

*   Fix `fs.readDir` recursive option reading symlinked directories that are not allowed by the scope

[Improvements](https://tauri.app/blog/tauri-1-1/#improvements)

---------------------------------------------------------------

[Section titled “Improvements”](https://tauri.app/blog/tauri-1-1/#improvements)

*   Validate updater signature against configured public key
*   Return an error if a sidecar is configured with the same file name as the application.
*   Keep the created windows in a RefCell instead of a Mutex, avoiding deadlocks
*   Prompt for `beforeDevCommand` and `beforeBuildCommand` in `tauri init`.
*   Use `cargo metadata` to detect the workspace root and target directory.
*   Allow configuring the `before_dev_command` to force the CLI to wait for the command to finish before proceeding.
*   Avoid re-downloading AppImage build tools on every build.
*   Retain command line arguments in `api::process::restart`
*   Enhance the dialog style on Windows via the manifest dependency `Microsoft.Windows.Common-Controls v6.0.0.0`.
*   Rerun codegen if assets or icons change
*   Only rewrite temporary icon files when the content change, avoid needless rebuilds.

[Announcing tauri-egui 0.1.0](https://tauri.app/blog/tauri-egui-0-1/)

[Tauri Programme Turns 1 and Board Elections](https://tauri.app/blog/tauri-programme-turns-1-and-board-elections/)

* * *

[Support on Open Collective](https://opencollective.com/tauri)
 [Sponsor on GitHub](https://github.com/sponsors/tauri-apps)

© 2026 Tauri Contributors. CC-BY / MIT

---

# Tauri Board Elections & Governance Update | Tauri

[Skip to content](https://tauri.app/blog/tauri-board-elections-and-governance-updates/#_top)

Tauri Board Elections & Governance Update
=========================================

Jun 15, 2023

![Robin van Boven](https://tauri.app/authors/Beanow.png)

Robin van Boven

Tauri Board Director

![Jacob Bolda](https://tauri.app/authors/jbolda.jpeg)

Jacob Bolda

Tauri Board Director

![Lorenzo Lewis](https://tauri.app/authors/lorenzolewis.png)

Lorenzo Lewis

Tauri Community Lead

The Tauri Programme is celebrating it’s two year anniversary of Tauri becoming a programme within [The Commons Conservancy](https://commonsconservancy.org/)
 as well as the one year milestone of the [Tauri 1.0 release](https://tauri.app/blog/tauri-1-0/)
. This also means we’re preparing for the next round of Tauri Board Director elections to welcome in the next chapter of Tauri.

We wanted to celebrate these milestones but also use this as a chance to reflect on how we’ve grown since the Tauri 1.0 launch and how to continue evolving Tauri. The Tauri Working Group has been building the next iteration of the governance model for the past several months to make it more accessible for new and existing contributors, and ultimately sustainable for the future of Tauri.

[Board Elections](https://tauri.app/blog/tauri-board-elections-and-governance-updates/#board-elections)

--------------------------------------------------------------------------------------------------------

[Section titled “Board Elections”](https://tauri.app/blog/tauri-board-elections-and-governance-updates/#board-elections)

The Tauri Board of Directors is the central decision-making body for the Tauri Programme and is responsible for the overall health and stability of the Tauri Programme. Additional details can be found on the [Tauri Governance page](https://tauri.app/about/governance)
.

In order to provide continuity from one year to another, the elections of seats are staggered over the course of 2 years. This means that one year a portion of the seats are elected, and the following year the remaining seats are elected. A Tauri Director seat is an elected position with a term of 2 years. The Board has a minimum of 3 Directors and a maximum of 7. This year there are 5 seats open for election.

### [Diversity](https://tauri.app/blog/tauri-board-elections-and-governance-updates/#diversity)

[Section titled “Diversity”](https://tauri.app/blog/tauri-board-elections-and-governance-updates/#diversity)

This year we’d like to focus on diversifying the Tauri Board. We’re looking for candidates that may be a developer who’s worked on Tauri, a stakeholder in Tauri’s future, experienced individuals from industry, or a person with a passion for regulatory and legal aspects within open source. **If any or all of these are of interest to you then we’d invite you to apply as a candidate.**

### [Applying for Candidacy](https://tauri.app/blog/tauri-board-elections-and-governance-updates/#applying-for-candidacy)

[Section titled “Applying for Candidacy”](https://tauri.app/blog/tauri-board-elections-and-governance-updates/#applying-for-candidacy)

There are 3 steps to express interest and apply for candidacy:

1.  Learn about the role of a Tauri Board Director on the [Governance page](https://tauri.app/about/governance#tauri-board--board-directors)
    .
2.  Prepare a written introduction about yourself that covers who you are, your history and relevance for Tauri, and what you would like to bring to the Board.
3.  **Apply prior to July 2nd, 2023** by emailing [board@tauri.app](mailto:board@tauri.app)
    , messaging the `@board` role on the [Tauri Discord](https://discord.com/invite/tauri)
    , or by directly messaging Daniel Thompson-Yvetot on Discord (`@Denjell`) or email ([denjell@tauri.app](mailto:denjell@tauri.app)
    ).

Voting will take place starting on July 5th through July 12th, 2023 where Tauri Working Group Members will cast their votes. We’re expecting to announce the results on or before July 16, 2023. If elected, we’ll ask you to sign [this pledge](https://dracc.commonsconservancy.org/0016/)
 if you haven’t done so previously.

If you have any questions or would like more information please reach out by emailing [board@tauri.app](mailto:board@tauri.app)
, messaging the `@board` role on the [Tauri Discord](https://discord.com/invite/tauri)
, or by directly messaging Daniel Thompson-Yvetot on Discord (`@Denjell`) or email ([denjell@tauri.app](mailto:denjell@tauri.app)
).

* * *

[Governance Update](https://tauri.app/blog/tauri-board-elections-and-governance-updates/#governance-update)

------------------------------------------------------------------------------------------------------------

[Section titled “Governance Update”](https://tauri.app/blog/tauri-board-elections-and-governance-updates/#governance-update)

Tauri has always had a Working Group that’s responsible for the day-to-day direction and execution, but as we grew it became clear that we needed to evolve the Working Group. We also wanted to give new Working Group members a clear places to jump in and get started. We thought of how we could achieve this while building and iterating on the existing framework. **With these goals in mind, we created two new concepts within the Working Group: Domains and Domain Leads.**

### [Domains](https://tauri.app/blog/tauri-board-elections-and-governance-updates/#domains)

[Section titled “Domains”](https://tauri.app/blog/tauri-board-elections-and-governance-updates/#domains)

A Domain in the Working Group represents a specific area of interest. We’re starting with these 4 domains:

*   **Development**: Developing and maintaining the Tauri software
*   **Community**: Looks after the broader community resources and the public presence of Tauri
*   **Governance & Guidance**: Involved with all things organizational in nature
*   **Operations**: Responsible for all the tooling and infrastructure Tauri needs to get work done

This gives clear entry points for a new member of the Working Group to jump into right away. It also allows us to continue growing our core competency of core Tauri development while giving additional focus to all areas which support the Tauri organization as a whole. Each of these domains will be represented by Domain Members and Domain Leads, but membership is not mutually exclusive.

### [Domain Leads](https://tauri.app/blog/tauri-board-elections-and-governance-updates/#domain-leads)

[Section titled “Domain Leads”](https://tauri.app/blog/tauri-board-elections-and-governance-updates/#domain-leads)

Within a domain, there is a position for 2-3 Domain Leads. These are core individuals in the Working Group that are critical to their respective Domain. They help by setting the direction and priorities for their domain while also serving as key leaders for the Working Group as a whole.

Leads are appointed twice a year, in the spring and in the fall. Since this governance update is being rolled out mid-term we’re appointing interim leads that have been key members of the Working Group. This fall we’ll reflect on the initial experience and host a new round to appoint the Domain Leads. We’ll announce information for that process when we’re closer to “appointment season”.

* * *

We hope that these changes provide the foundation to continue the journey the Tauri Working Group has been on while also catalyzing the continued growth and sustainability of the organization. You can learn more about these updates in the [Governance and Guidance repo on GitHub](https://github.com/tauri-apps/governance-and-guidance)
. Give us your feedback on the [GitHub Discussion for this post](https://github.com/tauri-apps/tauri-docs/discussions/1297)
.

[Roadmap to Tauri 2.0](https://tauri.app/blog/roadmap-to-tauri-2-0/)

[Announcing Tauri 1.4.0](https://tauri.app/blog/tauri-1-4/)

* * *

[Support on Open Collective](https://opencollective.com/tauri)
 [Sponsor on GitHub](https://github.com/sponsors/tauri-apps)

© 2026 Tauri Contributors. CC-BY / MIT

---

# create-tauri-app Version 3 Released | Tauri

[Skip to content](https://tauri.app/blog/create-tauri-app-version-3-released/#_top)

create-tauri-app Version 3 Released
===================================

Mar 1, 2023

![Amr Bashir](https://tauri.app/authors/amrbashir.png)

Amr Bashir

Tauri Development

![hero image](https://tauri.app/_astro/header.cyPt1LbD_Z1iyGz2.webp)

A new major version of [create-tauri-app](https://github.com/tauri-apps/create-tauri-app)
 has been released. This version adds support for the alpha version of Tauri 2.0, the ability to initialize iOS and Android projects and removes some less commonly used templates to make the project more maintainable.

[Tauri 2.0 Alpha & Mobile Support](https://tauri.app/blog/create-tauri-app-version-3-released/#tauri-20-alpha--mobile-support)

-------------------------------------------------------------------------------------------------------------------------------

[Section titled “Tauri 2.0 Alpha & Mobile Support”](https://tauri.app/blog/create-tauri-app-version-3-released/#tauri-20-alpha--mobile-support)

The [first alpha version of Tauri 2.0 was published almost 3 months ago](https://tauri.app/blog/2022/12/09/tauri-mobile-alpha)
 which brought initial mobile support for Android and iOS. Previously there wasn’t an easy way to create a new project to test either the changes in the alpha version nor the mobile support. Well, that ends now!

Starting with version 3 of [create-tauri-app](https://github.com/tauri-apps/create-tauri-app)
, you can now pass `--beta` flag and it will bootstrap an app that uses `tauri@2.0.0-beta`. When adding the `--beta` flag it will automatically prompt you if you’d like to add mobile support. You can also use the `--mobile` flag to automatically make it mobile compatible.

To get started:

    # pnpmpnpm create tauri-app --alpha
    # yarnyarn create tauri-app --alpha
    # npmnpm create tauri-app -- --alpha
    # Cargocargo install create-tauri-app --lockedcargo create-tauri-app --alpha
    # Bashsh <(curl https://create.tauri.app/sh) --alpha
    # Powershell$env:CTA_ARGS="--alpha";iwr -useb https://create.tauri.app/ps | iex

[Prompt Improvements](https://tauri.app/blog/create-tauri-app-version-3-released/#prompt-improvements)

-------------------------------------------------------------------------------------------------------

[Section titled “Prompt Improvements”](https://tauri.app/blog/create-tauri-app-version-3-released/#prompt-improvements)

With version 2 of create-tauri-app we also focused on improving the flow and experience of the prompted questions.

Previously the second prompt would ask “Choose your package manager”. This was a bit vague and could leave some with unanswered questions:

*   What is `cargo`?
*   Is it a new Node.js package manager?
*   Why choose it over `pnpm` or `yarn`?

This would be even more vague if we decided to add a new frontend language (such as a webassembly Golang web application). We added a prompt asking to choose the package manager to ask which language would you prefer. It looks something like this:

    ? Choose which language to use for your frontend ›  Rust❯ TypeScript / JavaScript  (pnpm, yarn, npm)

After choosing the frontend language create-tauri-app will then prompt for package manager to use if the language has multiple (such as Node.js with npm, yarn, and pnpm).

Another prompt that we felt problematic was the template selection prompt. It contained a lot of templates to choose from and was only growing with time:

    ✔ Choose your package manager · pnpm? Choose your UI template ›  vanilla  vanilla-ts  vue❯ vue-ts  svelte  svelte-ts  react  react-ts  solid  solid-ts  next  next-ts  preact  preact-ts  angular  clojurescript  svelte-kit  svelte-kit-ts

We decided to split this up into 2 prompts. The first will ask which UI template to use:

    ✔ Choose your package manager · pnpm? Choose your UI template ›  Vanilla❯ Vue  Svelte  React  Solid  Angular  Next  SvelteKit  ClojureScript  Preact

And then the second will then ask any additional choices that are specific to that template (such as choosing between TypeScript or JavaScript for Vue):

    ✔ Choose your package manager · pnpm✔ Choose your UI template · Vue - (https://vuejs.org)? Choose your UI flavor ›❯ TypeScript  JavaScript

Even with these refinements the list of templates was still quite large and would only grow over time. The next thing to look at was the list of templates themselves.

[Removing Templates](https://tauri.app/blog/create-tauri-app-version-3-released/#removing-templates)

-----------------------------------------------------------------------------------------------------

[Section titled “Removing Templates”](https://tauri.app/blog/create-tauri-app-version-3-released/#removing-templates)

When create-tauri-app version 2 was launched it quickly received PRs to add additional templates beyond what it originally launched with. While it was exciting to receive so much support from the community, it did bring up a couple of new challenges:

*   It made it almost impossible to fit them in a single prompt
*   Maintaining all the templates was becoming more difficult

It was a hard balance between showing how flexible Tauri is but also making sure that the project was maintainable and had the DX that we wanted.

We decided to focus on the most popular frontend frameworks and used guidance from community surveys like [The State of JS](https://2022.stateofjs.com/en-US/libraries/front-end-frameworks/)
 and our own Tauri community feedback. With this we removed the `next`, `next-ts`, `preact`, `preact-ts`, `clojurescript`, `svelte-kit` and `svelte-kit-ts` templates and also closed PRs which aimed to add more templates.

[Community-Maintained Templates & Previous Versions](https://tauri.app/blog/create-tauri-app-version-3-released/#community-maintained-templates--previous-versions)

--------------------------------------------------------------------------------------------------------------------------------------------------------------------

[Section titled “Community-Maintained Templates & Previous Versions”](https://tauri.app/blog/create-tauri-app-version-3-released/#community-maintained-templates--previous-versions)

We want to make sure that we offer a place for the Tauri community to provide their own templates for the frameworks they love. The templates section of [awesome-tauri](https://github.com/tauri-apps/awesome-tauri#templates)
 is just the place for that. We invite the community to submit a PR to the awesome-tauri repo with their templates so that they can be shared with the Tauri community. We’ll also be creating a section on the Tauri website to highlight and showcase these community templates.

If you’d still like to use the previous templates from version 2 of create-tauri-app they are still published to npm and crates.io. Here’s how you can use a previous version:

    # pnpmpnpm create tauri-app@2
    # yarnyarn create tauri-app@2
    # npmnpm create tauri-app@2
    # Cargocargo install create-tauri-app --version 2.8.0 --lockedcargo create-tauri-app
    # Bashsh <(curl https://create.tauri.app/v/2.8.0/sh)
    # Powershelliwr -useb https://create.tauri.app/v/2.8.0/ps | iex

However, as time goes, these templates will become out of date as Tauri and the frontend frameworks move forward. We’d recommend you look at the community templates in the [awesome-tauri](https://github.com/tauri-apps/awesome-tauri)
 repo and welcome submissions if something is missing.

* * *

We hope that these changes make it easier for the community to try out the alpha and beta versions of Tauri 2.0 and also make the process to create a new Tauri app easier for everyone! We’d love to hear your feedback and invite you to join the conversation on the [GitHub Discussion for this post](https://github.com/tauri-apps/tauri-docs/discussions/1137)
.

[Tauri 2.0.0-alpha.4 Released](https://tauri.app/blog/tauri-2-0-0-alpha-4/)

[Tauri Community Growth & Feedback](https://tauri.app/blog/tauri-community-growth-and-feedback/)

* * *

[Support on Open Collective](https://opencollective.com/tauri)
 [Sponsor on GitHub](https://github.com/sponsors/tauri-apps)

© 2026 Tauri Contributors. CC-BY / MIT

---

# Tauri Community Growth & Feedback | Tauri

[Skip to content](https://tauri.app/blog/tauri-community-growth-and-feedback/#_top)

Tauri Community Growth & Feedback
=================================

Feb 9, 2023

![Lorenzo Lewis](https://tauri.app/authors/lorenzolewis.png)

Lorenzo Lewis

Tauri Community Lead

![Amr Bashir](https://tauri.app/authors/amrbashir.png)

Amr Bashir

Tauri Development

![Community growth and feedback hero image](https://tauri.app/_astro/header.B87fyYky_ZWmyDP.webp)

Tauri has had an amazing past year. We [launched Tauri 1.0](https://tauri.app/blog/2022/06/19/tauri-1-0/)
, [announced the alpha version of Tauri Mobile](https://tauri.app/blog/2022/12/09/tauri-mobile-alpha)
 and gathered a lot of valuable feedback from our community and users in the 2022 Tauri Community Survey.

[Tauri Community Survey Results](https://tauri.app/blog/tauri-community-growth-and-feedback/#tauri-community-survey-results)

-----------------------------------------------------------------------------------------------------------------------------

[Section titled “Tauri Community Survey Results”](https://tauri.app/blog/tauri-community-growth-and-feedback/#tauri-community-survey-results)

This year, we had over 600 responses to the Tauri Community Survey (over 3x more than the previous survey’s responses). We’d like to extend a very special thank you to [Wu Yu Wei](https://github.com/wusyong)
 and [DK Liao](https://github.com/dklassic)
 for translating the survey from English into Simplified and Traditional Chinese so that we could include more people from the community and their feedback in the survey. You can download the public data for the survey [here](https://tauri.app/tauri-community-survey-2022-data.csv)
.

We’ve heard your feedback and have started a couple of projects to directly address it. The first one we’d like to talk about is search.

[Search Improvements on Tauri.app](https://tauri.app/blog/tauri-community-growth-and-feedback/#search-improvements-on-tauriapp)

--------------------------------------------------------------------------------------------------------------------------------

[Section titled “Search Improvements on Tauri.app”](https://tauri.app/blog/tauri-community-growth-and-feedback/#search-improvements-on-tauriapp)

Without searching, can you ever find something? And if your telescope is cracked, can you see the planets or stars? We know that our search lens was dusty and scratched; it felt sometimes like a roll of the dice, and some folks even [resorted to using ChatGPT](https://twitter.com/danielcroe/status/1619703406482059265)
 to find answers.

Search has been a project that we’ve taken a few runs at over the years, but we’ve also learned that it’s not quite as easy as it first seems. [Ken](https://github.com/yankeeinlondon)
 from the Tauri Working Group did inspirational work with the previous `tauri-search` project. He created a lot of the foundation and research in the previous project for us to understand what goes into search.

* * *

With the next iteration of search, we had three goals in mind:

1.  Keep it maintainable
2.  Keep it working
3.  Keep it open source

### [Search Engine](https://tauri.app/blog/tauri-community-growth-and-feedback/#search-engine)

[Section titled “Search Engine”](https://tauri.app/blog/tauri-community-growth-and-feedback/#search-engine)

First, we needed to choose a backend search engine to store and serve the search index. When evaluating search engines, we wanted to make sure we used something that shared our values of open source software and a small footprint. After comparing and researching players in the search market (and also learning from our previous approach with Meilisearch), we decided on Meilisearch because we knew it fit both of those goals.

[Meilisearch](https://www.meilisearch.com/)
 have a passion for open source software and even has their [search engine built in Rust](https://github.com/meilisearch/meilisearch)
 which has a tiny footprint and great performance. They’ve [recently announced Meilisearch 1.0](https://blog.meilisearch.com/v1-enterprise-ready-stable/)
 and now also have a cloud offering for those who would like a managed instance.

We decided to partner up with Meilisearch to use their engine and their Meilisearch Cloud offering to host our search engine. They graciously sponsored a hosted plan that they manage for us. This lets us focus on building Tauri, knowing that the maintenance and upkeep of the search engine are in trusted hands.

### [Search Ingestion & Indexing](https://tauri.app/blog/tauri-community-growth-and-feedback/#search-ingestion--indexing)

[Section titled “Search Ingestion & Indexing”](https://tauri.app/blog/tauri-community-growth-and-feedback/#search-ingestion--indexing)

The next piece of the puzzle is to actually get the content indexed and ingested into the search engine. [Fabian](https://github.com/FabianLars)
 from the Tauri Working Group set up the project using the [docs-scraper](https://github.com/meilisearch/docs-scraper)
 project from Meilisearch.

Previously, we had a setup that would take our markdown documentation and JavaScript AST and use that to build the search index. Although it led to much faster indexing times, it meant we had a tightly coupled dependency between search indexing and the way we rendered content on our website. This would sometimes lead to the search results getting out of sync with the content on the live website. In order to update the website or optimize the indexer, someone would need to have knowledge of both, making it more difficult to maintain.

With the current version of the scraper, we can handle all of the configuration and tweaking of results with a [single JSON file](https://github.com/tauri-apps/tauri-docs/blob/dev/scraper.json)
 and let the scraper take care of the rest. We set up a GitHub action that would perform the scraping as part of our CI/CD pipeline and then send those results to our Meilisearch Cloud instance.

### [Search Frontend](https://tauri.app/blog/tauri-community-growth-and-feedback/#search-frontend)

[Section titled “Search Frontend”](https://tauri.app/blog/tauri-community-growth-and-feedback/#search-frontend)

The final step was to create the frontend UI that people visiting [tauri.app](https://tauri.app/)
 would interact with. [Amr](https://github.com/amrbashir)
 from the Tauri Working Group created the [meilisearch-docsearch](https://github.com/tauri-apps/meilisearch-docsearch)
 project to help with this. This repo is compatible with Meilisearch 1.0 (we’re using it now on [tauri.app](https://tauri.app/)
).

It’s inspired by the [algolia/docsearch](https://github.com/algolia/docsearch/)
 and [meilisearch/docs-searchbar.js](https://github.com/meilisearch/docs-searchbar.js/)
 projects that provided a very solid foundation to begin with. The beauty of open source is that we can learn from each other and use that to give back to the ecosystem.

To talk through some of the details, I’ll hand it over to Amr:

* * *

The [meilisearch/docs-searchbar.js](https://github.com/meilisearch/docs-searchbar.js/)
 project was good, but I always felt it could use some improvements to get feature parity with [algolia/docsearch](https://github.com/algolia/docsearch/)
. I also felt we could help with an update to help with UI/UX.

The main pain points with [meilisearch/docs-searchbar.js](https://github.com/meilisearch/docs-searchbar.js/)
 were:

1.  On mobile screens, it needed UI/UX improvements so that the search results wouldn’t go off-screen.
2.  On desktop, the search results would normally appear under the search input, which in the case of [tauri.app](https://tauri.app/)
     was placed on the top-right. This caused a bad UX because you’d have to keep moving your eyes between the page content in the middle and the search results in the top-right.
3.  It is missing a common keybinding. `ctrl/command + K` to start the search, `ctrl/command + K` is pretty common in the JS ecosystem documentation sites. It also doesn’t have the ability to select text on the page and then trigger a search directly from that text.

I have been always a big fan of [algolia/docsearch](https://github.com/algolia/docsearch/)
 UI/UX. It checked all the features on my list, and I always wanted to have that for [tauri.app](https://tauri.app/)
. In fact, several months ago, I tried to change the [meilisearch/docs-searchbar.js](https://github.com/meilisearch/docs-searchbar.js/)
 CSS on our end to improve point 1 and 2 above but I stopped mid-way because of the difficulty of building on top of existing css and fighting for highest specifity (plus CSS is hard :wink:). Other projects also couldn’t benefit from our modifications in an easy way.

Later, we were discussing how to improve the search UI and UX, and we decided that we could improve on the base Meilisearch UI. That project turned into [meilisearch-docsearch](https://github.com/tauri-apps/meilisearch-docsearch)
.

### [Seeing It In Action](https://tauri.app/blog/tauri-community-growth-and-feedback/#seeing-it-in-action)

[Section titled “Seeing It In Action”](https://tauri.app/blog/tauri-community-growth-and-feedback/#seeing-it-in-action)

The good news is that all of these changes are live! You can see the new search on [tauri.app](https://tauri.app/)
. We’d love to hear your feedback on what works and what could use improvement in the [GitHub Discussion for this blog post](https://github.com/tauri-apps/tauri-docs/discussions/1115)
. We invite you to not only report bugs, but also if your search result wasn’t expected or should be higher up on the list of results.

![Search Preview](https://tauri.app/_astro/search_preview.vAj7BCCo_1Jc9da.webp)

We’d like to wrap up by extending a special thank you to [Ken](https://github.com/yankeeinlondon)
 for the original Tauri Search project, [Amr](https://github.com/amrbashir)
 for the [meilisearch-docsearch](https://github.com/tauri-apps/meilisearch-docsearch)
 project, [Fabian](https://github.com/FabianLars)
 for writing the revised index scraper and continuous testing, Meilisearch for their partnership and the Meilisearch Cloud instance and finally the Tauri community for their continual feedback to help us drive Tauri and the community forward.

[Next Steps](https://tauri.app/blog/tauri-community-growth-and-feedback/#next-steps)

-------------------------------------------------------------------------------------

[Section titled “Next Steps”](https://tauri.app/blog/tauri-community-growth-and-feedback/#next-steps)

Over the next year, the Tauri Working Group is excited to continue working towards Tauri 2.0. We also have a website rewrite in the works that we’ll be launching in beta this spring. If you’d like to get involved, you can reach out to us in the [Tauri Discord](https://discord.com/invite/tauri)
 and follow us on [Mastodon](https://fosstodon.org/@TauriApps)
 and [Twitter](https://twitter.com/TauriApps)
.

[create-tauri-app Version 3 Released](https://tauri.app/blog/create-tauri-app-version-3-released/)

[Migration to webkit2gtk-4.1 on Linux port](https://tauri.app/blog/tauri-2-0-0-alpha-3/)

* * *

[Support on Open Collective](https://opencollective.com/tauri)
 [Sponsor on GitHub](https://github.com/sponsors/tauri-apps)

© 2026 Tauri Contributors. CC-BY / MIT

---

# Blog | Tauri

[Skip to content](https://tauri.app/blog/3/#_top)

Blog
====

The Tauri team is happy to announce the 1.5.0 release.

Tauri 1.0 was released in June 2022 and introduced an app toolkit for developers to build apps using HTML, CSS, and JavaScript with the security and performance of Rust.

The Tauri Programme is celebrating it’s two year anniversary of Tauri becoming a programme within The Commons Conservancy as well as the one year milestone of the Tauri 1.0 release. This also means we’re preparing for the next round of Tauri Board Director elections to welcome in the next chapter of Tauri.

The Tauri team is happy to announce the 1.4.0 release.

The Tauri team is happy to announce the 1.3.0 release.

* * *

[Support on Open Collective](https://opencollective.com/tauri)
 [Sponsor on GitHub](https://github.com/sponsors/tauri-apps)

© 2026 Tauri Contributors. CC-BY / MIT

---

# @tauri-apps/plugin-sql | Tauri

[Skip to content](https://tauri.app/reference/javascript/sql/#_top)

@tauri-apps/plugin-sql
======================

[Classes](https://tauri.app/reference/javascript/sql/#classes)

---------------------------------------------------------------

[Section titled “Classes”](https://tauri.app/reference/javascript/sql/#classes)

### [default](https://tauri.app/reference/javascript/sql/#default)

[Section titled “default”](https://tauri.app/reference/javascript/sql/#default)

**Database**

The `Database` class serves as the primary interface for communicating with the rust side of the sql plugin.

#### [Constructors](https://tauri.app/reference/javascript/sql/#constructors)

[Section titled “Constructors”](https://tauri.app/reference/javascript/sql/#constructors)

##### [new default()](https://tauri.app/reference/javascript/sql/#new-default)

[Section titled “new default()”](https://tauri.app/reference/javascript/sql/#new-default)

    new default(path): default

###### [Parameters](https://tauri.app/reference/javascript/sql/#parameters)

[Section titled “Parameters”](https://tauri.app/reference/javascript/sql/#parameters)

| Parameter | Type |
| --- | --- |
| `path` | `string` |

###### [Returns](https://tauri.app/reference/javascript/sql/#returns)

[Section titled “Returns”](https://tauri.app/reference/javascript/sql/#returns)

[`default`](https://tauri.app/reference/javascript/sql/#default)

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/sql/guest-js/index.ts#L29](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/sql/guest-js/index.ts#L29)

#### [Properties](https://tauri.app/reference/javascript/sql/#properties)

[Section titled “Properties”](https://tauri.app/reference/javascript/sql/#properties)

| Property | Type | Defined in |
| --- | --- | --- |
| `path` | `string` | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/sql/guest-js/index.ts#L28](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/sql/guest-js/index.ts#L28) |

#### [Methods](https://tauri.app/reference/javascript/sql/#methods)

[Section titled “Methods”](https://tauri.app/reference/javascript/sql/#methods)

##### [close()](https://tauri.app/reference/javascript/sql/#close)

[Section titled “close()”](https://tauri.app/reference/javascript/sql/#close)

    close(db?): Promise<boolean>

**close**

Closes the database connection pool.

###### [Parameters](https://tauri.app/reference/javascript/sql/#parameters-1)

[Section titled “Parameters”](https://tauri.app/reference/javascript/sql/#parameters-1)

| Parameter | Type | Description |
| --- | --- | --- |
| `db`? | `string` | Optionally state the name of a database if you are managing more than one. Otherwise, all database pools will be in scope. |

###### [Returns](https://tauri.app/reference/javascript/sql/#returns-1)

[Section titled “Returns”](https://tauri.app/reference/javascript/sql/#returns-1)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`boolean`\>

###### [Example](https://tauri.app/reference/javascript/sql/#example)

[Section titled “Example”](https://tauri.app/reference/javascript/sql/#example)

    const success = await db.close()

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/sql/guest-js/index.ts#L162](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/sql/guest-js/index.ts#L162)

##### [execute()](https://tauri.app/reference/javascript/sql/#execute)

[Section titled “execute()”](https://tauri.app/reference/javascript/sql/#execute)

    execute(query, bindValues?): Promise<QueryResult>

**execute**

Passes a SQL expression to the database for execution.

###### [Parameters](https://tauri.app/reference/javascript/sql/#parameters-2)

[Section titled “Parameters”](https://tauri.app/reference/javascript/sql/#parameters-2)

| Parameter | Type |
| --- | --- |
| `query` | `string` |
| `bindValues`? | `unknown`\[\] |

###### [Returns](https://tauri.app/reference/javascript/sql/#returns-2)

[Section titled “Returns”](https://tauri.app/reference/javascript/sql/#returns-2)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<[`QueryResult`](https://tauri.app/reference/javascript/sql/#queryresult)
\>

###### [Example](https://tauri.app/reference/javascript/sql/#example-1)

[Section titled “Example”](https://tauri.app/reference/javascript/sql/#example-1)

    // for sqlite & postgres// INSERT exampleconst result = await db.execute(   "INSERT into todos (id, title, status) VALUES ($1, $2, $3)",   [ todos.id, todos.title, todos.status ]);// UPDATE exampleconst result = await db.execute(   "UPDATE todos SET title = $1, completed = $2 WHERE id = $3",   [ todos.title, todos.status, todos.id ]);
    // for mysql// INSERT exampleconst result = await db.execute(   "INSERT into todos (id, title, status) VALUES (?, ?, ?)",   [ todos.id, todos.title, todos.status ]);// UPDATE exampleconst result = await db.execute(   "UPDATE todos SET title = ?, completed = ? WHERE id = ?",   [ todos.title, todos.status, todos.id ]);

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/sql/guest-js/index.ts#L108](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/sql/guest-js/index.ts#L108)

##### [select()](https://tauri.app/reference/javascript/sql/#select)

[Section titled “select()”](https://tauri.app/reference/javascript/sql/#select)

    select<T>(query, bindValues?): Promise<T>

**select**

Passes in a SELECT query to the database for execution.

###### [Type Parameters](https://tauri.app/reference/javascript/sql/#type-parameters)

[Section titled “Type Parameters”](https://tauri.app/reference/javascript/sql/#type-parameters)

| Type Parameter |
| --- |
| `T` |

###### [Parameters](https://tauri.app/reference/javascript/sql/#parameters-3)

[Section titled “Parameters”](https://tauri.app/reference/javascript/sql/#parameters-3)

| Parameter | Type |
| --- | --- |
| `query` | `string` |
| `bindValues`? | `unknown`\[\] |

###### [Returns](https://tauri.app/reference/javascript/sql/#returns-3)

[Section titled “Returns”](https://tauri.app/reference/javascript/sql/#returns-3)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`T`\>

###### [Example](https://tauri.app/reference/javascript/sql/#example-2)

[Section titled “Example”](https://tauri.app/reference/javascript/sql/#example-2)

    // for sqlite & postgresconst result = await db.select(   "SELECT * from todos WHERE id = $1", [ id ]);
    // for mysqlconst result = await db.select(   "SELECT * from todos WHERE id = ?", [ id ]);

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/sql/guest-js/index.ts#L141](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/sql/guest-js/index.ts#L141)

##### [get()](https://tauri.app/reference/javascript/sql/#get)

[Section titled “get()”](https://tauri.app/reference/javascript/sql/#get)

    static get(path): default

**get**

A static initializer which synchronously returns an instance of the Database class while deferring the actual database connection until the first invocation or selection on the database.

[Sqlite](https://tauri.app/reference/javascript/sql/#sqlite)

=============================================================

[Section titled “Sqlite”](https://tauri.app/reference/javascript/sql/#sqlite)

The path is relative to `tauri::path::BaseDirectory::App` and must start with `sqlite:`.

###### [Parameters](https://tauri.app/reference/javascript/sql/#parameters-4)

[Section titled “Parameters”](https://tauri.app/reference/javascript/sql/#parameters-4)

| Parameter | Type |
| --- | --- |
| `path` | `string` |

###### [Returns](https://tauri.app/reference/javascript/sql/#returns-4)

[Section titled “Returns”](https://tauri.app/reference/javascript/sql/#returns-4)

[`default`](https://tauri.app/reference/javascript/sql/#default)

###### [Example](https://tauri.app/reference/javascript/sql/#example-3)

[Section titled “Example”](https://tauri.app/reference/javascript/sql/#example-3)

    const db = Database.get("sqlite:test.db");

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/sql/guest-js/index.ts#L72](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/sql/guest-js/index.ts#L72)

##### [load()](https://tauri.app/reference/javascript/sql/#load)

[Section titled “load()”](https://tauri.app/reference/javascript/sql/#load)

    static load(path): Promise<default>

**load**

A static initializer which connects to the underlying database and returns a `Database` instance once a connection to the database is established.

[Sqlite](https://tauri.app/reference/javascript/sql/#sqlite-1)

===============================================================

[Section titled “Sqlite”](https://tauri.app/reference/javascript/sql/#sqlite-1)

The path is relative to `tauri::path::BaseDirectory::App` and must start with `sqlite:`.

###### [Parameters](https://tauri.app/reference/javascript/sql/#parameters-5)

[Section titled “Parameters”](https://tauri.app/reference/javascript/sql/#parameters-5)

| Parameter | Type |
| --- | --- |
| `path` | `string` |

###### [Returns](https://tauri.app/reference/javascript/sql/#returns-5)

[Section titled “Returns”](https://tauri.app/reference/javascript/sql/#returns-5)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<[`default`](https://tauri.app/reference/javascript/sql/#default)
\>

###### [Example](https://tauri.app/reference/javascript/sql/#example-4)

[Section titled “Example”](https://tauri.app/reference/javascript/sql/#example-4)

    const db = await Database.load("sqlite:test.db");

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/sql/guest-js/index.ts#L48](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/sql/guest-js/index.ts#L48)

[Interfaces](https://tauri.app/reference/javascript/sql/#interfaces)

---------------------------------------------------------------------

[Section titled “Interfaces”](https://tauri.app/reference/javascript/sql/#interfaces)

### [QueryResult](https://tauri.app/reference/javascript/sql/#queryresult)

[Section titled “QueryResult”](https://tauri.app/reference/javascript/sql/#queryresult)

#### [Properties](https://tauri.app/reference/javascript/sql/#properties-1)

[Section titled “Properties”](https://tauri.app/reference/javascript/sql/#properties-1)

| Property | Type | Description | Defined in |
| --- | --- | --- | --- |
| `lastInsertId?` | `number` | The last inserted `id`. This value is not set for Postgres databases. If the last inserted id is required on Postgres, the `select` function must be used, with a `RETURNING` clause (`INSERT INTO todos (title) VALUES ($1) RETURNING id`). | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/sql/guest-js/index.ts#L18](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/sql/guest-js/index.ts#L18) |
| `rowsAffected` | `number` | The number of rows affected by the query. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/sql/guest-js/index.ts#L9](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/sql/guest-js/index.ts#L9) |

* * *

[Support on Open Collective](https://opencollective.com/tauri)
 [Sponsor on GitHub](https://github.com/sponsors/tauri-apps)

© 2026 Tauri Contributors. CC-BY / MIT

---

# @tauri-apps/plugin-autostart | Tauri

[Skip to content](https://tauri.app/reference/javascript/autostart/#_top)

@tauri-apps/plugin-autostart
============================

[Functions](https://tauri.app/reference/javascript/autostart/#functions)

-------------------------------------------------------------------------

[Section titled “Functions”](https://tauri.app/reference/javascript/autostart/#functions)

### [disable()](https://tauri.app/reference/javascript/autostart/#disable)

[Section titled “disable()”](https://tauri.app/reference/javascript/autostart/#disable)

    function disable(): Promise<void>

#### [Returns](https://tauri.app/reference/javascript/autostart/#returns)

[Section titled “Returns”](https://tauri.app/reference/javascript/autostart/#returns)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`void`\>

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/autostart/guest-js/index.ts#L15](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/autostart/guest-js/index.ts#L15)

* * *

### [enable()](https://tauri.app/reference/javascript/autostart/#enable)

[Section titled “enable()”](https://tauri.app/reference/javascript/autostart/#enable)

    function enable(): Promise<void>

#### [Returns](https://tauri.app/reference/javascript/autostart/#returns-1)

[Section titled “Returns”](https://tauri.app/reference/javascript/autostart/#returns-1)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`void`\>

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/autostart/guest-js/index.ts#L11](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/autostart/guest-js/index.ts#L11)

* * *

### [isEnabled()](https://tauri.app/reference/javascript/autostart/#isenabled)

[Section titled “isEnabled()”](https://tauri.app/reference/javascript/autostart/#isenabled)

    function isEnabled(): Promise<boolean>

#### [Returns](https://tauri.app/reference/javascript/autostart/#returns-2)

[Section titled “Returns”](https://tauri.app/reference/javascript/autostart/#returns-2)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`boolean`\>

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/autostart/guest-js/index.ts#L7](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/autostart/guest-js/index.ts#L7)

* * *

[Support on Open Collective](https://opencollective.com/tauri)
 [Sponsor on GitHub](https://github.com/sponsors/tauri-apps)

© 2026 Tauri Contributors. CC-BY / MIT

---

# @tauri-apps/plugin-haptics | Tauri

[Skip to content](https://tauri.app/reference/javascript/haptics/#_top)

@tauri-apps/plugin-haptics
==========================

[Type Aliases](https://tauri.app/reference/javascript/haptics/#type-aliases)

-----------------------------------------------------------------------------

[Section titled “Type Aliases”](https://tauri.app/reference/javascript/haptics/#type-aliases)

### [ImpactFeedbackStyle](https://tauri.app/reference/javascript/haptics/#impactfeedbackstyle)

[Section titled “ImpactFeedbackStyle”](https://tauri.app/reference/javascript/haptics/#impactfeedbackstyle)

    type ImpactFeedbackStyle:  | "light"  | "medium"  | "heavy"  | "soft"  | "rigid";

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/haptics/guest-js/bindings.ts#L76](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/haptics/guest-js/bindings.ts#L76)

* * *

### [NotificationFeedbackType](https://tauri.app/reference/javascript/haptics/#notificationfeedbacktype)

[Section titled “NotificationFeedbackType”](https://tauri.app/reference/javascript/haptics/#notificationfeedbacktype)

    type NotificationFeedbackType: "success" | "warning" | "error";

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/haptics/guest-js/bindings.ts#L82](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/haptics/guest-js/bindings.ts#L82)

[Functions](https://tauri.app/reference/javascript/haptics/#functions)

-----------------------------------------------------------------------

[Section titled “Functions”](https://tauri.app/reference/javascript/haptics/#functions)

### [impactFeedback()](https://tauri.app/reference/javascript/haptics/#impactfeedback)

[Section titled “impactFeedback()”](https://tauri.app/reference/javascript/haptics/#impactfeedback)

    function impactFeedback(style): Promise<Result<null, never>>

#### [Parameters](https://tauri.app/reference/javascript/haptics/#parameters)

[Section titled “Parameters”](https://tauri.app/reference/javascript/haptics/#parameters)

| Parameter | Type |
| --- | --- |
| `style` | [`ImpactFeedbackStyle`](https://tauri.app/reference/javascript/haptics/#impactfeedbackstyle) |

#### [Returns](https://tauri.app/reference/javascript/haptics/#returns)

[Section titled “Returns”](https://tauri.app/reference/javascript/haptics/#returns)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`Result`<`null`, `never`\>>

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/haptics/guest-js/index.ts#L11](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/haptics/guest-js/index.ts#L11)

* * *

### [notificationFeedback()](https://tauri.app/reference/javascript/haptics/#notificationfeedback)

[Section titled “notificationFeedback()”](https://tauri.app/reference/javascript/haptics/#notificationfeedback)

    function notificationFeedback(type): Promise<Result<null, never>>

#### [Parameters](https://tauri.app/reference/javascript/haptics/#parameters-1)

[Section titled “Parameters”](https://tauri.app/reference/javascript/haptics/#parameters-1)

| Parameter | Type |
| --- | --- |
| `type` | [`NotificationFeedbackType`](https://tauri.app/reference/javascript/haptics/#notificationfeedbacktype) |

#### [Returns](https://tauri.app/reference/javascript/haptics/#returns-1)

[Section titled “Returns”](https://tauri.app/reference/javascript/haptics/#returns-1)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`Result`<`null`, `never`\>>

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/haptics/guest-js/index.ts#L12](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/haptics/guest-js/index.ts#L12)

* * *

### [selectionFeedback()](https://tauri.app/reference/javascript/haptics/#selectionfeedback)

[Section titled “selectionFeedback()”](https://tauri.app/reference/javascript/haptics/#selectionfeedback)

    function selectionFeedback(): Promise<Result<null, never>>

#### [Returns](https://tauri.app/reference/javascript/haptics/#returns-2)

[Section titled “Returns”](https://tauri.app/reference/javascript/haptics/#returns-2)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`Result`<`null`, `never`\>>

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/haptics/guest-js/index.ts#L13](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/haptics/guest-js/index.ts#L13)

* * *

### [vibrate()](https://tauri.app/reference/javascript/haptics/#vibrate)

[Section titled “vibrate()”](https://tauri.app/reference/javascript/haptics/#vibrate)

    function vibrate(duration): Promise<Result<null, never>>

#### [Parameters](https://tauri.app/reference/javascript/haptics/#parameters-2)

[Section titled “Parameters”](https://tauri.app/reference/javascript/haptics/#parameters-2)

| Parameter | Type |
| --- | --- |
| `duration` | `number` |

#### [Returns](https://tauri.app/reference/javascript/haptics/#returns-3)

[Section titled “Returns”](https://tauri.app/reference/javascript/haptics/#returns-3)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`Result`<`null`, `never`\>>

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/haptics/guest-js/index.ts#L10](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/haptics/guest-js/index.ts#L10)

* * *

[Support on Open Collective](https://opencollective.com/tauri)
 [Sponsor on GitHub](https://github.com/sponsors/tauri-apps)

© 2026 Tauri Contributors. CC-BY / MIT

---

# @tauri-apps/plugin-global-shortcut | Tauri

[Skip to content](https://tauri.app/reference/javascript/global-shortcut/#_top)

@tauri-apps/plugin-global-shortcut
==================================

Register global shortcuts.

[Interfaces](https://tauri.app/reference/javascript/global-shortcut/#interfaces)

---------------------------------------------------------------------------------

[Section titled “Interfaces”](https://tauri.app/reference/javascript/global-shortcut/#interfaces)

### [ShortcutEvent](https://tauri.app/reference/javascript/global-shortcut/#shortcutevent)

[Section titled “ShortcutEvent”](https://tauri.app/reference/javascript/global-shortcut/#shortcutevent)

#### [Properties](https://tauri.app/reference/javascript/global-shortcut/#properties)

[Section titled “Properties”](https://tauri.app/reference/javascript/global-shortcut/#properties)

| Property | Type | Defined in |
| --- | --- | --- |
| `id` | `number` | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/global-shortcut/guest-js/index.ts#L15](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/global-shortcut/guest-js/index.ts#L15) |
| `shortcut` | `string` | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/global-shortcut/guest-js/index.ts#L14](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/global-shortcut/guest-js/index.ts#L14) |
| `state` | `"Released"` \| `"Pressed"` | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/global-shortcut/guest-js/index.ts#L16](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/global-shortcut/guest-js/index.ts#L16) |

[Type Aliases](https://tauri.app/reference/javascript/global-shortcut/#type-aliases)

-------------------------------------------------------------------------------------

[Section titled “Type Aliases”](https://tauri.app/reference/javascript/global-shortcut/#type-aliases)

### [ShortcutHandler()](https://tauri.app/reference/javascript/global-shortcut/#shortcuthandler)

[Section titled “ShortcutHandler()”](https://tauri.app/reference/javascript/global-shortcut/#shortcuthandler)

    type ShortcutHandler: (event) => void;

#### [Parameters](https://tauri.app/reference/javascript/global-shortcut/#parameters)

[Section titled “Parameters”](https://tauri.app/reference/javascript/global-shortcut/#parameters)

| Parameter | Type |
| --- | --- |
| `event` | [`ShortcutEvent`](https://tauri.app/reference/javascript/global-shortcut/#shortcutevent) |

#### [Returns](https://tauri.app/reference/javascript/global-shortcut/#returns)

[Section titled “Returns”](https://tauri.app/reference/javascript/global-shortcut/#returns)

`void`

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/global-shortcut/guest-js/index.ts#L19](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/global-shortcut/guest-js/index.ts#L19)

[Functions](https://tauri.app/reference/javascript/global-shortcut/#functions)

-------------------------------------------------------------------------------

[Section titled “Functions”](https://tauri.app/reference/javascript/global-shortcut/#functions)

### [isRegistered()](https://tauri.app/reference/javascript/global-shortcut/#isregistered)

[Section titled “isRegistered()”](https://tauri.app/reference/javascript/global-shortcut/#isregistered)

    function isRegistered(shortcut): Promise<boolean>

Determines whether the given shortcut is registered by this application or not.

If the shortcut is registered by another application, it will still return `false`.

#### [Parameters](https://tauri.app/reference/javascript/global-shortcut/#parameters-1)

[Section titled “Parameters”](https://tauri.app/reference/javascript/global-shortcut/#parameters-1)

| Parameter | Type | Description |
| --- | --- | --- |
| `shortcut` | `string` | shortcut definition, modifiers and key separated by ”+” e.g. CmdOrControl+Q |

#### [Returns](https://tauri.app/reference/javascript/global-shortcut/#returns-1)

[Section titled “Returns”](https://tauri.app/reference/javascript/global-shortcut/#returns-1)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`boolean`\>

#### [Example](https://tauri.app/reference/javascript/global-shortcut/#example)

[Section titled “Example”](https://tauri.app/reference/javascript/global-shortcut/#example)

    import { isRegistered } from '@tauri-apps/plugin-global-shortcut';const isRegistered = await isRegistered('CommandOrControl+P');

#### [Since](https://tauri.app/reference/javascript/global-shortcut/#since)

[Section titled “Since”](https://tauri.app/reference/javascript/global-shortcut/#since)

2.0.0

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/global-shortcut/guest-js/index.ts#L117](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/global-shortcut/guest-js/index.ts#L117)

* * *

### [register()](https://tauri.app/reference/javascript/global-shortcut/#register)

[Section titled “register()”](https://tauri.app/reference/javascript/global-shortcut/#register)

    function register(shortcuts, handler): Promise<void>

Register a global shortcut or a list of shortcuts.

The handler is called when any of the registered shortcuts are pressed by the user.

If the shortcut is already taken by another application, the handler will not be triggered. Make sure the shortcut is as unique as possible while still taking user experience into consideration.

#### [Parameters](https://tauri.app/reference/javascript/global-shortcut/#parameters-2)

[Section titled “Parameters”](https://tauri.app/reference/javascript/global-shortcut/#parameters-2)

| Parameter | Type | Description |
| --- | --- | --- |
| `shortcuts` | `string` \| `string`\[\] | \-  |
| `handler` | [`ShortcutHandler`](https://tauri.app/reference/javascript/global-shortcut/#shortcuthandler) | Shortcut handler callback - takes the triggered shortcut as argument |

#### [Returns](https://tauri.app/reference/javascript/global-shortcut/#returns-2)

[Section titled “Returns”](https://tauri.app/reference/javascript/global-shortcut/#returns-2)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`void`\>

#### [Example](https://tauri.app/reference/javascript/global-shortcut/#example-1)

[Section titled “Example”](https://tauri.app/reference/javascript/global-shortcut/#example-1)

    import { register } from '@tauri-apps/plugin-global-shortcut';
    // register a single hotkeyawait register('CommandOrControl+Shift+C', (event) => {  if (event.state === "Pressed") {      console.log('Shortcut triggered');  }});
    // or register multiple hotkeys at onceawait register(['CommandOrControl+Shift+C', 'Alt+A'], (event) => {  console.log(`Shortcut ${event.shortcut} triggered`);});

#### [Since](https://tauri.app/reference/javascript/global-shortcut/#since-1)

[Section titled “Since”](https://tauri.app/reference/javascript/global-shortcut/#since-1)

2.0.0

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/global-shortcut/guest-js/index.ts#L51](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/global-shortcut/guest-js/index.ts#L51)

* * *

### [unregister()](https://tauri.app/reference/javascript/global-shortcut/#unregister)

[Section titled “unregister()”](https://tauri.app/reference/javascript/global-shortcut/#unregister)

    function unregister(shortcuts): Promise<void>

Unregister a global shortcut or a list of shortcuts.

#### [Parameters](https://tauri.app/reference/javascript/global-shortcut/#parameters-3)

[Section titled “Parameters”](https://tauri.app/reference/javascript/global-shortcut/#parameters-3)

| Parameter | Type |
| --- | --- |
| `shortcuts` | `string` \| `string`\[\] |

#### [Returns](https://tauri.app/reference/javascript/global-shortcut/#returns-3)

[Section titled “Returns”](https://tauri.app/reference/javascript/global-shortcut/#returns-3)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`void`\>

#### [Example](https://tauri.app/reference/javascript/global-shortcut/#example-2)

[Section titled “Example”](https://tauri.app/reference/javascript/global-shortcut/#example-2)

    import { unregister } from '@tauri-apps/plugin-global-shortcut';
    // unregister a single hotkeyawait unregister('CmdOrControl+Space');
    // or unregister multiple hotkeys at the same timeawait unregister(['CmdOrControl+Space', 'Alt+A']);

#### [Since](https://tauri.app/reference/javascript/global-shortcut/#since-2)

[Section titled “Since”](https://tauri.app/reference/javascript/global-shortcut/#since-2)

2.0.0

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/global-shortcut/guest-js/index.ts#L82](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/global-shortcut/guest-js/index.ts#L82)

* * *

### [unregisterAll()](https://tauri.app/reference/javascript/global-shortcut/#unregisterall)

[Section titled “unregisterAll()”](https://tauri.app/reference/javascript/global-shortcut/#unregisterall)

    function unregisterAll(): Promise<void>

Unregister all global shortcuts.

#### [Returns](https://tauri.app/reference/javascript/global-shortcut/#returns-4)

[Section titled “Returns”](https://tauri.app/reference/javascript/global-shortcut/#returns-4)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`void`\>

#### [Example](https://tauri.app/reference/javascript/global-shortcut/#example-3)

[Section titled “Example”](https://tauri.app/reference/javascript/global-shortcut/#example-3)

    import { unregisterAll } from '@tauri-apps/plugin-global-shortcut';await unregisterAll();

#### [Since](https://tauri.app/reference/javascript/global-shortcut/#since-3)

[Section titled “Since”](https://tauri.app/reference/javascript/global-shortcut/#since-3)

2.0.0

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/global-shortcut/guest-js/index.ts#L98](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/global-shortcut/guest-js/index.ts#L98)

* * *

[Support on Open Collective](https://opencollective.com/tauri)
 [Sponsor on GitHub](https://github.com/sponsors/tauri-apps)

© 2026 Tauri Contributors. CC-BY / MIT

---

# @tauri-apps/plugin-barcode-scanner | Tauri

[Skip to content](https://tauri.app/reference/javascript/barcode-scanner/#_top)

@tauri-apps/plugin-barcode-scanner
==================================

[Enumerations](https://tauri.app/reference/javascript/barcode-scanner/#enumerations)

-------------------------------------------------------------------------------------

[Section titled “Enumerations”](https://tauri.app/reference/javascript/barcode-scanner/#enumerations)

### [Format](https://tauri.app/reference/javascript/barcode-scanner/#format)

[Section titled “Format”](https://tauri.app/reference/javascript/barcode-scanner/#format)

#### [Enumeration Members](https://tauri.app/reference/javascript/barcode-scanner/#enumeration-members)

[Section titled “Enumeration Members”](https://tauri.app/reference/javascript/barcode-scanner/#enumeration-members)

##### [Aztec](https://tauri.app/reference/javascript/barcode-scanner/#aztec)

[Section titled “Aztec”](https://tauri.app/reference/javascript/barcode-scanner/#aztec)

    Aztec: "AZTEC";

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/barcode-scanner/guest-js/index.ts#L30](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/barcode-scanner/guest-js/index.ts#L30)

##### [Codabar](https://tauri.app/reference/javascript/barcode-scanner/#codabar)

[Section titled “Codabar”](https://tauri.app/reference/javascript/barcode-scanner/#codabar)

    Codabar: "CODABAR";

Not supported on iOS.

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/barcode-scanner/guest-js/index.ts#L28](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/barcode-scanner/guest-js/index.ts#L28)

##### [Code128](https://tauri.app/reference/javascript/barcode-scanner/#code128)

[Section titled “Code128”](https://tauri.app/reference/javascript/barcode-scanner/#code128)

    Code128: "CODE_128";

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/barcode-scanner/guest-js/index.ts#L24](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/barcode-scanner/guest-js/index.ts#L24)

##### [Code39](https://tauri.app/reference/javascript/barcode-scanner/#code39)

[Section titled “Code39”](https://tauri.app/reference/javascript/barcode-scanner/#code39)

    Code39: "CODE_39";

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/barcode-scanner/guest-js/index.ts#L22](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/barcode-scanner/guest-js/index.ts#L22)

##### [Code93](https://tauri.app/reference/javascript/barcode-scanner/#code93)

[Section titled “Code93”](https://tauri.app/reference/javascript/barcode-scanner/#code93)

    Code93: "CODE_93";

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/barcode-scanner/guest-js/index.ts#L23](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/barcode-scanner/guest-js/index.ts#L23)

##### [DataMatrix](https://tauri.app/reference/javascript/barcode-scanner/#datamatrix)

[Section titled “DataMatrix”](https://tauri.app/reference/javascript/barcode-scanner/#datamatrix)

    DataMatrix: "DATA_MATRIX";

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/barcode-scanner/guest-js/index.ts#L31](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/barcode-scanner/guest-js/index.ts#L31)

##### [EAN13](https://tauri.app/reference/javascript/barcode-scanner/#ean13)

[Section titled “EAN13”](https://tauri.app/reference/javascript/barcode-scanner/#ean13)

    EAN13: "EAN_13";

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/barcode-scanner/guest-js/index.ts#L21](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/barcode-scanner/guest-js/index.ts#L21)

##### [EAN8](https://tauri.app/reference/javascript/barcode-scanner/#ean8)

[Section titled “EAN8”](https://tauri.app/reference/javascript/barcode-scanner/#ean8)

    EAN8: "EAN_8";

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/barcode-scanner/guest-js/index.ts#L20](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/barcode-scanner/guest-js/index.ts#L20)

##### [GS1DataBar](https://tauri.app/reference/javascript/barcode-scanner/#gs1databar)

[Section titled “GS1DataBar”](https://tauri.app/reference/javascript/barcode-scanner/#gs1databar)

    GS1DataBar: "GS1_DATA_BAR";

Not supported on Android. Requires iOS 15.4+

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/barcode-scanner/guest-js/index.ts#L36](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/barcode-scanner/guest-js/index.ts#L36)

##### [GS1DataBarExpanded](https://tauri.app/reference/javascript/barcode-scanner/#gs1databarexpanded)

[Section titled “GS1DataBarExpanded”](https://tauri.app/reference/javascript/barcode-scanner/#gs1databarexpanded)

    GS1DataBarExpanded: "GS1_DATA_BAR_EXPANDED";

Not supported on Android. Requires iOS 15.4+

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/barcode-scanner/guest-js/index.ts#L44](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/barcode-scanner/guest-js/index.ts#L44)

##### [GS1DataBarLimited](https://tauri.app/reference/javascript/barcode-scanner/#gs1databarlimited)

[Section titled “GS1DataBarLimited”](https://tauri.app/reference/javascript/barcode-scanner/#gs1databarlimited)

    GS1DataBarLimited: "GS1_DATA_BAR_LIMITED";

Not supported on Android. Requires iOS 15.4+

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/barcode-scanner/guest-js/index.ts#L40](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/barcode-scanner/guest-js/index.ts#L40)

##### [ITF](https://tauri.app/reference/javascript/barcode-scanner/#itf)

[Section titled “ITF”](https://tauri.app/reference/javascript/barcode-scanner/#itf)

    ITF: "ITF";

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/barcode-scanner/guest-js/index.ts#L29](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/barcode-scanner/guest-js/index.ts#L29)

##### [PDF417](https://tauri.app/reference/javascript/barcode-scanner/#pdf417)

[Section titled “PDF417”](https://tauri.app/reference/javascript/barcode-scanner/#pdf417)

    PDF417: "PDF_417";

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/barcode-scanner/guest-js/index.ts#L32](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/barcode-scanner/guest-js/index.ts#L32)

##### [QRCode](https://tauri.app/reference/javascript/barcode-scanner/#qrcode)

[Section titled “QRCode”](https://tauri.app/reference/javascript/barcode-scanner/#qrcode)

    QRCode: "QR_CODE";

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/barcode-scanner/guest-js/index.ts#L14](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/barcode-scanner/guest-js/index.ts#L14)

##### [UPC\_A](https://tauri.app/reference/javascript/barcode-scanner/#upc_a)

[Section titled “UPC\_A”](https://tauri.app/reference/javascript/barcode-scanner/#upc_a)

    UPC_A: "UPC_A";

Not supported on iOS.

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/barcode-scanner/guest-js/index.ts#L18](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/barcode-scanner/guest-js/index.ts#L18)

##### [UPC\_E](https://tauri.app/reference/javascript/barcode-scanner/#upc_e)

[Section titled “UPC\_E”](https://tauri.app/reference/javascript/barcode-scanner/#upc_e)

    UPC_E: "UPC_E";

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/barcode-scanner/guest-js/index.ts#L19](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/barcode-scanner/guest-js/index.ts#L19)

[Interfaces](https://tauri.app/reference/javascript/barcode-scanner/#interfaces)

---------------------------------------------------------------------------------

[Section titled “Interfaces”](https://tauri.app/reference/javascript/barcode-scanner/#interfaces)

### [ScanOptions](https://tauri.app/reference/javascript/barcode-scanner/#scanoptions)

[Section titled “ScanOptions”](https://tauri.app/reference/javascript/barcode-scanner/#scanoptions)

#### [Properties](https://tauri.app/reference/javascript/barcode-scanner/#properties)

[Section titled “Properties”](https://tauri.app/reference/javascript/barcode-scanner/#properties)

| Property | Type | Defined in |
| --- | --- | --- |
| `cameraDirection?` | `"back"` \| `"front"` | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/barcode-scanner/guest-js/index.ts#L48](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/barcode-scanner/guest-js/index.ts#L48) |
| `formats?` | [`Format`](https://tauri.app/reference/javascript/barcode-scanner/#format)<br>\[\] | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/barcode-scanner/guest-js/index.ts#L49](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/barcode-scanner/guest-js/index.ts#L49) |
| `windowed?` | `boolean` | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/barcode-scanner/guest-js/index.ts#L50](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/barcode-scanner/guest-js/index.ts#L50) |

* * *

### [Scanned](https://tauri.app/reference/javascript/barcode-scanner/#scanned)

[Section titled “Scanned”](https://tauri.app/reference/javascript/barcode-scanner/#scanned)

#### [Properties](https://tauri.app/reference/javascript/barcode-scanner/#properties-1)

[Section titled “Properties”](https://tauri.app/reference/javascript/barcode-scanner/#properties-1)

| Property | Type | Defined in |
| --- | --- | --- |
| `bounds` | `unknown` | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/barcode-scanner/guest-js/index.ts#L56](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/barcode-scanner/guest-js/index.ts#L56) |
| `content` | `string` | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/barcode-scanner/guest-js/index.ts#L54](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/barcode-scanner/guest-js/index.ts#L54) |
| `format` | [`Format`](https://tauri.app/reference/javascript/barcode-scanner/#format) | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/barcode-scanner/guest-js/index.ts#L55](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/barcode-scanner/guest-js/index.ts#L55) |

[Type Aliases](https://tauri.app/reference/javascript/barcode-scanner/#type-aliases)

-------------------------------------------------------------------------------------

[Section titled “Type Aliases”](https://tauri.app/reference/javascript/barcode-scanner/#type-aliases)

### [PermissionState](https://tauri.app/reference/javascript/barcode-scanner/#permissionstate)

[Section titled “PermissionState”](https://tauri.app/reference/javascript/barcode-scanner/#permissionstate)

    type PermissionState: "granted" | "denied" | "prompt" | "prompt-with-rationale";

**Source**: undefined

[Functions](https://tauri.app/reference/javascript/barcode-scanner/#functions)

-------------------------------------------------------------------------------

[Section titled “Functions”](https://tauri.app/reference/javascript/barcode-scanner/#functions)

### [cancel()](https://tauri.app/reference/javascript/barcode-scanner/#cancel)

[Section titled “cancel()”](https://tauri.app/reference/javascript/barcode-scanner/#cancel)

    function cancel(): Promise<void>

Cancel the current scan process.

#### [Returns](https://tauri.app/reference/javascript/barcode-scanner/#returns)

[Section titled “Returns”](https://tauri.app/reference/javascript/barcode-scanner/#returns)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`void`\>

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/barcode-scanner/guest-js/index.ts#L70](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/barcode-scanner/guest-js/index.ts#L70)

* * *

### [checkPermissions()](https://tauri.app/reference/javascript/barcode-scanner/#checkpermissions)

[Section titled “checkPermissions()”](https://tauri.app/reference/javascript/barcode-scanner/#checkpermissions)

    function checkPermissions(): Promise<PermissionState>

Get permission state.

#### [Returns](https://tauri.app/reference/javascript/barcode-scanner/#returns-1)

[Section titled “Returns”](https://tauri.app/reference/javascript/barcode-scanner/#returns-1)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`PermissionState`\>

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/barcode-scanner/guest-js/index.ts#L77](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/barcode-scanner/guest-js/index.ts#L77)

* * *

### [openAppSettings()](https://tauri.app/reference/javascript/barcode-scanner/#openappsettings)

[Section titled “openAppSettings()”](https://tauri.app/reference/javascript/barcode-scanner/#openappsettings)

    function openAppSettings(): Promise<void>

Open application settings. Useful if permission was denied and the user must manually enable it.

#### [Returns](https://tauri.app/reference/javascript/barcode-scanner/#returns-2)

[Section titled “Returns”](https://tauri.app/reference/javascript/barcode-scanner/#returns-2)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`void`\>

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/barcode-scanner/guest-js/index.ts#L95](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/barcode-scanner/guest-js/index.ts#L95)

* * *

### [requestPermissions()](https://tauri.app/reference/javascript/barcode-scanner/#requestpermissions)

[Section titled “requestPermissions()”](https://tauri.app/reference/javascript/barcode-scanner/#requestpermissions)

    function requestPermissions(): Promise<PermissionState>

Request permissions to use the camera.

#### [Returns](https://tauri.app/reference/javascript/barcode-scanner/#returns-3)

[Section titled “Returns”](https://tauri.app/reference/javascript/barcode-scanner/#returns-3)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`PermissionState`\>

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/barcode-scanner/guest-js/index.ts#L86](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/barcode-scanner/guest-js/index.ts#L86)

* * *

### [scan()](https://tauri.app/reference/javascript/barcode-scanner/#scan)

[Section titled “scan()”](https://tauri.app/reference/javascript/barcode-scanner/#scan)

    function scan(options?): Promise<Scanned>

Start scanning.

#### [Parameters](https://tauri.app/reference/javascript/barcode-scanner/#parameters)

[Section titled “Parameters”](https://tauri.app/reference/javascript/barcode-scanner/#parameters)

| Parameter | Type | Description |
| --- | --- | --- |
| `options`? | [`ScanOptions`](https://tauri.app/reference/javascript/barcode-scanner/#scanoptions) |     |

#### [Returns](https://tauri.app/reference/javascript/barcode-scanner/#returns-4)

[Section titled “Returns”](https://tauri.app/reference/javascript/barcode-scanner/#returns-4)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<[`Scanned`](https://tauri.app/reference/javascript/barcode-scanner/#scanned)
\>

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/barcode-scanner/guest-js/index.ts#L63](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/barcode-scanner/guest-js/index.ts#L63)

* * *

[Support on Open Collective](https://opencollective.com/tauri)
 [Sponsor on GitHub](https://github.com/sponsors/tauri-apps)

© 2026 Tauri Contributors. CC-BY / MIT

---

# @tauri-apps/plugin-clipboard-manager | Tauri

[Skip to content](https://tauri.app/reference/javascript/clipboard-manager/#_top)

@tauri-apps/plugin-clipboard-manager
====================================

Read and write to the system clipboard.

[Functions](https://tauri.app/reference/javascript/clipboard-manager/#functions)

---------------------------------------------------------------------------------

[Section titled “Functions”](https://tauri.app/reference/javascript/clipboard-manager/#functions)

### [clear()](https://tauri.app/reference/javascript/clipboard-manager/#clear)

[Section titled “clear()”](https://tauri.app/reference/javascript/clipboard-manager/#clear)

    function clear(): Promise<void>

Clears the clipboard.

Platform-specific

*   **Android:** Only supported on SDK 28+. For older releases we write an empty string to the clipboard instead.

#### [Returns](https://tauri.app/reference/javascript/clipboard-manager/#returns)

[Section titled “Returns”](https://tauri.app/reference/javascript/clipboard-manager/#returns)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`void`\>

#### [Example](https://tauri.app/reference/javascript/clipboard-manager/#example)

[Section titled “Example”](https://tauri.app/reference/javascript/clipboard-manager/#example)

    import { clear } from '@tauri-apps/plugin-clipboard-manager';await clear();

#### [Since](https://tauri.app/reference/javascript/clipboard-manager/#since)

[Section titled “Since”](https://tauri.app/reference/javascript/clipboard-manager/#since)

2.0.0

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/clipboard-manager/guest-js/index.ts#L147](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/clipboard-manager/guest-js/index.ts#L147)

* * *

### [readImage()](https://tauri.app/reference/javascript/clipboard-manager/#readimage)

[Section titled “readImage()”](https://tauri.app/reference/javascript/clipboard-manager/#readimage)

    function readImage(): Promise<Image>

Gets the clipboard content as Uint8Array image.

Platform-specific

*   **Android / iOS:** Not supported.

#### [Returns](https://tauri.app/reference/javascript/clipboard-manager/#returns-1)

[Section titled “Returns”](https://tauri.app/reference/javascript/clipboard-manager/#returns-1)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`Image`\>

#### [Example](https://tauri.app/reference/javascript/clipboard-manager/#example-1)

[Section titled “Example”](https://tauri.app/reference/javascript/clipboard-manager/#example-1)

    import { readImage } from '@tauri-apps/plugin-clipboard-manager';
    const clipboardImage = await readImage();const blob = new Blob([await clipboardImage.rgba()], { type: 'image' })const url = URL.createObjectURL(blob)

#### [Since](https://tauri.app/reference/javascript/clipboard-manager/#since-1)

[Section titled “Since”](https://tauri.app/reference/javascript/clipboard-manager/#since-1)

2.0.0

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/clipboard-manager/guest-js/index.ts#L99](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/clipboard-manager/guest-js/index.ts#L99)

* * *

### [readText()](https://tauri.app/reference/javascript/clipboard-manager/#readtext)

[Section titled “readText()”](https://tauri.app/reference/javascript/clipboard-manager/#readtext)

    function readText(): Promise<string>

Gets the clipboard content as plain text.

#### [Returns](https://tauri.app/reference/javascript/clipboard-manager/#returns-2)

[Section titled “Returns”](https://tauri.app/reference/javascript/clipboard-manager/#returns-2)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`string`\>

#### [Example](https://tauri.app/reference/javascript/clipboard-manager/#example-2)

[Section titled “Example”](https://tauri.app/reference/javascript/clipboard-manager/#example-2)

    import { readText } from '@tauri-apps/plugin-clipboard-manager';const clipboardText = await readText();

#### [Since](https://tauri.app/reference/javascript/clipboard-manager/#since-2)

[Section titled “Since”](https://tauri.app/reference/javascript/clipboard-manager/#since-2)

2.0.0

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/clipboard-manager/guest-js/index.ts#L46](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/clipboard-manager/guest-js/index.ts#L46)

* * *

### [writeHtml()](https://tauri.app/reference/javascript/clipboard-manager/#writehtml)

[Section titled “writeHtml()”](https://tauri.app/reference/javascript/clipboard-manager/#writehtml)

    function writeHtml(html, altText?): Promise<void>

*   Writes HTML or fallbacks to write provided plain text to the clipboard.

Platform-specific

*   **Android / iOS:** Not supported.

#### [Parameters](https://tauri.app/reference/javascript/clipboard-manager/#parameters)

[Section titled “Parameters”](https://tauri.app/reference/javascript/clipboard-manager/#parameters)

| Parameter | Type |
| --- | --- |
| `html` | `string` |
| `altText`? | `string` |

#### [Returns](https://tauri.app/reference/javascript/clipboard-manager/#returns-3)

[Section titled “Returns”](https://tauri.app/reference/javascript/clipboard-manager/#returns-3)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`void`\>

A promise indicating the success or failure of the operation.

#### [Example](https://tauri.app/reference/javascript/clipboard-manager/#example-3)

[Section titled “Example”](https://tauri.app/reference/javascript/clipboard-manager/#example-3)

    import { writeHtml } from '@tauri-apps/plugin-clipboard-manager';await writeHtml('<h1>Tauri is awesome!</h1>', 'plaintext');// The following will write "<h1>Tauri is awesome</h1>" as plain textawait writeHtml('<h1>Tauri is awesome!</h1>', '<h1>Tauri is awesome</h1>');// we can read html data only as a string so there's just readText(), no readHtml()assert(await readText(), '<h1>Tauri is awesome!</h1>');

#### [Since](https://tauri.app/reference/javascript/clipboard-manager/#since-3)

[Section titled “Since”](https://tauri.app/reference/javascript/clipboard-manager/#since-3)

2.0.0

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/clipboard-manager/guest-js/index.ts#L126](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/clipboard-manager/guest-js/index.ts#L126)

* * *

### [writeImage()](https://tauri.app/reference/javascript/clipboard-manager/#writeimage)

[Section titled “writeImage()”](https://tauri.app/reference/javascript/clipboard-manager/#writeimage)

    function writeImage(image): Promise<void>

Writes image buffer to the clipboard.

Platform-specific

*   **Android / iOS:** Not supported.

#### [Parameters](https://tauri.app/reference/javascript/clipboard-manager/#parameters-1)

[Section titled “Parameters”](https://tauri.app/reference/javascript/clipboard-manager/#parameters-1)

| Parameter | Type |
| --- | --- |
| `image` | \| `string` \| `number`\[\] \| [`ArrayBuffer`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/ArrayBuffer)<br> \| [`Uint8Array`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Uint8Array)<br> \| `Image` |

#### [Returns](https://tauri.app/reference/javascript/clipboard-manager/#returns-4)

[Section titled “Returns”](https://tauri.app/reference/javascript/clipboard-manager/#returns-4)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`void`\>

A promise indicating the success or failure of the operation.

#### [Example](https://tauri.app/reference/javascript/clipboard-manager/#example-4)

[Section titled “Example”](https://tauri.app/reference/javascript/clipboard-manager/#example-4)

    import { writeImage } from '@tauri-apps/plugin-clipboard-manager';const buffer = [  // A red pixel  255, 0, 0, 255,\
     // A green pixel  0, 255, 0, 255,];await writeImage(buffer);

#### [Since](https://tauri.app/reference/javascript/clipboard-manager/#since-4)

[Section titled “Since”](https://tauri.app/reference/javascript/clipboard-manager/#since-4)

2.0.0

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/clipboard-manager/guest-js/index.ts#L74](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/clipboard-manager/guest-js/index.ts#L74)

* * *

### [writeText()](https://tauri.app/reference/javascript/clipboard-manager/#writetext)

[Section titled “writeText()”](https://tauri.app/reference/javascript/clipboard-manager/#writetext)

    function writeText(text, opts?): Promise<void>

Writes plain text to the clipboard.

#### [Parameters](https://tauri.app/reference/javascript/clipboard-manager/#parameters-2)

[Section titled “Parameters”](https://tauri.app/reference/javascript/clipboard-manager/#parameters-2)

| Parameter | Type |
| --- | --- |
| `text` | `string` |
| `opts`? | `object` |
| `opts.label`? | `string` |

#### [Returns](https://tauri.app/reference/javascript/clipboard-manager/#returns-5)

[Section titled “Returns”](https://tauri.app/reference/javascript/clipboard-manager/#returns-5)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`void`\>

A promise indicating the success or failure of the operation.

#### [Example](https://tauri.app/reference/javascript/clipboard-manager/#example-5)

[Section titled “Example”](https://tauri.app/reference/javascript/clipboard-manager/#example-5)

    import { writeText, readText } from '@tauri-apps/plugin-clipboard-manager';await writeText('Tauri is awesome!');assert(await readText(), 'Tauri is awesome!');

#### [Since](https://tauri.app/reference/javascript/clipboard-manager/#since-5)

[Section titled “Since”](https://tauri.app/reference/javascript/clipboard-manager/#since-5)

2.0.0

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/clipboard-manager/guest-js/index.ts#L27](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/clipboard-manager/guest-js/index.ts#L27)

* * *

[Support on Open Collective](https://opencollective.com/tauri)
 [Sponsor on GitHub](https://github.com/sponsors/tauri-apps)

© 2026 Tauri Contributors. CC-BY / MIT

---

# @tauri-apps/plugin-biometric | Tauri

[Skip to content](https://tauri.app/reference/javascript/biometric/#_top)

@tauri-apps/plugin-biometric
============================

[Enumerations](https://tauri.app/reference/javascript/biometric/#enumerations)

-------------------------------------------------------------------------------

[Section titled “Enumerations”](https://tauri.app/reference/javascript/biometric/#enumerations)

### [BiometryType](https://tauri.app/reference/javascript/biometric/#biometrytype)

[Section titled “BiometryType”](https://tauri.app/reference/javascript/biometric/#biometrytype)

#### [Enumeration Members](https://tauri.app/reference/javascript/biometric/#enumeration-members)

[Section titled “Enumeration Members”](https://tauri.app/reference/javascript/biometric/#enumeration-members)

##### [FaceID](https://tauri.app/reference/javascript/biometric/#faceid)

[Section titled “FaceID”](https://tauri.app/reference/javascript/biometric/#faceid)

    FaceID: 2;

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/biometric/guest-js/index.ts#L12](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/biometric/guest-js/index.ts#L12)

##### [Iris](https://tauri.app/reference/javascript/biometric/#iris)

[Section titled “Iris”](https://tauri.app/reference/javascript/biometric/#iris)

    Iris: 3;

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/biometric/guest-js/index.ts#L14](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/biometric/guest-js/index.ts#L14)

##### [None](https://tauri.app/reference/javascript/biometric/#none)

[Section titled “None”](https://tauri.app/reference/javascript/biometric/#none)

    None: 0;

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/biometric/guest-js/index.ts#L8](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/biometric/guest-js/index.ts#L8)

##### [TouchID](https://tauri.app/reference/javascript/biometric/#touchid)

[Section titled “TouchID”](https://tauri.app/reference/javascript/biometric/#touchid)

    TouchID: 1;

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/biometric/guest-js/index.ts#L10](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/biometric/guest-js/index.ts#L10)

[Interfaces](https://tauri.app/reference/javascript/biometric/#interfaces)

---------------------------------------------------------------------------

[Section titled “Interfaces”](https://tauri.app/reference/javascript/biometric/#interfaces)

### [AuthOptions](https://tauri.app/reference/javascript/biometric/#authoptions)

[Section titled “AuthOptions”](https://tauri.app/reference/javascript/biometric/#authoptions)

#### [Properties](https://tauri.app/reference/javascript/biometric/#properties)

[Section titled “Properties”](https://tauri.app/reference/javascript/biometric/#properties)

| Property | Type | Defined in |
| --- | --- | --- |
| `allowDeviceCredential?` | `boolean` | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/biometric/guest-js/index.ts#L36](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/biometric/guest-js/index.ts#L36) |
| `cancelTitle?` | `string` | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/biometric/guest-js/index.ts#L37](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/biometric/guest-js/index.ts#L37) |
| `confirmationRequired?` | `boolean` | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/biometric/guest-js/index.ts#L45](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/biometric/guest-js/index.ts#L45) |
| `fallbackTitle?` | `string` | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/biometric/guest-js/index.ts#L40](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/biometric/guest-js/index.ts#L40) |
| `maxAttemps?` | `number` | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/biometric/guest-js/index.ts#L46](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/biometric/guest-js/index.ts#L46) |
| `subtitle?` | `string` | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/biometric/guest-js/index.ts#L44](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/biometric/guest-js/index.ts#L44) |
| `title?` | `string` | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/biometric/guest-js/index.ts#L43](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/biometric/guest-js/index.ts#L43) |

* * *

### [Status](https://tauri.app/reference/javascript/biometric/#status)

[Section titled “Status”](https://tauri.app/reference/javascript/biometric/#status)

#### [Properties](https://tauri.app/reference/javascript/biometric/#properties-1)

[Section titled “Properties”](https://tauri.app/reference/javascript/biometric/#properties-1)

| Property | Type | Defined in |
| --- | --- | --- |
| `biometryType` | [`BiometryType`](https://tauri.app/reference/javascript/biometric/#biometrytype) | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/biometric/guest-js/index.ts#L19](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/biometric/guest-js/index.ts#L19) |
| `error?` | `string` | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/biometric/guest-js/index.ts#L20](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/biometric/guest-js/index.ts#L20) |
| `errorCode?` | \| `"appCancel"` \| `"authenticationFailed"` \| `"invalidContext"` \| `"notInteractive"` \| `"passcodeNotSet"` \| `"systemCancel"` \| `"userCancel"` \| `"userFallback"` \| `"biometryLockout"` \| `"biometryNotAvailable"` \| `"biometryNotEnrolled"` | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/biometric/guest-js/index.ts#L21](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/biometric/guest-js/index.ts#L21) |
| `isAvailable` | `boolean` | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/biometric/guest-js/index.ts#L18](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/biometric/guest-js/index.ts#L18) |

[Functions](https://tauri.app/reference/javascript/biometric/#functions)

-------------------------------------------------------------------------

[Section titled “Functions”](https://tauri.app/reference/javascript/biometric/#functions)

### [authenticate()](https://tauri.app/reference/javascript/biometric/#authenticate)

[Section titled “authenticate()”](https://tauri.app/reference/javascript/biometric/#authenticate)

    function authenticate(reason, options?): Promise<void>

Prompts the user for authentication using the system interface (touchID, faceID or Android Iris). Rejects if the authentication fails.

    import { authenticate } from "@tauri-apps/plugin-biometric";await authenticate('Open your wallet');

#### [Parameters](https://tauri.app/reference/javascript/biometric/#parameters)

[Section titled “Parameters”](https://tauri.app/reference/javascript/biometric/#parameters)

| Parameter | Type | Description |
| --- | --- | --- |
| `reason` | `string` |     |
| `options`? | [`AuthOptions`](https://tauri.app/reference/javascript/biometric/#authoptions) |     |

#### [Returns](https://tauri.app/reference/javascript/biometric/#returns)

[Section titled “Returns”](https://tauri.app/reference/javascript/biometric/#returns)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`void`\>

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/biometric/guest-js/index.ts#L69](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/biometric/guest-js/index.ts#L69)

* * *

### [checkStatus()](https://tauri.app/reference/javascript/biometric/#checkstatus)

[Section titled “checkStatus()”](https://tauri.app/reference/javascript/biometric/#checkstatus)

    function checkStatus(): Promise<Status>

Checks if the biometric authentication is available.

#### [Returns](https://tauri.app/reference/javascript/biometric/#returns-1)

[Section titled “Returns”](https://tauri.app/reference/javascript/biometric/#returns-1)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<[`Status`](https://tauri.app/reference/javascript/biometric/#status)
\>

a promise resolving to an object containing all the information about the status of the biometry.

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/biometric/guest-js/index.ts#L53](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/biometric/guest-js/index.ts#L53)

* * *

[Support on Open Collective](https://opencollective.com/tauri)
 [Sponsor on GitHub](https://github.com/sponsors/tauri-apps)

© 2026 Tauri Contributors. CC-BY / MIT

---

# @tauri-apps/plugin-geolocation | Tauri

[Skip to content](https://tauri.app/reference/javascript/geolocation/#_top)

@tauri-apps/plugin-geolocation
==============================

[Type Aliases](https://tauri.app/reference/javascript/geolocation/#type-aliases)

---------------------------------------------------------------------------------

[Section titled “Type Aliases”](https://tauri.app/reference/javascript/geolocation/#type-aliases)

### [Coordinates](https://tauri.app/reference/javascript/geolocation/#coordinates)

[Section titled “Coordinates”](https://tauri.app/reference/javascript/geolocation/#coordinates)

    type Coordinates: object;

#### [Type declaration](https://tauri.app/reference/javascript/geolocation/#type-declaration)

[Section titled “Type declaration”](https://tauri.app/reference/javascript/geolocation/#type-declaration)

| Name | Type | Description | Defined in |
| --- | --- | --- | --- |
| `accuracy` | `number` | Accuracy level of the latitude and longitude coordinates in meters. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/geolocation/guest-js/index.ts#L24](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/geolocation/guest-js/index.ts#L24) |
| `altitude` | `number` \| `null` | The altitude the user is at, if available. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/geolocation/guest-js/index.ts#L33](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/geolocation/guest-js/index.ts#L33) |
| `altitudeAccuracy` | `number` \| `null` | Accuracy level of the altitude coordinate in meters, if available. Available on all iOS versions and on Android 8 and above. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/geolocation/guest-js/index.ts#L29](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/geolocation/guest-js/index.ts#L29) |
| `heading` | `number` \| `null` | The heading the user is facing, if available. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/geolocation/guest-js/index.ts#L38](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/geolocation/guest-js/index.ts#L38) |
| `latitude` | `number` | Latitude in decimal degrees. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/geolocation/guest-js/index.ts#L16](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/geolocation/guest-js/index.ts#L16) |
| `longitude` | `number` | Longitude in decimal degrees. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/geolocation/guest-js/index.ts#L20](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/geolocation/guest-js/index.ts#L20) |
| `speed` | `number` \| `null` | \-  | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/geolocation/guest-js/index.ts#L34](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/geolocation/guest-js/index.ts#L34) |

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/geolocation/guest-js/index.ts#L12](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/geolocation/guest-js/index.ts#L12)

* * *

### [PermissionStatus](https://tauri.app/reference/javascript/geolocation/#permissionstatus)

[Section titled “PermissionStatus”](https://tauri.app/reference/javascript/geolocation/#permissionstatus)

    type PermissionStatus: object;

#### [Type declaration](https://tauri.app/reference/javascript/geolocation/#type-declaration-1)

[Section titled “Type declaration”](https://tauri.app/reference/javascript/geolocation/#type-declaration-1)

| Name | Type | Description | Defined in |
| --- | --- | --- | --- |
| `coarseLocation` | `PermissionState` | Permissions state for the coarseLoaction alias. On Android it requests/checks ACCESS\_COARSE\_LOCATION. On Android 12+, users can choose between Approximate location (ACCESS\_COARSE\_LOCATION) and Precise location (ACCESS\_FINE\_LOCATION). On iOS it will have the same value as the `location` alias. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/geolocation/guest-js/index.ts#L59](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/geolocation/guest-js/index.ts#L59) |
| `location` | `PermissionState` | Permission state for the location alias. On Android it requests/checks both ACCESS\_COARSE\_LOCATION and ACCESS\_FINE\_LOCATION permissions. On iOS it requests/checks location permissions. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/geolocation/guest-js/index.ts#L49](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/geolocation/guest-js/index.ts#L49) |

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/geolocation/guest-js/index.ts#L41](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/geolocation/guest-js/index.ts#L41)

* * *

### [PermissionType](https://tauri.app/reference/javascript/geolocation/#permissiontype)

[Section titled “PermissionType”](https://tauri.app/reference/javascript/geolocation/#permissiontype)

    type PermissionType: "location" | "coarseLocation";

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/geolocation/guest-js/index.ts#L62](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/geolocation/guest-js/index.ts#L62)

* * *

### [Position](https://tauri.app/reference/javascript/geolocation/#position)

[Section titled “Position”](https://tauri.app/reference/javascript/geolocation/#position)

    type Position: object;

#### [Type declaration](https://tauri.app/reference/javascript/geolocation/#type-declaration-2)

[Section titled “Type declaration”](https://tauri.app/reference/javascript/geolocation/#type-declaration-2)

| Name | Type | Description | Defined in |
| --- | --- | --- | --- |
| `coords` | [`Coordinates`](https://tauri.app/reference/javascript/geolocation/#coordinates) | The GPD coordinates along with the accuracy of the data. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/geolocation/guest-js/index.ts#L72](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/geolocation/guest-js/index.ts#L72) |
| `timestamp` | `number` | Creation time for these coordinates. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/geolocation/guest-js/index.ts#L68](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/geolocation/guest-js/index.ts#L68) |

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/geolocation/guest-js/index.ts#L64](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/geolocation/guest-js/index.ts#L64)

* * *

### [PositionOptions](https://tauri.app/reference/javascript/geolocation/#positionoptions)

[Section titled “PositionOptions”](https://tauri.app/reference/javascript/geolocation/#positionoptions)

    type PositionOptions: object;

#### [Type declaration](https://tauri.app/reference/javascript/geolocation/#type-declaration-3)

[Section titled “Type declaration”](https://tauri.app/reference/javascript/geolocation/#type-declaration-3)

| Name | Type | Description | Defined in |
| --- | --- | --- | --- |
| `enableHighAccuracy` | `boolean` | High accuracy mode (such as GPS, if available) Will be ignored on Android 12+ if users didn’t grant the ACCESS\_FINE\_LOCATION permission (`coarseLocation` permission). | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/geolocation/guest-js/index.ts#L80](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/geolocation/guest-js/index.ts#L80) |
| `maximumAge` | `number` | The maximum age in milliseconds of a possible cached position that is acceptable to return. Default: 0 Ignored on iOS | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/geolocation/guest-js/index.ts#L92](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/geolocation/guest-js/index.ts#L92) |
| `timeout` | `number` | The maximum wait time in milliseconds for location updates. On Android the timeout gets ignored for getCurrentPosition. Ignored on iOS | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/geolocation/guest-js/index.ts#L86](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/geolocation/guest-js/index.ts#L86) |

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/geolocation/guest-js/index.ts#L75](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/geolocation/guest-js/index.ts#L75)

[Functions](https://tauri.app/reference/javascript/geolocation/#functions)

---------------------------------------------------------------------------

[Section titled “Functions”](https://tauri.app/reference/javascript/geolocation/#functions)

### [checkPermissions()](https://tauri.app/reference/javascript/geolocation/#checkpermissions)

[Section titled “checkPermissions()”](https://tauri.app/reference/javascript/geolocation/#checkpermissions)

    function checkPermissions(): Promise<PermissionStatus>

#### [Returns](https://tauri.app/reference/javascript/geolocation/#returns)

[Section titled “Returns”](https://tauri.app/reference/javascript/geolocation/#returns)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<[`PermissionStatus`](https://tauri.app/reference/javascript/geolocation/#permissionstatus)
\>

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/geolocation/guest-js/index.ts#L128](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/geolocation/guest-js/index.ts#L128)

* * *

### [clearWatch()](https://tauri.app/reference/javascript/geolocation/#clearwatch)

[Section titled “clearWatch()”](https://tauri.app/reference/javascript/geolocation/#clearwatch)

    function clearWatch(channelId): Promise<void>

#### [Parameters](https://tauri.app/reference/javascript/geolocation/#parameters)

[Section titled “Parameters”](https://tauri.app/reference/javascript/geolocation/#parameters)

| Parameter | Type |
| --- | --- |
| `channelId` | `number` |

#### [Returns](https://tauri.app/reference/javascript/geolocation/#returns-1)

[Section titled “Returns”](https://tauri.app/reference/javascript/geolocation/#returns-1)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`void`\>

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/geolocation/guest-js/index.ts#L122](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/geolocation/guest-js/index.ts#L122)

* * *

### [getCurrentPosition()](https://tauri.app/reference/javascript/geolocation/#getcurrentposition)

[Section titled “getCurrentPosition()”](https://tauri.app/reference/javascript/geolocation/#getcurrentposition)

    function getCurrentPosition(options?): Promise<Position>

#### [Parameters](https://tauri.app/reference/javascript/geolocation/#parameters-1)

[Section titled “Parameters”](https://tauri.app/reference/javascript/geolocation/#parameters-1)

| Parameter | Type |
| --- | --- |
| `options`? | [`PositionOptions`](https://tauri.app/reference/javascript/geolocation/#positionoptions) |

#### [Returns](https://tauri.app/reference/javascript/geolocation/#returns-2)

[Section titled “Returns”](https://tauri.app/reference/javascript/geolocation/#returns-2)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<[`Position`](https://tauri.app/reference/javascript/geolocation/#position)
\>

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/geolocation/guest-js/index.ts#L114](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/geolocation/guest-js/index.ts#L114)

* * *

### [requestPermissions()](https://tauri.app/reference/javascript/geolocation/#requestpermissions)

[Section titled “requestPermissions()”](https://tauri.app/reference/javascript/geolocation/#requestpermissions)

    function requestPermissions(permissions): Promise<PermissionStatus>

#### [Parameters](https://tauri.app/reference/javascript/geolocation/#parameters-2)

[Section titled “Parameters”](https://tauri.app/reference/javascript/geolocation/#parameters-2)

| Parameter | Type |
| --- | --- |
| `permissions` | `null` \| [`PermissionType`](https://tauri.app/reference/javascript/geolocation/#permissiontype)<br>\[\] |

#### [Returns](https://tauri.app/reference/javascript/geolocation/#returns-3)

[Section titled “Returns”](https://tauri.app/reference/javascript/geolocation/#returns-3)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<[`PermissionStatus`](https://tauri.app/reference/javascript/geolocation/#permissionstatus)
\>

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/geolocation/guest-js/index.ts#L132](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/geolocation/guest-js/index.ts#L132)

* * *

### [watchPosition()](https://tauri.app/reference/javascript/geolocation/#watchposition)

[Section titled “watchPosition()”](https://tauri.app/reference/javascript/geolocation/#watchposition)

    function watchPosition(options, cb): Promise<number>

#### [Parameters](https://tauri.app/reference/javascript/geolocation/#parameters-3)

[Section titled “Parameters”](https://tauri.app/reference/javascript/geolocation/#parameters-3)

| Parameter | Type |
| --- | --- |
| `options` | [`PositionOptions`](https://tauri.app/reference/javascript/geolocation/#positionoptions) |
| `cb` | (`location`, `error`?) => `void` |

#### [Returns](https://tauri.app/reference/javascript/geolocation/#returns-4)

[Section titled “Returns”](https://tauri.app/reference/javascript/geolocation/#returns-4)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`number`\>

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/geolocation/guest-js/index.ts#L95](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/geolocation/guest-js/index.ts#L95)

* * *

[Support on Open Collective](https://opencollective.com/tauri)
 [Sponsor on GitHub](https://github.com/sponsors/tauri-apps)

© 2026 Tauri Contributors. CC-BY / MIT

---

# @tauri-apps/plugin-window-state | Tauri

[Skip to content](https://tauri.app/reference/javascript/window-state/#_top)

@tauri-apps/plugin-window-state
===============================

[Enumerations](https://tauri.app/reference/javascript/window-state/#enumerations)

----------------------------------------------------------------------------------

[Section titled “Enumerations”](https://tauri.app/reference/javascript/window-state/#enumerations)

### [StateFlags](https://tauri.app/reference/javascript/window-state/#stateflags)

[Section titled “StateFlags”](https://tauri.app/reference/javascript/window-state/#stateflags)

#### [Enumeration Members](https://tauri.app/reference/javascript/window-state/#enumeration-members)

[Section titled “Enumeration Members”](https://tauri.app/reference/javascript/window-state/#enumeration-members)

##### [ALL](https://tauri.app/reference/javascript/window-state/#all)

[Section titled “ALL”](https://tauri.app/reference/javascript/window-state/#all)

    ALL: 63;

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/window-state/guest-js/index.ts#L15](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/window-state/guest-js/index.ts#L15)

##### [DECORATIONS](https://tauri.app/reference/javascript/window-state/#decorations)

[Section titled “DECORATIONS”](https://tauri.app/reference/javascript/window-state/#decorations)

    DECORATIONS: 16;

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/window-state/guest-js/index.ts#L13](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/window-state/guest-js/index.ts#L13)

##### [FULLSCREEN](https://tauri.app/reference/javascript/window-state/#fullscreen)

[Section titled “FULLSCREEN”](https://tauri.app/reference/javascript/window-state/#fullscreen)

    FULLSCREEN: 32;

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/window-state/guest-js/index.ts#L14](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/window-state/guest-js/index.ts#L14)

##### [MAXIMIZED](https://tauri.app/reference/javascript/window-state/#maximized)

[Section titled “MAXIMIZED”](https://tauri.app/reference/javascript/window-state/#maximized)

    MAXIMIZED: 4;

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/window-state/guest-js/index.ts#L11](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/window-state/guest-js/index.ts#L11)

##### [POSITION](https://tauri.app/reference/javascript/window-state/#position)

[Section titled “POSITION”](https://tauri.app/reference/javascript/window-state/#position)

    POSITION: 2;

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/window-state/guest-js/index.ts#L10](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/window-state/guest-js/index.ts#L10)

##### [SIZE](https://tauri.app/reference/javascript/window-state/#size)

[Section titled “SIZE”](https://tauri.app/reference/javascript/window-state/#size)

    SIZE: 1;

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/window-state/guest-js/index.ts#L9](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/window-state/guest-js/index.ts#L9)

##### [VISIBLE](https://tauri.app/reference/javascript/window-state/#visible)

[Section titled “VISIBLE”](https://tauri.app/reference/javascript/window-state/#visible)

    VISIBLE: 8;

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/window-state/guest-js/index.ts#L12](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/window-state/guest-js/index.ts#L12)

[Functions](https://tauri.app/reference/javascript/window-state/#functions)

----------------------------------------------------------------------------

[Section titled “Functions”](https://tauri.app/reference/javascript/window-state/#functions)

### [filename()](https://tauri.app/reference/javascript/window-state/#filename)

[Section titled “filename()”](https://tauri.app/reference/javascript/window-state/#filename)

    function filename(): Promise<string>

Get the name of the file used to store window state.

#### [Returns](https://tauri.app/reference/javascript/window-state/#returns)

[Section titled “Returns”](https://tauri.app/reference/javascript/window-state/#returns)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`string`\>

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/window-state/guest-js/index.ts#L44](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/window-state/guest-js/index.ts#L44)

* * *

### [restoreState()](https://tauri.app/reference/javascript/window-state/#restorestate)

[Section titled “restoreState()”](https://tauri.app/reference/javascript/window-state/#restorestate)

    function restoreState(label, flags?): Promise<void>

Restore the state for the specified window from disk.

#### [Parameters](https://tauri.app/reference/javascript/window-state/#parameters)

[Section titled “Parameters”](https://tauri.app/reference/javascript/window-state/#parameters)

| Parameter | Type |
| --- | --- |
| `label` | `string` |
| `flags`? | [`StateFlags`](https://tauri.app/reference/javascript/window-state/#stateflags) |

#### [Returns](https://tauri.app/reference/javascript/window-state/#returns-1)

[Section titled “Returns”](https://tauri.app/reference/javascript/window-state/#returns-1)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`void`\>

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/window-state/guest-js/index.ts#L28](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/window-state/guest-js/index.ts#L28)

* * *

### [restoreStateCurrent()](https://tauri.app/reference/javascript/window-state/#restorestatecurrent)

[Section titled “restoreStateCurrent()”](https://tauri.app/reference/javascript/window-state/#restorestatecurrent)

    function restoreStateCurrent(flags?): Promise<void>

Restore the state for the current window from disk.

#### [Parameters](https://tauri.app/reference/javascript/window-state/#parameters-1)

[Section titled “Parameters”](https://tauri.app/reference/javascript/window-state/#parameters-1)

| Parameter | Type |
| --- | --- |
| `flags`? | [`StateFlags`](https://tauri.app/reference/javascript/window-state/#stateflags) |

#### [Returns](https://tauri.app/reference/javascript/window-state/#returns-2)

[Section titled “Returns”](https://tauri.app/reference/javascript/window-state/#returns-2)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`void`\>

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/window-state/guest-js/index.ts#L38](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/window-state/guest-js/index.ts#L38)

* * *

### [saveWindowState()](https://tauri.app/reference/javascript/window-state/#savewindowstate)

[Section titled “saveWindowState()”](https://tauri.app/reference/javascript/window-state/#savewindowstate)

    function saveWindowState(flags?): Promise<void>

Save the state of all open windows to disk.

#### [Parameters](https://tauri.app/reference/javascript/window-state/#parameters-2)

[Section titled “Parameters”](https://tauri.app/reference/javascript/window-state/#parameters-2)

| Parameter | Type |
| --- | --- |
| `flags`? | [`StateFlags`](https://tauri.app/reference/javascript/window-state/#stateflags) |

#### [Returns](https://tauri.app/reference/javascript/window-state/#returns-3)

[Section titled “Returns”](https://tauri.app/reference/javascript/window-state/#returns-3)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`void`\>

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/window-state/guest-js/index.ts#L21](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/window-state/guest-js/index.ts#L21)

* * *

[Support on Open Collective](https://opencollective.com/tauri)
 [Sponsor on GitHub](https://github.com/sponsors/tauri-apps)

© 2026 Tauri Contributors. CC-BY / MIT

---

# @tauri-apps/plugin-process | Tauri

[Skip to content](https://tauri.app/reference/javascript/process/#_top)

@tauri-apps/plugin-process
==========================

Perform operations on the current process.

[Functions](https://tauri.app/reference/javascript/process/#functions)

-----------------------------------------------------------------------

[Section titled “Functions”](https://tauri.app/reference/javascript/process/#functions)

### [exit()](https://tauri.app/reference/javascript/process/#exit)

[Section titled “exit()”](https://tauri.app/reference/javascript/process/#exit)

    function exit(code): Promise<void>

Exits immediately with the given `exitCode`.

#### [Parameters](https://tauri.app/reference/javascript/process/#parameters)

[Section titled “Parameters”](https://tauri.app/reference/javascript/process/#parameters)

| Parameter | Type | Default value | Description |
| --- | --- | --- | --- |
| `code` | `number` | `0` | The exit code to use. |

#### [Returns](https://tauri.app/reference/javascript/process/#returns)

[Section titled “Returns”](https://tauri.app/reference/javascript/process/#returns)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`void`\>

A promise indicating the success or failure of the operation.

#### [Example](https://tauri.app/reference/javascript/process/#example)

[Section titled “Example”](https://tauri.app/reference/javascript/process/#example)

    import { exit } from '@tauri-apps/plugin-process';await exit(1);

#### [Since](https://tauri.app/reference/javascript/process/#since)

[Section titled “Since”](https://tauri.app/reference/javascript/process/#since)

2.0.0

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/process/guest-js/index.ts#L25](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/process/guest-js/index.ts#L25)

* * *

### [relaunch()](https://tauri.app/reference/javascript/process/#relaunch)

[Section titled “relaunch()”](https://tauri.app/reference/javascript/process/#relaunch)

    function relaunch(): Promise<void>

Exits the current instance of the app then relaunches it.

#### [Returns](https://tauri.app/reference/javascript/process/#returns-1)

[Section titled “Returns”](https://tauri.app/reference/javascript/process/#returns-1)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`void`\>

A promise indicating the success or failure of the operation.

#### [Example](https://tauri.app/reference/javascript/process/#example-1)

[Section titled “Example”](https://tauri.app/reference/javascript/process/#example-1)

    import { relaunch } from '@tauri-apps/plugin-process';await relaunch();

#### [Since](https://tauri.app/reference/javascript/process/#since-1)

[Section titled “Since”](https://tauri.app/reference/javascript/process/#since-1)

2.0.0

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/process/guest-js/index.ts#L41](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/process/guest-js/index.ts#L41)

* * *

[Support on Open Collective](https://opencollective.com/tauri)
 [Sponsor on GitHub](https://github.com/sponsors/tauri-apps)

© 2026 Tauri Contributors. CC-BY / MIT

---

# @tauri-apps/plugin-os | Tauri

[Skip to content](https://tauri.app/reference/javascript/os/#_top)

@tauri-apps/plugin-os
=====================

Provides operating system-related utility methods and properties.

[Type Aliases](https://tauri.app/reference/javascript/os/#type-aliases)

------------------------------------------------------------------------

[Section titled “Type Aliases”](https://tauri.app/reference/javascript/os/#type-aliases)

### [Arch](https://tauri.app/reference/javascript/os/#arch)

[Section titled “Arch”](https://tauri.app/reference/javascript/os/#arch)

    type Arch:  | "x86"  | "x86_64"  | "arm"  | "aarch64"  | "mips"  | "mips64"  | "powerpc"  | "powerpc64"  | "riscv64"  | "s390x"  | "sparc64";

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/os/guest-js/index.ts#L42](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/os/guest-js/index.ts#L42)

* * *

### [Family](https://tauri.app/reference/javascript/os/#family)

[Section titled “Family”](https://tauri.app/reference/javascript/os/#family)

    type Family: "unix" | "windows";

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/os/guest-js/index.ts#L97](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/os/guest-js/index.ts#L97)

* * *

### [OsType](https://tauri.app/reference/javascript/os/#ostype)

[Section titled “OsType”](https://tauri.app/reference/javascript/os/#ostype)

    type OsType:  | "linux"  | "windows"  | "macos"  | "ios"  | "android";

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/os/guest-js/index.ts#L40](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/os/guest-js/index.ts#L40)

* * *

### [Platform](https://tauri.app/reference/javascript/os/#platform)

[Section titled “Platform”](https://tauri.app/reference/javascript/os/#platform)

    type Platform:  | "linux"  | "macos"  | "ios"  | "freebsd"  | "dragonfly"  | "netbsd"  | "openbsd"  | "solaris"  | "android"  | "windows";

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/os/guest-js/index.ts#L28](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/os/guest-js/index.ts#L28)

[Functions](https://tauri.app/reference/javascript/os/#functions)

------------------------------------------------------------------

[Section titled “Functions”](https://tauri.app/reference/javascript/os/#functions)

### [arch()](https://tauri.app/reference/javascript/os/#arch-1)

[Section titled “arch()”](https://tauri.app/reference/javascript/os/#arch-1)

    function arch(): Arch

Returns the current operating system architecture. Possible values are `'x86'`, `'x86_64'`, `'arm'`, `'aarch64'`, `'mips'`, `'mips64'`, `'powerpc'`, `'powerpc64'`, `'riscv64'`, `'s390x'`, `'sparc64'`.

#### [Returns](https://tauri.app/reference/javascript/os/#returns)

[Section titled “Returns”](https://tauri.app/reference/javascript/os/#returns)

[`Arch`](https://tauri.app/reference/javascript/os/#arch)

#### [Example](https://tauri.app/reference/javascript/os/#example)

[Section titled “Example”](https://tauri.app/reference/javascript/os/#example)

    import { arch } from '@tauri-apps/plugin-os';const archName = arch();

#### [Since](https://tauri.app/reference/javascript/os/#since)

[Section titled “Since”](https://tauri.app/reference/javascript/os/#since)

2.0.0

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/os/guest-js/index.ts#L138](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/os/guest-js/index.ts#L138)

* * *

### [eol()](https://tauri.app/reference/javascript/os/#eol)

[Section titled “eol()”](https://tauri.app/reference/javascript/os/#eol)

    function eol(): string

Returns the operating system-specific end-of-line marker.

*   `\n` on POSIX
*   `\r\n` on Windows

#### [Returns](https://tauri.app/reference/javascript/os/#returns-1)

[Section titled “Returns”](https://tauri.app/reference/javascript/os/#returns-1)

`string`

#### [Since](https://tauri.app/reference/javascript/os/#since-1)

[Section titled “Since”](https://tauri.app/reference/javascript/os/#since-1)

2.0.0

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/os/guest-js/index.ts#L62](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/os/guest-js/index.ts#L62)

* * *

### [exeExtension()](https://tauri.app/reference/javascript/os/#exeextension)

[Section titled “exeExtension()”](https://tauri.app/reference/javascript/os/#exeextension)

    function exeExtension(): string

Returns the file extension, if any, used for executable binaries on this platform. Possible values are `'exe'` and `''` (empty string).

#### [Returns](https://tauri.app/reference/javascript/os/#returns-2)

[Section titled “Returns”](https://tauri.app/reference/javascript/os/#returns-2)

`string`

#### [Example](https://tauri.app/reference/javascript/os/#example-1)

[Section titled “Example”](https://tauri.app/reference/javascript/os/#example-1)

    import { exeExtension } from '@tauri-apps/plugin-os';const exeExt = exeExtension();

#### [Since](https://tauri.app/reference/javascript/os/#since-2)

[Section titled “Since”](https://tauri.app/reference/javascript/os/#since-2)

2.0.0

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/os/guest-js/index.ts#L152](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/os/guest-js/index.ts#L152)

* * *

### [family()](https://tauri.app/reference/javascript/os/#family-1)

[Section titled “family()”](https://tauri.app/reference/javascript/os/#family-1)

    function family(): Family

Returns the current operating system family. Possible values are `'unix'`, `'windows'`.

#### [Returns](https://tauri.app/reference/javascript/os/#returns-3)

[Section titled “Returns”](https://tauri.app/reference/javascript/os/#returns-3)

[`Family`](https://tauri.app/reference/javascript/os/#family)

#### [Example](https://tauri.app/reference/javascript/os/#example-2)

[Section titled “Example”](https://tauri.app/reference/javascript/os/#example-2)

    import { family } from '@tauri-apps/plugin-os';const family = family();

#### [Since](https://tauri.app/reference/javascript/os/#since-3)

[Section titled “Since”](https://tauri.app/reference/javascript/os/#since-3)

2.0.0

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/os/guest-js/index.ts#L109](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/os/guest-js/index.ts#L109)

* * *

### [hostname()](https://tauri.app/reference/javascript/os/#hostname)

[Section titled “hostname()”](https://tauri.app/reference/javascript/os/#hostname)

    function hostname(): Promise<string | null>

Returns the host name of the operating system.

#### [Returns](https://tauri.app/reference/javascript/os/#returns-4)

[Section titled “Returns”](https://tauri.app/reference/javascript/os/#returns-4)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`string` | `null`\>

#### [Example](https://tauri.app/reference/javascript/os/#example-3)

[Section titled “Example”](https://tauri.app/reference/javascript/os/#example-3)

    import { hostname } from '@tauri-apps/plugin-os';const hostname = await hostname();

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/os/guest-js/index.ts#L181](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/os/guest-js/index.ts#L181)

* * *

### [locale()](https://tauri.app/reference/javascript/os/#locale)

[Section titled “locale()”](https://tauri.app/reference/javascript/os/#locale)

    function locale(): Promise<string | null>

Returns a String with a `BCP-47` language tag inside. If the locale couldn’t be obtained, `null` is returned instead.

#### [Returns](https://tauri.app/reference/javascript/os/#returns-5)

[Section titled “Returns”](https://tauri.app/reference/javascript/os/#returns-5)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`string` | `null`\>

#### [Example](https://tauri.app/reference/javascript/os/#example-4)

[Section titled “Example”](https://tauri.app/reference/javascript/os/#example-4)

    import { locale } from '@tauri-apps/plugin-os';const locale = await locale();if (locale) {   // use the locale string here}

#### [Since](https://tauri.app/reference/javascript/os/#since-4)

[Section titled “Since”](https://tauri.app/reference/javascript/os/#since-4)

2.0.0

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/os/guest-js/index.ts#L169](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/os/guest-js/index.ts#L169)

* * *

### [platform()](https://tauri.app/reference/javascript/os/#platform-1)

[Section titled “platform()”](https://tauri.app/reference/javascript/os/#platform-1)

    function platform(): Platform

Returns a string describing the specific operating system in use. The value is set at compile time. Possible values are `'linux'`, `'macos'`, `'ios'`, `'freebsd'`, `'dragonfly'`, `'netbsd'`, `'openbsd'`, `'solaris'`, `'android'`, `'windows'`

#### [Returns](https://tauri.app/reference/javascript/os/#returns-6)

[Section titled “Returns”](https://tauri.app/reference/javascript/os/#returns-6)

[`Platform`](https://tauri.app/reference/javascript/os/#platform)

#### [Example](https://tauri.app/reference/javascript/os/#example-5)

[Section titled “Example”](https://tauri.app/reference/javascript/os/#example-5)

    import { platform } from '@tauri-apps/plugin-os';const platformName = platform();

#### [Since](https://tauri.app/reference/javascript/os/#since-5)

[Section titled “Since”](https://tauri.app/reference/javascript/os/#since-5)

2.0.0

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/os/guest-js/index.ts#L79](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/os/guest-js/index.ts#L79)

* * *

### [type()](https://tauri.app/reference/javascript/os/#type)

[Section titled “type()”](https://tauri.app/reference/javascript/os/#type)

    function type(): OsType

Returns the current operating system type. Returns `'linux'` on Linux, `'macos'` on macOS, `'windows'` on Windows, `'ios'` on iOS and `'android'` on Android.

#### [Returns](https://tauri.app/reference/javascript/os/#returns-7)

[Section titled “Returns”](https://tauri.app/reference/javascript/os/#returns-7)

[`OsType`](https://tauri.app/reference/javascript/os/#ostype)

#### [Example](https://tauri.app/reference/javascript/os/#example-6)

[Section titled “Example”](https://tauri.app/reference/javascript/os/#example-6)

    import { type } from '@tauri-apps/plugin-os';const osType = type();

#### [Since](https://tauri.app/reference/javascript/os/#since-6)

[Section titled “Since”](https://tauri.app/reference/javascript/os/#since-6)

2.0.0

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/os/guest-js/index.ts#L123](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/os/guest-js/index.ts#L123)

* * *

### [version()](https://tauri.app/reference/javascript/os/#version)

[Section titled “version()”](https://tauri.app/reference/javascript/os/#version)

    function version(): string

Returns the current operating system version.

#### [Returns](https://tauri.app/reference/javascript/os/#returns-8)

[Section titled “Returns”](https://tauri.app/reference/javascript/os/#returns-8)

`string`

#### [Example](https://tauri.app/reference/javascript/os/#example-7)

[Section titled “Example”](https://tauri.app/reference/javascript/os/#example-7)

    import { version } from '@tauri-apps/plugin-os';const osVersion = version();

#### [Since](https://tauri.app/reference/javascript/os/#since-7)

[Section titled “Since”](https://tauri.app/reference/javascript/os/#since-7)

2.0.0

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/os/guest-js/index.ts#L93](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/os/guest-js/index.ts#L93)

* * *

[Support on Open Collective](https://opencollective.com/tauri)
 [Sponsor on GitHub](https://github.com/sponsors/tauri-apps)

© 2026 Tauri Contributors. CC-BY / MIT

---

# mocks | Tauri

[Skip to content](https://tauri.app/reference/javascript/api/namespacemocks/#_top)

mocks
=====

[Interfaces](https://tauri.app/reference/javascript/api/namespacemocks/#interfaces)

------------------------------------------------------------------------------------

[Section titled “Interfaces”](https://tauri.app/reference/javascript/api/namespacemocks/#interfaces)

### [MockIPCOptions](https://tauri.app/reference/javascript/api/namespacemocks/#mockipcoptions)

[Section titled “MockIPCOptions”](https://tauri.app/reference/javascript/api/namespacemocks/#mockipcoptions)

Options for `mockIPC`.

[Options](https://tauri.app/reference/javascript/api/namespacemocks/#options)

==============================================================================

[Section titled “Options”](https://tauri.app/reference/javascript/api/namespacemocks/#options)

`shouldMockEvents`: If true, the `listen` and `emit` functions will be mocked, allowing you to test event handling without a real backend. **This will consume any events emitted with the `plugin:event` prefix.**

#### [Since](https://tauri.app/reference/javascript/api/namespacemocks/#since)

[Section titled “Since”](https://tauri.app/reference/javascript/api/namespacemocks/#since)

2.7.0

#### [Properties](https://tauri.app/reference/javascript/api/namespacemocks/#properties)

[Section titled “Properties”](https://tauri.app/reference/javascript/api/namespacemocks/#properties)

| Property | Type | Defined in |
| --- | --- | --- |
| `shouldMockEvents?` | `boolean` | **Source**: [https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/mocks.ts#L24](https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/mocks.ts#L24) |

[Functions](https://tauri.app/reference/javascript/api/namespacemocks/#functions)

----------------------------------------------------------------------------------

[Section titled “Functions”](https://tauri.app/reference/javascript/api/namespacemocks/#functions)

### [clearMocks()](https://tauri.app/reference/javascript/api/namespacemocks/#clearmocks)

[Section titled “clearMocks()”](https://tauri.app/reference/javascript/api/namespacemocks/#clearmocks)

    function clearMocks(): void

Clears mocked functions/data injected by the other functions in this module. When using a test runner that doesn’t provide a fresh window object for each test, calling this function will reset tauri specific properties.

[Example](https://tauri.app/reference/javascript/api/namespacemocks/#example)

==============================================================================

[Section titled “Example”](https://tauri.app/reference/javascript/api/namespacemocks/#example)

    import { mockWindows, clearMocks } from "@tauri-apps/api/mocks"
    afterEach(() => {   clearMocks()})
    test("mocked windows", () => {   mockWindows("main", "second", "third");
       expect(window.__TAURI_INTERNALS__).toHaveProperty("metadata")})
    test("no mocked windows", () => {   expect(window.__TAURI_INTERNALS__).not.toHaveProperty("metadata")})

#### [Returns](https://tauri.app/reference/javascript/api/namespacemocks/#returns)

[Section titled “Returns”](https://tauri.app/reference/javascript/api/namespacemocks/#returns)

`void`

#### [Since](https://tauri.app/reference/javascript/api/namespacemocks/#since-1)

[Section titled “Since”](https://tauri.app/reference/javascript/api/namespacemocks/#since-1)

1.0.0

**Source**: [https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/mocks.ts#L316](https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/mocks.ts#L316)

* * *

### [mockConvertFileSrc()](https://tauri.app/reference/javascript/api/namespacemocks/#mockconvertfilesrc)

[Section titled “mockConvertFileSrc()”](https://tauri.app/reference/javascript/api/namespacemocks/#mockconvertfilesrc)

    function mockConvertFileSrc(osName): void

Mock `convertFileSrc` function

#### [Parameters](https://tauri.app/reference/javascript/api/namespacemocks/#parameters)

[Section titled “Parameters”](https://tauri.app/reference/javascript/api/namespacemocks/#parameters)

| Parameter | Type | Description |
| --- | --- | --- |
| `osName` | `string` | The operating system to mock, can be one of linux, macos, or windows |

#### [Returns](https://tauri.app/reference/javascript/api/namespacemocks/#returns-1)

[Section titled “Returns”](https://tauri.app/reference/javascript/api/namespacemocks/#returns-1)

`void`

#### [Example](https://tauri.app/reference/javascript/api/namespacemocks/#example-1)

[Section titled “Example”](https://tauri.app/reference/javascript/api/namespacemocks/#example-1)

    import { mockConvertFileSrc } from "@tauri-apps/api/mocks";import { convertFileSrc } from "@tauri-apps/api/core";
    mockConvertFileSrc("windows")
    const url = convertFileSrc("C:\\Users\\user\\file.txt")

#### [Since](https://tauri.app/reference/javascript/api/namespacemocks/#since-2)

[Section titled “Since”](https://tauri.app/reference/javascript/api/namespacemocks/#since-2)

1.6.0

**Source**: [https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/mocks.ts#L277](https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/mocks.ts#L277)

* * *

### [mockIPC()](https://tauri.app/reference/javascript/api/namespacemocks/#mockipc)

[Section titled “mockIPC()”](https://tauri.app/reference/javascript/api/namespacemocks/#mockipc)

    function mockIPC(cb, options?): void

Intercepts all IPC requests with the given mock handler.

This function can be used when testing tauri frontend applications or when running the frontend in a Node.js context during static site generation.

[Examples](https://tauri.app/reference/javascript/api/namespacemocks/#examples)

================================================================================

[Section titled “Examples”](https://tauri.app/reference/javascript/api/namespacemocks/#examples)

Testing setup using Vitest:

    import { mockIPC, clearMocks } from "@tauri-apps/api/mocks"import { invoke } from "@tauri-apps/api/core"
    afterEach(() => {   clearMocks()})
    test("mocked command", () => { mockIPC((cmd, payload) => {  switch (cmd) {    case "add":      return (payload.a as number) + (payload.b as number);    default:      break;    } });
     expect(invoke('add', { a: 12, b: 15 })).resolves.toBe(27);})

The callback function can also return a Promise:

    import { mockIPC, clearMocks } from "@tauri-apps/api/mocks"import { invoke } from "@tauri-apps/api/core"
    afterEach(() => {   clearMocks()})
    test("mocked command", () => { mockIPC((cmd, payload) => {  if(cmd === "get_data") {   return fetch("https://example.com/data.json")     .then((response) => response.json())  } });
     expect(invoke('get_data')).resolves.toBe({ foo: 'bar' });})

`listen` can also be mocked with direct calls to the `emit` function. This functionality is opt-in via the `shouldMockEvents` option:

    import { mockIPC, clearMocks } from "@tauri-apps/api/mocks"import { emit, listen } from "@tauri-apps/api/event"
    afterEach(() => {   clearMocks()})
    test("mocked event", () => { mockIPC(() => {}, { shouldMockEvents: true }); // enable event mocking
     const eventHandler = vi.fn(); listen('test-event', eventHandler); // typically in component setup or similar
     emit('test-event', { foo: 'bar' }); expect(eventHandler).toHaveBeenCalledWith({   event: 'test-event',   payload: { foo: 'bar' } });})

`emitTo` is currently **not** supported by this mock implementation.

#### [Parameters](https://tauri.app/reference/javascript/api/namespacemocks/#parameters-1)

[Section titled “Parameters”](https://tauri.app/reference/javascript/api/namespacemocks/#parameters-1)

| Parameter | Type |
| --- | --- |
| `cb` | (`cmd`, `payload`?) => `unknown` |
| `options`? | [`MockIPCOptions`](https://tauri.app/reference/javascript/api/namespacemocks/#mockipcoptions) |

#### [Returns](https://tauri.app/reference/javascript/api/namespacemocks/#returns-2)

[Section titled “Returns”](https://tauri.app/reference/javascript/api/namespacemocks/#returns-2)

`void`

#### [Since](https://tauri.app/reference/javascript/api/namespacemocks/#since-3)

[Section titled “Since”](https://tauri.app/reference/javascript/api/namespacemocks/#since-3)

1.0.0

**Source**: [https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/mocks.ts#L104](https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/mocks.ts#L104)

* * *

### [mockWindows()](https://tauri.app/reference/javascript/api/namespacemocks/#mockwindows)

[Section titled “mockWindows()”](https://tauri.app/reference/javascript/api/namespacemocks/#mockwindows)

    function mockWindows(current, ..._additionalWindows): void

Mocks one or many window labels. In non-tauri context it is required to call this function _before_ using the `@tauri-apps/api/window` module.

This function only mocks the _presence_ of windows, window properties (e.g. width and height) can be mocked like regular IPC calls using the `mockIPC` function.

[Examples](https://tauri.app/reference/javascript/api/namespacemocks/#examples-1)

==================================================================================

[Section titled “Examples”](https://tauri.app/reference/javascript/api/namespacemocks/#examples-1)

    import { mockWindows } from "@tauri-apps/api/mocks";import { getCurrentWindow } from "@tauri-apps/api/window";
    mockWindows("main", "second", "third");
    const win = getCurrentWindow();
    win.label // "main"

    import { mockWindows } from "@tauri-apps/api/mocks";
    mockWindows("main", "second", "third");
    mockIPC((cmd, args) => { if (cmd === "plugin:event|emit") {   console.log('emit event', args?.event, args?.payload); }});
    const { emit } = await import("@tauri-apps/api/event");await emit('loaded'); // this will cause the mocked IPC handler to log to the console.

#### [Parameters](https://tauri.app/reference/javascript/api/namespacemocks/#parameters-2)

[Section titled “Parameters”](https://tauri.app/reference/javascript/api/namespacemocks/#parameters-2)

| Parameter | Type | Description |
| --- | --- | --- |
| `current` | `string` | Label of window this JavaScript context is running in. |
| …`_additionalWindows` | `string`\[\] | \-  |

#### [Returns](https://tauri.app/reference/javascript/api/namespacemocks/#returns-3)

[Section titled “Returns”](https://tauri.app/reference/javascript/api/namespacemocks/#returns-3)

`void`

#### [Since](https://tauri.app/reference/javascript/api/namespacemocks/#since-4)

[Section titled “Since”](https://tauri.app/reference/javascript/api/namespacemocks/#since-4)

1.0.0

**Source**: [https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/mocks.ts#L248](https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/mocks.ts#L248)

* * *

[Support on Open Collective](https://opencollective.com/tauri)
 [Sponsor on GitHub](https://github.com/sponsors/tauri-apps)

© 2026 Tauri Contributors. CC-BY / MIT

---

# event | Tauri

[Skip to content](https://tauri.app/reference/javascript/api/namespaceevent/#_top)

event
=====

The event system allows you to emit events to the backend and listen to events from it.

This package is also accessible with `window.__TAURI__.event` when [`app.withGlobalTauri`](https://v2.tauri.app/reference/config/#withglobaltauri)
 in `tauri.conf.json` is set to `true`.

[Enumerations](https://tauri.app/reference/javascript/api/namespaceevent/#enumerations)

----------------------------------------------------------------------------------------

[Section titled “Enumerations”](https://tauri.app/reference/javascript/api/namespaceevent/#enumerations)

### [TauriEvent](https://tauri.app/reference/javascript/api/namespaceevent/#taurievent)

[Section titled “TauriEvent”](https://tauri.app/reference/javascript/api/namespaceevent/#taurievent)

#### [Since](https://tauri.app/reference/javascript/api/namespaceevent/#since)

[Section titled “Since”](https://tauri.app/reference/javascript/api/namespaceevent/#since)

1.1.0

#### [Enumeration Members](https://tauri.app/reference/javascript/api/namespaceevent/#enumeration-members)

[Section titled “Enumeration Members”](https://tauri.app/reference/javascript/api/namespaceevent/#enumeration-members)

##### [DRAG\_DROP](https://tauri.app/reference/javascript/api/namespaceevent/#drag_drop)

[Section titled “DRAG\_DROP”](https://tauri.app/reference/javascript/api/namespaceevent/#drag_drop)

    DRAG_DROP: "tauri://drag-drop";

**Source**: [https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/event.ts#L71](https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/event.ts#L71)

##### [DRAG\_ENTER](https://tauri.app/reference/javascript/api/namespaceevent/#drag_enter)

[Section titled “DRAG\_ENTER”](https://tauri.app/reference/javascript/api/namespaceevent/#drag_enter)

    DRAG_ENTER: "tauri://drag-enter";

**Source**: [https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/event.ts#L69](https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/event.ts#L69)

##### [DRAG\_LEAVE](https://tauri.app/reference/javascript/api/namespaceevent/#drag_leave)

[Section titled “DRAG\_LEAVE”](https://tauri.app/reference/javascript/api/namespaceevent/#drag_leave)

    DRAG_LEAVE: "tauri://drag-leave";

**Source**: [https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/event.ts#L72](https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/event.ts#L72)

##### [DRAG\_OVER](https://tauri.app/reference/javascript/api/namespaceevent/#drag_over)

[Section titled “DRAG\_OVER”](https://tauri.app/reference/javascript/api/namespaceevent/#drag_over)

    DRAG_OVER: "tauri://drag-over";

**Source**: [https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/event.ts#L70](https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/event.ts#L70)

##### [WEBVIEW\_CREATED](https://tauri.app/reference/javascript/api/namespaceevent/#webview_created)

[Section titled “WEBVIEW\_CREATED”](https://tauri.app/reference/javascript/api/namespaceevent/#webview_created)

    WEBVIEW_CREATED: "tauri://webview-created";

**Source**: [https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/event.ts#L68](https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/event.ts#L68)

##### [WINDOW\_BLUR](https://tauri.app/reference/javascript/api/namespaceevent/#window_blur)

[Section titled “WINDOW\_BLUR”](https://tauri.app/reference/javascript/api/namespaceevent/#window_blur)

    WINDOW_BLUR: "tauri://blur";

**Source**: [https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/event.ts#L64](https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/event.ts#L64)

##### [WINDOW\_CLOSE\_REQUESTED](https://tauri.app/reference/javascript/api/namespaceevent/#window_close_requested)

[Section titled “WINDOW\_CLOSE\_REQUESTED”](https://tauri.app/reference/javascript/api/namespaceevent/#window_close_requested)

    WINDOW_CLOSE_REQUESTED: "tauri://close-requested";

**Source**: [https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/event.ts#L61](https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/event.ts#L61)

##### [WINDOW\_CREATED](https://tauri.app/reference/javascript/api/namespaceevent/#window_created)

[Section titled “WINDOW\_CREATED”](https://tauri.app/reference/javascript/api/namespaceevent/#window_created)

    WINDOW_CREATED: "tauri://window-created";

**Source**: [https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/event.ts#L67](https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/event.ts#L67)

##### [WINDOW\_DESTROYED](https://tauri.app/reference/javascript/api/namespaceevent/#window_destroyed)

[Section titled “WINDOW\_DESTROYED”](https://tauri.app/reference/javascript/api/namespaceevent/#window_destroyed)

    WINDOW_DESTROYED: "tauri://destroyed";

**Source**: [https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/event.ts#L62](https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/event.ts#L62)

##### [WINDOW\_FOCUS](https://tauri.app/reference/javascript/api/namespaceevent/#window_focus)

[Section titled “WINDOW\_FOCUS”](https://tauri.app/reference/javascript/api/namespaceevent/#window_focus)

    WINDOW_FOCUS: "tauri://focus";

**Source**: [https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/event.ts#L63](https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/event.ts#L63)

##### [WINDOW\_MOVED](https://tauri.app/reference/javascript/api/namespaceevent/#window_moved)

[Section titled “WINDOW\_MOVED”](https://tauri.app/reference/javascript/api/namespaceevent/#window_moved)

    WINDOW_MOVED: "tauri://move";

**Source**: [https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/event.ts#L60](https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/event.ts#L60)

##### [WINDOW\_RESIZED](https://tauri.app/reference/javascript/api/namespaceevent/#window_resized)

[Section titled “WINDOW\_RESIZED”](https://tauri.app/reference/javascript/api/namespaceevent/#window_resized)

    WINDOW_RESIZED: "tauri://resize";

**Source**: [https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/event.ts#L59](https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/event.ts#L59)

##### [WINDOW\_SCALE\_FACTOR\_CHANGED](https://tauri.app/reference/javascript/api/namespaceevent/#window_scale_factor_changed)

[Section titled “WINDOW\_SCALE\_FACTOR\_CHANGED”](https://tauri.app/reference/javascript/api/namespaceevent/#window_scale_factor_changed)

    WINDOW_SCALE_FACTOR_CHANGED: "tauri://scale-change";

**Source**: [https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/event.ts#L65](https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/event.ts#L65)

##### [WINDOW\_THEME\_CHANGED](https://tauri.app/reference/javascript/api/namespaceevent/#window_theme_changed)

[Section titled “WINDOW\_THEME\_CHANGED”](https://tauri.app/reference/javascript/api/namespaceevent/#window_theme_changed)

    WINDOW_THEME_CHANGED: "tauri://theme-changed";

**Source**: [https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/event.ts#L66](https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/event.ts#L66)

[Interfaces](https://tauri.app/reference/javascript/api/namespaceevent/#interfaces)

------------------------------------------------------------------------------------

[Section titled “Interfaces”](https://tauri.app/reference/javascript/api/namespaceevent/#interfaces)

### [Event<T>](https://tauri.app/reference/javascript/api/namespaceevent/#eventt)

[Section titled “Event<T>”](https://tauri.app/reference/javascript/api/namespaceevent/#eventt)

#### [Type Parameters](https://tauri.app/reference/javascript/api/namespaceevent/#type-parameters)

[Section titled “Type Parameters”](https://tauri.app/reference/javascript/api/namespaceevent/#type-parameters)

| Type Parameter |
| --- |
| `T` |

#### [Properties](https://tauri.app/reference/javascript/api/namespaceevent/#properties)

[Section titled “Properties”](https://tauri.app/reference/javascript/api/namespaceevent/#properties)

| Property | Type | Description | Defined in |
| --- | --- | --- | --- |
| `event` | [`EventName`](https://tauri.app/reference/javascript/api/namespaceevent/#eventname) | Event name | **Source**: [https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/event.ts#L32](https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/event.ts#L32) |
| `id` | `number` | Event identifier used to unlisten | **Source**: [https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/event.ts#L34](https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/event.ts#L34) |
| `payload` | `T` | Event payload | **Source**: [https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/event.ts#L36](https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/event.ts#L36) |

* * *

### [Options](https://tauri.app/reference/javascript/api/namespaceevent/#options)

[Section titled “Options”](https://tauri.app/reference/javascript/api/namespaceevent/#options)

#### [Properties](https://tauri.app/reference/javascript/api/namespaceevent/#properties-1)

[Section titled “Properties”](https://tauri.app/reference/javascript/api/namespaceevent/#properties-1)

| Property | Type | Description | Defined in |
| --- | --- | --- | --- |
| `target?` | `string` \| [`EventTarget`](https://tauri.app/reference/javascript/api/namespaceevent/#eventtarget) | The event target to listen to, defaults to `{ kind: 'Any' }`, see [EventTarget](https://tauri.app/reference/javascript/api/namespaceevent/#eventtarget)<br>. If a string is provided, EventTarget.AnyLabel is used. | **Source**: [https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/event.ts#L52](https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/event.ts#L52) |

[Type Aliases](https://tauri.app/reference/javascript/api/namespaceevent/#type-aliases)

----------------------------------------------------------------------------------------

[Section titled “Type Aliases”](https://tauri.app/reference/javascript/api/namespaceevent/#type-aliases)

### [EventCallback()<T>](https://tauri.app/reference/javascript/api/namespaceevent/#eventcallbackt)

[Section titled “EventCallback()<T>”](https://tauri.app/reference/javascript/api/namespaceevent/#eventcallbackt)

    type EventCallback<T>: (event) => void;

#### [Type Parameters](https://tauri.app/reference/javascript/api/namespaceevent/#type-parameters-1)

[Section titled “Type Parameters”](https://tauri.app/reference/javascript/api/namespaceevent/#type-parameters-1)

| Type Parameter |
| --- |
| `T` |

#### [Parameters](https://tauri.app/reference/javascript/api/namespaceevent/#parameters)

[Section titled “Parameters”](https://tauri.app/reference/javascript/api/namespaceevent/#parameters)

| Parameter | Type |
| --- | --- |
| `event` | [`Event`](https://tauri.app/reference/javascript/api/namespaceevent/#eventt)<br><`T`\> |

#### [Returns](https://tauri.app/reference/javascript/api/namespaceevent/#returns)

[Section titled “Returns”](https://tauri.app/reference/javascript/api/namespaceevent/#returns)

`void`

**Source**: [https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/event.ts#L39](https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/event.ts#L39)

* * *

### [EventName](https://tauri.app/reference/javascript/api/namespaceevent/#eventname)

[Section titled “EventName”](https://tauri.app/reference/javascript/api/namespaceevent/#eventname)

    type EventName: `${TauriEvent}` | string & Record<never, never>;

**Source**: [https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/event.ts#L44](https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/event.ts#L44)

* * *

### [EventTarget](https://tauri.app/reference/javascript/api/namespaceevent/#eventtarget)

[Section titled “EventTarget”](https://tauri.app/reference/javascript/api/namespaceevent/#eventtarget)

    type EventTarget:  | object  | object  | object  | object  | object  | object;

**Source**: [https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/event.ts#L22](https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/event.ts#L22)

* * *

### [UnlistenFn()](https://tauri.app/reference/javascript/api/namespaceevent/#unlistenfn)

[Section titled “UnlistenFn()”](https://tauri.app/reference/javascript/api/namespaceevent/#unlistenfn)

    type UnlistenFn: () => void;

#### [Returns](https://tauri.app/reference/javascript/api/namespaceevent/#returns-1)

[Section titled “Returns”](https://tauri.app/reference/javascript/api/namespaceevent/#returns-1)

`void`

**Source**: [https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/event.ts#L42](https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/event.ts#L42)

[Functions](https://tauri.app/reference/javascript/api/namespaceevent/#functions)

----------------------------------------------------------------------------------

[Section titled “Functions”](https://tauri.app/reference/javascript/api/namespaceevent/#functions)

### [emit()](https://tauri.app/reference/javascript/api/namespaceevent/#emit)

[Section titled “emit()”](https://tauri.app/reference/javascript/api/namespaceevent/#emit)

    function emit<T>(event, payload?): Promise<void>

Emits an event to all [targets](https://tauri.app/reference/javascript/api/namespaceevent/#eventtarget)
.

#### [Type Parameters](https://tauri.app/reference/javascript/api/namespaceevent/#type-parameters-2)

[Section titled “Type Parameters”](https://tauri.app/reference/javascript/api/namespaceevent/#type-parameters-2)

| Type Parameter |
| --- |
| `T` |

#### [Parameters](https://tauri.app/reference/javascript/api/namespaceevent/#parameters-1)

[Section titled “Parameters”](https://tauri.app/reference/javascript/api/namespaceevent/#parameters-1)

| Parameter | Type | Description |
| --- | --- | --- |
| `event` | `string` | Event name. Must include only alphanumeric characters, `-`, `/`, `:` and `_`. |
| `payload`? | `T` | Event payload. |

#### [Returns](https://tauri.app/reference/javascript/api/namespaceevent/#returns-2)

[Section titled “Returns”](https://tauri.app/reference/javascript/api/namespaceevent/#returns-2)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`void`\>

#### [Example](https://tauri.app/reference/javascript/api/namespaceevent/#example)

[Section titled “Example”](https://tauri.app/reference/javascript/api/namespaceevent/#example)

    import { emit } from '@tauri-apps/api/event';await emit('frontend-loaded', { loggedIn: true, token: 'authToken' });

#### [Since](https://tauri.app/reference/javascript/api/namespaceevent/#since-1)

[Section titled “Since”](https://tauri.app/reference/javascript/api/namespaceevent/#since-1)

1.0.0

**Source**: [https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/event.ts#L186](https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/event.ts#L186)

* * *

### [emitTo()](https://tauri.app/reference/javascript/api/namespaceevent/#emitto)

[Section titled “emitTo()”](https://tauri.app/reference/javascript/api/namespaceevent/#emitto)

    function emitTo<T>(   target,   event,payload?): Promise<void>

Emits an event to all [targets](https://tauri.app/reference/javascript/api/namespaceevent/#eventtarget)
 matching the given target.

#### [Type Parameters](https://tauri.app/reference/javascript/api/namespaceevent/#type-parameters-3)

[Section titled “Type Parameters”](https://tauri.app/reference/javascript/api/namespaceevent/#type-parameters-3)

| Type Parameter |
| --- |
| `T` |

#### [Parameters](https://tauri.app/reference/javascript/api/namespaceevent/#parameters-2)

[Section titled “Parameters”](https://tauri.app/reference/javascript/api/namespaceevent/#parameters-2)

| Parameter | Type | Description |
| --- | --- | --- |
| `target` | `string` \| [`EventTarget`](https://tauri.app/reference/javascript/api/namespaceevent/#eventtarget) | Label of the target Window/Webview/WebviewWindow or raw [EventTarget](https://tauri.app/reference/javascript/api/namespaceevent/#eventtarget)<br> object. |
| `event` | `string` | Event name. Must include only alphanumeric characters, `-`, `/`, `:` and `_`. |
| `payload`? | `T` | Event payload. |

#### [Returns](https://tauri.app/reference/javascript/api/namespaceevent/#returns-3)

[Section titled “Returns”](https://tauri.app/reference/javascript/api/namespaceevent/#returns-3)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`void`\>

#### [Example](https://tauri.app/reference/javascript/api/namespaceevent/#example-1)

[Section titled “Example”](https://tauri.app/reference/javascript/api/namespaceevent/#example-1)

    import { emitTo } from '@tauri-apps/api/event';await emitTo('main', 'frontend-loaded', { loggedIn: true, token: 'authToken' });

#### [Since](https://tauri.app/reference/javascript/api/namespaceevent/#since-2)

[Section titled “Since”](https://tauri.app/reference/javascript/api/namespaceevent/#since-2)

2.0.0

**Source**: [https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/event.ts#L208](https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/event.ts#L208)

* * *

### [listen()](https://tauri.app/reference/javascript/api/namespaceevent/#listen)

[Section titled “listen()”](https://tauri.app/reference/javascript/api/namespaceevent/#listen)

    function listen<T>(   event,   handler,options?): Promise<UnlistenFn>

Listen to an emitted event to any [target](https://tauri.app/reference/javascript/api/namespaceevent/#eventtarget)
.

#### [Type Parameters](https://tauri.app/reference/javascript/api/namespaceevent/#type-parameters-4)

[Section titled “Type Parameters”](https://tauri.app/reference/javascript/api/namespaceevent/#type-parameters-4)

| Type Parameter |
| --- |
| `T` |

#### [Parameters](https://tauri.app/reference/javascript/api/namespaceevent/#parameters-3)

[Section titled “Parameters”](https://tauri.app/reference/javascript/api/namespaceevent/#parameters-3)

| Parameter | Type | Description |
| --- | --- | --- |
| `event` | [`EventName`](https://tauri.app/reference/javascript/api/namespaceevent/#eventname) | Event name. Must include only alphanumeric characters, `-`, `/`, `:` and `_`. |
| `handler` | [`EventCallback`](https://tauri.app/reference/javascript/api/namespaceevent/#eventcallbackt)<br><`T`\> | Event handler callback. |
| `options`? | [`Options`](https://tauri.app/reference/javascript/api/namespaceevent/#options) | Event listening options. |

#### [Returns](https://tauri.app/reference/javascript/api/namespaceevent/#returns-4)

[Section titled “Returns”](https://tauri.app/reference/javascript/api/namespaceevent/#returns-4)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<[`UnlistenFn`](https://tauri.app/reference/javascript/api/namespaceevent/#unlistenfn)
\>

A promise resolving to a function to unlisten to the event. Note that removing the listener is required if your listener goes out of scope e.g. the component is unmounted.

#### [Example](https://tauri.app/reference/javascript/api/namespaceevent/#example-2)

[Section titled “Example”](https://tauri.app/reference/javascript/api/namespaceevent/#example-2)

    import { listen } from '@tauri-apps/api/event';const unlisten = await listen<string>('error', (event) => {  console.log(`Got error, payload: ${event.payload}`);});
    // you need to call unlisten if your handler goes out of scope e.g. the component is unmountedunlisten();

#### [Since](https://tauri.app/reference/javascript/api/namespaceevent/#since-3)

[Section titled “Since”](https://tauri.app/reference/javascript/api/namespaceevent/#since-3)

1.0.0

**Source**: [https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/event.ts#L113](https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/event.ts#L113)

* * *

### [once()](https://tauri.app/reference/javascript/api/namespaceevent/#once)

[Section titled “once()”](https://tauri.app/reference/javascript/api/namespaceevent/#once)

    function once<T>(   event,   handler,options?): Promise<UnlistenFn>

Listens once to an emitted event to any [target](https://tauri.app/reference/javascript/api/namespaceevent/#eventtarget)
.

#### [Type Parameters](https://tauri.app/reference/javascript/api/namespaceevent/#type-parameters-5)

[Section titled “Type Parameters”](https://tauri.app/reference/javascript/api/namespaceevent/#type-parameters-5)

| Type Parameter |
| --- |
| `T` |

#### [Parameters](https://tauri.app/reference/javascript/api/namespaceevent/#parameters-4)

[Section titled “Parameters”](https://tauri.app/reference/javascript/api/namespaceevent/#parameters-4)

| Parameter | Type | Description |
| --- | --- | --- |
| `event` | [`EventName`](https://tauri.app/reference/javascript/api/namespaceevent/#eventname) | Event name. Must include only alphanumeric characters, `-`, `/`, `:` and `_`. |
| `handler` | [`EventCallback`](https://tauri.app/reference/javascript/api/namespaceevent/#eventcallbackt)<br><`T`\> | Event handler callback. |
| `options`? | [`Options`](https://tauri.app/reference/javascript/api/namespaceevent/#options) | Event listening options. |

#### [Returns](https://tauri.app/reference/javascript/api/namespaceevent/#returns-5)

[Section titled “Returns”](https://tauri.app/reference/javascript/api/namespaceevent/#returns-5)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<[`UnlistenFn`](https://tauri.app/reference/javascript/api/namespaceevent/#unlistenfn)
\>

A promise resolving to a function to unlisten to the event. Note that removing the listener is required if your listener goes out of scope e.g. the component is unmounted.

#### [Example](https://tauri.app/reference/javascript/api/namespaceevent/#example-3)

[Section titled “Example”](https://tauri.app/reference/javascript/api/namespaceevent/#example-3)

    import { once } from '@tauri-apps/api/event';interface LoadedPayload {  loggedIn: boolean,  token: string}const unlisten = await once<LoadedPayload>('loaded', (event) => {  console.log(`App is loaded, loggedIn: ${event.payload.loggedIn}, token: ${event.payload.token}`);});
    // you need to call unlisten if your handler goes out of scope e.g. the component is unmountedunlisten();

#### [Since](https://tauri.app/reference/javascript/api/namespaceevent/#since-4)

[Section titled “Since”](https://tauri.app/reference/javascript/api/namespaceevent/#since-4)

1.0.0

**Source**: [https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/event.ts#L157](https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/event.ts#L157)

* * *

[Support on Open Collective](https://opencollective.com/tauri)
 [Sponsor on GitHub](https://github.com/sponsors/tauri-apps)

© 2026 Tauri Contributors. CC-BY / MIT

---

# @tauri-apps/plugin-deep-link | Tauri

[Skip to content](https://tauri.app/reference/javascript/deep-link/#_top)

@tauri-apps/plugin-deep-link
============================

[Functions](https://tauri.app/reference/javascript/deep-link/#functions)

-------------------------------------------------------------------------

[Section titled “Functions”](https://tauri.app/reference/javascript/deep-link/#functions)

### [getCurrent()](https://tauri.app/reference/javascript/deep-link/#getcurrent)

[Section titled “getCurrent()”](https://tauri.app/reference/javascript/deep-link/#getcurrent)

    function getCurrent(): Promise<string[] | null>

Get the current URLs that triggered the deep link. Use this on app load to check whether your app was started via a deep link.

#### [Returns](https://tauri.app/reference/javascript/deep-link/#returns)

[Section titled “Returns”](https://tauri.app/reference/javascript/deep-link/#returns)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`string`\[\] | `null`\>

#### [Example](https://tauri.app/reference/javascript/deep-link/#example)

[Section titled “Example”](https://tauri.app/reference/javascript/deep-link/#example)

    import { getCurrent } from '@tauri-apps/plugin-deep-link';const urls = await getCurrent();

#### [\- **Windows / Linux**: This function reads the command line arguments and checks if there’s only one value, which must be an URL with scheme matching one of the configured values.](https://tauri.app/reference/javascript/deep-link/#--windows--linux-this-function-reads-the-command-line-arguments-and-checks-if-theres-only-one-value-which-must-be-an-url-with-scheme-matching-one-of-the-configured-values)

[Section titled “- Windows / Linux: This function reads the command line arguments and checks if there’s only one value, which must be an URL with scheme matching one of the configured values.”](https://tauri.app/reference/javascript/deep-link/#--windows--linux-this-function-reads-the-command-line-arguments-and-checks-if-theres-only-one-value-which-must-be-an-url-with-scheme-matching-one-of-the-configured-values)

Note that you must manually check the arguments when registering deep link schemes dynamically with \[`Self::register`\]. Additionally, the deep link might have been provided as a CLI argument so you should check if its format matches what you expect..

#### [Since](https://tauri.app/reference/javascript/deep-link/#since)

[Section titled “Since”](https://tauri.app/reference/javascript/deep-link/#since)

2.0.0

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/deep-link/guest-js/index.ts#L23](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/deep-link/guest-js/index.ts#L23)

* * *

### [isRegistered()](https://tauri.app/reference/javascript/deep-link/#isregistered)

[Section titled “isRegistered()”](https://tauri.app/reference/javascript/deep-link/#isregistered)

    function isRegistered(protocol): Promise<boolean>

Check whether the app is the default handler for the specified protocol.

#### [Parameters](https://tauri.app/reference/javascript/deep-link/#parameters)

[Section titled “Parameters”](https://tauri.app/reference/javascript/deep-link/#parameters)

| Parameter | Type | Description |
| --- | --- | --- |
| `protocol` | `string` | The name of the protocol without `://`. |

#### [Returns](https://tauri.app/reference/javascript/deep-link/#returns-1)

[Section titled “Returns”](https://tauri.app/reference/javascript/deep-link/#returns-1)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`boolean`\>

#### [Example](https://tauri.app/reference/javascript/deep-link/#example-1)

[Section titled “Example”](https://tauri.app/reference/javascript/deep-link/#example-1)

    import { isRegistered } from '@tauri-apps/plugin-deep-link';await isRegistered("my-scheme");

#### [\- **macOS / Android / iOS**: Unsupported.](https://tauri.app/reference/javascript/deep-link/#--macos--android--ios-unsupported)

[Section titled “- macOS / Android / iOS: Unsupported.”](https://tauri.app/reference/javascript/deep-link/#--macos--android--ios-unsupported)

#### [Since](https://tauri.app/reference/javascript/deep-link/#since-1)

[Section titled “Since”](https://tauri.app/reference/javascript/deep-link/#since-1)

2.0.0

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/deep-link/guest-js/index.ts#L80](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/deep-link/guest-js/index.ts#L80)

* * *

### [onOpenUrl()](https://tauri.app/reference/javascript/deep-link/#onopenurl)

[Section titled “onOpenUrl()”](https://tauri.app/reference/javascript/deep-link/#onopenurl)

    function onOpenUrl(handler): Promise<UnlistenFn>

Helper function for the `deep-link://new-url` event to run a function each time the protocol is triggered while the app is running. Use `getCurrent` on app load to check whether your app was started via a deep link.

#### [Parameters](https://tauri.app/reference/javascript/deep-link/#parameters-1)

[Section titled “Parameters”](https://tauri.app/reference/javascript/deep-link/#parameters-1)

| Parameter | Type |
| --- | --- |
| `handler` | (`urls`) => `void` |

#### [Returns](https://tauri.app/reference/javascript/deep-link/#returns-2)

[Section titled “Returns”](https://tauri.app/reference/javascript/deep-link/#returns-2)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`UnlistenFn`\>

#### [Example](https://tauri.app/reference/javascript/deep-link/#example-2)

[Section titled “Example”](https://tauri.app/reference/javascript/deep-link/#example-2)

    import { onOpenUrl } from '@tauri-apps/plugin-deep-link';await onOpenUrl((urls) => { console.log(urls) });

#### [\- **Windows / Linux**: Unsupported without the single-instance plugin. The OS will spawn a new app instance passing the URL as a CLI argument.](https://tauri.app/reference/javascript/deep-link/#--windows--linux-unsupported-without-the-single-instance-plugin-the-os-will-spawn-a-new-app-instance-passing-the-url-as-a-cli-argument)

[Section titled “- Windows / Linux: Unsupported without the single-instance plugin. The OS will spawn a new app instance passing the URL as a CLI argument.”](https://tauri.app/reference/javascript/deep-link/#--windows--linux-unsupported-without-the-single-instance-plugin-the-os-will-spawn-a-new-app-instance-passing-the-url-as-a-cli-argument)

#### [Since](https://tauri.app/reference/javascript/deep-link/#since-2)

[Section titled “Since”](https://tauri.app/reference/javascript/deep-link/#since-2)

2.0.0

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/deep-link/guest-js/index.ts#L99](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/deep-link/guest-js/index.ts#L99)

* * *

### [register()](https://tauri.app/reference/javascript/deep-link/#register)

[Section titled “register()”](https://tauri.app/reference/javascript/deep-link/#register)

    function register(protocol): Promise<null>

Register the app as the default handler for the specified protocol.

#### [Parameters](https://tauri.app/reference/javascript/deep-link/#parameters-2)

[Section titled “Parameters”](https://tauri.app/reference/javascript/deep-link/#parameters-2)

| Parameter | Type | Description |
| --- | --- | --- |
| `protocol` | `string` | The name of the protocol without `://`. For example, if you want your app to handle `tauri://` links, call this method with `tauri` as the protocol. |

#### [Returns](https://tauri.app/reference/javascript/deep-link/#returns-3)

[Section titled “Returns”](https://tauri.app/reference/javascript/deep-link/#returns-3)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`null`\>

#### [Example](https://tauri.app/reference/javascript/deep-link/#example-3)

[Section titled “Example”](https://tauri.app/reference/javascript/deep-link/#example-3)

    import { register } from '@tauri-apps/plugin-deep-link';await register("my-scheme");

#### [\- **macOS / Android / iOS**: Unsupported.](https://tauri.app/reference/javascript/deep-link/#--macos--android--ios-unsupported-1)

[Section titled “- macOS / Android / iOS: Unsupported.”](https://tauri.app/reference/javascript/deep-link/#--macos--android--ios-unsupported-1)

#### [Since](https://tauri.app/reference/javascript/deep-link/#since-3)

[Section titled “Since”](https://tauri.app/reference/javascript/deep-link/#since-3)

2.0.0

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/deep-link/guest-js/index.ts#L42](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/deep-link/guest-js/index.ts#L42)

* * *

### [unregister()](https://tauri.app/reference/javascript/deep-link/#unregister)

[Section titled “unregister()”](https://tauri.app/reference/javascript/deep-link/#unregister)

    function unregister(protocol): Promise<null>

Unregister the app as the default handler for the specified protocol.

#### [Parameters](https://tauri.app/reference/javascript/deep-link/#parameters-3)

[Section titled “Parameters”](https://tauri.app/reference/javascript/deep-link/#parameters-3)

| Parameter | Type | Description |
| --- | --- | --- |
| `protocol` | `string` | The name of the protocol without `://`. |

#### [Returns](https://tauri.app/reference/javascript/deep-link/#returns-4)

[Section titled “Returns”](https://tauri.app/reference/javascript/deep-link/#returns-4)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`null`\>

#### [Example](https://tauri.app/reference/javascript/deep-link/#example-4)

[Section titled “Example”](https://tauri.app/reference/javascript/deep-link/#example-4)

    import { unregister } from '@tauri-apps/plugin-deep-link';await unregister("my-scheme");

#### [\- **macOS / Linux / Android / iOS**: Unsupported.](https://tauri.app/reference/javascript/deep-link/#--macos--linux--android--ios-unsupported)

[Section titled “- macOS / Linux / Android / iOS: Unsupported.”](https://tauri.app/reference/javascript/deep-link/#--macos--linux--android--ios-unsupported)

#### [Since](https://tauri.app/reference/javascript/deep-link/#since-4)

[Section titled “Since”](https://tauri.app/reference/javascript/deep-link/#since-4)

2.0.0

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/deep-link/guest-js/index.ts#L61](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/deep-link/guest-js/index.ts#L61)

* * *

[Support on Open Collective](https://opencollective.com/tauri)
 [Sponsor on GitHub](https://github.com/sponsors/tauri-apps)

© 2026 Tauri Contributors. CC-BY / MIT

---

# @tauri-apps/plugin-http | Tauri

[Skip to content](https://tauri.app/reference/javascript/http/#_top)

@tauri-apps/plugin-http
=======================

Make HTTP requests with the Rust backend.

[Security](https://tauri.app/reference/javascript/http/#security)

------------------------------------------------------------------

[Section titled “Security”](https://tauri.app/reference/javascript/http/#security)

This API has a scope configuration that forces you to restrict the URLs that can be accessed using glob patterns.

For instance, this scope configuration only allows making HTTP requests to all subdomains for `tauri.app` except for `https://private.tauri.app`:

    {  "permissions": [    {      "identifier": "http:default",      "allow": [{ "url": "https://*.tauri.app" }],      "deny": [{ "url": "https://private.tauri.app" }]    }  ]}

Trying to execute any API with a URL not configured on the scope results in a promise rejection due to denied access.

[Interfaces](https://tauri.app/reference/javascript/http/#interfaces)

----------------------------------------------------------------------

[Section titled “Interfaces”](https://tauri.app/reference/javascript/http/#interfaces)

### [ClientOptions](https://tauri.app/reference/javascript/http/#clientoptions)

[Section titled “ClientOptions”](https://tauri.app/reference/javascript/http/#clientoptions)

Options to configure the Rust client used to make fetch requests

#### [Since](https://tauri.app/reference/javascript/http/#since)

[Section titled “Since”](https://tauri.app/reference/javascript/http/#since)

2.0.0

#### [Properties](https://tauri.app/reference/javascript/http/#properties)

[Section titled “Properties”](https://tauri.app/reference/javascript/http/#properties)

| Property | Type | Description | Defined in |
| --- | --- | --- | --- |
| `connectTimeout?` | `number` | Timeout in milliseconds | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/http/guest-js/index.ts#L82](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/http/guest-js/index.ts#L82) |
| `danger?` | [`DangerousSettings`](https://tauri.app/reference/javascript/http/#dangeroussettings) | Configuration for dangerous settings on the client such as disabling SSL verification. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/http/guest-js/index.ts#L90](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/http/guest-js/index.ts#L90) |
| `maxRedirections?` | `number` | Defines the maximum number of redirects the client should follow. If set to 0, no redirects will be followed. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/http/guest-js/index.ts#L80](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/http/guest-js/index.ts#L80) |
| `proxy?` | [`Proxy`](https://tauri.app/reference/javascript/http/#proxy-1) | Configuration of a proxy that a Client should pass requests to. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/http/guest-js/index.ts#L86](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/http/guest-js/index.ts#L86) |

* * *

### [DangerousSettings](https://tauri.app/reference/javascript/http/#dangeroussettings)

[Section titled “DangerousSettings”](https://tauri.app/reference/javascript/http/#dangeroussettings)

Configuration for dangerous settings on the client such as disabling SSL verification.

#### [Since](https://tauri.app/reference/javascript/http/#since-1)

[Section titled “Since”](https://tauri.app/reference/javascript/http/#since-1)

2.3.0

#### [Properties](https://tauri.app/reference/javascript/http/#properties-1)

[Section titled “Properties”](https://tauri.app/reference/javascript/http/#properties-1)

| Property | Type | Description | Defined in |
| --- | --- | --- | --- |
| `acceptInvalidCerts?` | `boolean` | Disables SSL verification. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/http/guest-js/index.ts#L102](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/http/guest-js/index.ts#L102) |
| `acceptInvalidHostnames?` | `boolean` | Disables hostname verification. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/http/guest-js/index.ts#L106](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/http/guest-js/index.ts#L106) |

* * *

### [Proxy](https://tauri.app/reference/javascript/http/#proxy)

[Section titled “Proxy”](https://tauri.app/reference/javascript/http/#proxy)

Configuration of a proxy that a Client should pass requests to.

#### [Since](https://tauri.app/reference/javascript/http/#since-2)

[Section titled “Since”](https://tauri.app/reference/javascript/http/#since-2)

2.0.0

#### [Properties](https://tauri.app/reference/javascript/http/#properties-2)

[Section titled “Properties”](https://tauri.app/reference/javascript/http/#properties-2)

| Property | Type | Description | Defined in |
| --- | --- | --- | --- |
| `all?` | `string` \| [`ProxyConfig`](https://tauri.app/reference/javascript/http/#proxyconfig) | Proxy all traffic to the passed URL. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/http/guest-js/index.ts#L40](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/http/guest-js/index.ts#L40) |
| `http?` | `string` \| [`ProxyConfig`](https://tauri.app/reference/javascript/http/#proxyconfig) | Proxy all HTTP traffic to the passed URL. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/http/guest-js/index.ts#L44](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/http/guest-js/index.ts#L44) |
| `https?` | `string` \| [`ProxyConfig`](https://tauri.app/reference/javascript/http/#proxyconfig) | Proxy all HTTPS traffic to the passed URL. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/http/guest-js/index.ts#L48](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/http/guest-js/index.ts#L48) |

* * *

### [ProxyConfig](https://tauri.app/reference/javascript/http/#proxyconfig)

[Section titled “ProxyConfig”](https://tauri.app/reference/javascript/http/#proxyconfig)

#### [Properties](https://tauri.app/reference/javascript/http/#properties-3)

[Section titled “Properties”](https://tauri.app/reference/javascript/http/#properties-3)

| Property | Type | Description | Defined in |
| --- | --- | --- | --- |
| `basicAuth?` | `object` | Set the `Proxy-Authorization` header using Basic auth. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/http/guest-js/index.ts#L59](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/http/guest-js/index.ts#L59) |
| `basicAuth.password` | `string` | \-  | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/http/guest-js/index.ts#L61](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/http/guest-js/index.ts#L61) |
| `basicAuth.username` | `string` | \-  | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/http/guest-js/index.ts#L60](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/http/guest-js/index.ts#L60) |
| `noProxy?` | `string` | A configuration for filtering out requests that shouldn’t be proxied. Entries are expected to be comma-separated (whitespace between entries is ignored) | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/http/guest-js/index.ts#L67](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/http/guest-js/index.ts#L67) |
| `url` | `string` | The URL of the proxy server. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/http/guest-js/index.ts#L55](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/http/guest-js/index.ts#L55) |

[Functions](https://tauri.app/reference/javascript/http/#functions)

--------------------------------------------------------------------

[Section titled “Functions”](https://tauri.app/reference/javascript/http/#functions)

### [fetch()](https://tauri.app/reference/javascript/http/#fetch)

[Section titled “fetch()”](https://tauri.app/reference/javascript/http/#fetch)

    function fetch(input, init?): Promise<Response>

Fetch a resource from the network. It returns a `Promise` that resolves to the `Response` to that `Request`, whether it is successful or not.

#### [Parameters](https://tauri.app/reference/javascript/http/#parameters)

[Section titled “Parameters”](https://tauri.app/reference/javascript/http/#parameters)

| Parameter | Type |
| --- | --- |
| `input` | `string` \| [`URL`](https://developer.mozilla.org/docs/Web/API/URL)<br> \| [`Request`](https://developer.mozilla.org/docs/Web/API/Request) |
| `init`? | `RequestInit` & [`ClientOptions`](https://tauri.app/reference/javascript/http/#clientoptions) |

#### [Returns](https://tauri.app/reference/javascript/http/#returns)

[Section titled “Returns”](https://tauri.app/reference/javascript/http/#returns)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<[`Response`](https://developer.mozilla.org/docs/Web/API/Response)
\>

#### [Example](https://tauri.app/reference/javascript/http/#example)

[Section titled “Example”](https://tauri.app/reference/javascript/http/#example)

    const response = await fetch("http://my.json.host/data.json");console.log(response.status);  // e.g. 200console.log(response.statusText); // e.g. "OK"const jsonData = await response.json();

#### [Since](https://tauri.app/reference/javascript/http/#since-3)

[Section titled “Since”](https://tauri.app/reference/javascript/http/#since-3)

2.0.0

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/http/guest-js/index.ts#L125](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/http/guest-js/index.ts#L125)

* * *

[Support on Open Collective](https://opencollective.com/tauri)
 [Sponsor on GitHub](https://github.com/sponsors/tauri-apps)

© 2026 Tauri Contributors. CC-BY / MIT

---

# @tauri-apps/plugin-positioner | Tauri

[Skip to content](https://tauri.app/reference/javascript/positioner/#_top)

@tauri-apps/plugin-positioner
=============================

[Enumerations](https://tauri.app/reference/javascript/positioner/#enumerations)

--------------------------------------------------------------------------------

[Section titled “Enumerations”](https://tauri.app/reference/javascript/positioner/#enumerations)

### [Position](https://tauri.app/reference/javascript/positioner/#position)

[Section titled “Position”](https://tauri.app/reference/javascript/positioner/#position)

Well known window positions.

#### [Enumeration Members](https://tauri.app/reference/javascript/positioner/#enumeration-members)

[Section titled “Enumeration Members”](https://tauri.app/reference/javascript/positioner/#enumeration-members)

##### [BottomCenter](https://tauri.app/reference/javascript/positioner/#bottomcenter)

[Section titled “BottomCenter”](https://tauri.app/reference/javascript/positioner/#bottomcenter)

    BottomCenter: 5;

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/positioner/guest-js/index.ts#L18](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/positioner/guest-js/index.ts#L18)

##### [BottomLeft](https://tauri.app/reference/javascript/positioner/#bottomleft)

[Section titled “BottomLeft”](https://tauri.app/reference/javascript/positioner/#bottomleft)

    BottomLeft: 2;

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/positioner/guest-js/index.ts#L15](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/positioner/guest-js/index.ts#L15)

##### [BottomRight](https://tauri.app/reference/javascript/positioner/#bottomright)

[Section titled “BottomRight”](https://tauri.app/reference/javascript/positioner/#bottomright)

    BottomRight: 3;

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/positioner/guest-js/index.ts#L16](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/positioner/guest-js/index.ts#L16)

##### [Center](https://tauri.app/reference/javascript/positioner/#center)

[Section titled “Center”](https://tauri.app/reference/javascript/positioner/#center)

    Center: 8;

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/positioner/guest-js/index.ts#L21](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/positioner/guest-js/index.ts#L21)

##### [LeftCenter](https://tauri.app/reference/javascript/positioner/#leftcenter)

[Section titled “LeftCenter”](https://tauri.app/reference/javascript/positioner/#leftcenter)

    LeftCenter: 6;

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/positioner/guest-js/index.ts#L19](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/positioner/guest-js/index.ts#L19)

##### [RightCenter](https://tauri.app/reference/javascript/positioner/#rightcenter)

[Section titled “RightCenter”](https://tauri.app/reference/javascript/positioner/#rightcenter)

    RightCenter: 7;

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/positioner/guest-js/index.ts#L20](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/positioner/guest-js/index.ts#L20)

##### [TopCenter](https://tauri.app/reference/javascript/positioner/#topcenter)

[Section titled “TopCenter”](https://tauri.app/reference/javascript/positioner/#topcenter)

    TopCenter: 4;

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/positioner/guest-js/index.ts#L17](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/positioner/guest-js/index.ts#L17)

##### [TopLeft](https://tauri.app/reference/javascript/positioner/#topleft)

[Section titled “TopLeft”](https://tauri.app/reference/javascript/positioner/#topleft)

    TopLeft: 0;

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/positioner/guest-js/index.ts#L13](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/positioner/guest-js/index.ts#L13)

##### [TopRight](https://tauri.app/reference/javascript/positioner/#topright)

[Section titled “TopRight”](https://tauri.app/reference/javascript/positioner/#topright)

    TopRight: 1;

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/positioner/guest-js/index.ts#L14](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/positioner/guest-js/index.ts#L14)

##### [TrayBottomCenter](https://tauri.app/reference/javascript/positioner/#traybottomcenter)

[Section titled “TrayBottomCenter”](https://tauri.app/reference/javascript/positioner/#traybottomcenter)

    TrayBottomCenter: 14;

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/positioner/guest-js/index.ts#L27](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/positioner/guest-js/index.ts#L27)

##### [TrayBottomLeft](https://tauri.app/reference/javascript/positioner/#traybottomleft)

[Section titled “TrayBottomLeft”](https://tauri.app/reference/javascript/positioner/#traybottomleft)

    TrayBottomLeft: 10;

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/positioner/guest-js/index.ts#L23](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/positioner/guest-js/index.ts#L23)

##### [TrayBottomRight](https://tauri.app/reference/javascript/positioner/#traybottomright)

[Section titled “TrayBottomRight”](https://tauri.app/reference/javascript/positioner/#traybottomright)

    TrayBottomRight: 12;

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/positioner/guest-js/index.ts#L25](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/positioner/guest-js/index.ts#L25)

##### [TrayCenter](https://tauri.app/reference/javascript/positioner/#traycenter)

[Section titled “TrayCenter”](https://tauri.app/reference/javascript/positioner/#traycenter)

    TrayCenter: 13;

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/positioner/guest-js/index.ts#L26](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/positioner/guest-js/index.ts#L26)

##### [TrayLeft](https://tauri.app/reference/javascript/positioner/#trayleft)

[Section titled “TrayLeft”](https://tauri.app/reference/javascript/positioner/#trayleft)

    TrayLeft: 9;

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/positioner/guest-js/index.ts#L22](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/positioner/guest-js/index.ts#L22)

##### [TrayRight](https://tauri.app/reference/javascript/positioner/#trayright)

[Section titled “TrayRight”](https://tauri.app/reference/javascript/positioner/#trayright)

    TrayRight: 11;

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/positioner/guest-js/index.ts#L24](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/positioner/guest-js/index.ts#L24)

[Functions](https://tauri.app/reference/javascript/positioner/#functions)

--------------------------------------------------------------------------

[Section titled “Functions”](https://tauri.app/reference/javascript/positioner/#functions)

### [handleIconState()](https://tauri.app/reference/javascript/positioner/#handleiconstate)

[Section titled “handleIconState()”](https://tauri.app/reference/javascript/positioner/#handleiconstate)

    function handleIconState(event): Promise<void>

#### [Parameters](https://tauri.app/reference/javascript/positioner/#parameters)

[Section titled “Parameters”](https://tauri.app/reference/javascript/positioner/#parameters)

| Parameter | Type |
| --- | --- |
| `event` | `TrayIconEvent` |

#### [Returns](https://tauri.app/reference/javascript/positioner/#returns)

[Section titled “Returns”](https://tauri.app/reference/javascript/positioner/#returns)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`void`\>

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/positioner/guest-js/index.ts#L55](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/positioner/guest-js/index.ts#L55)

* * *

### [moveWindow()](https://tauri.app/reference/javascript/positioner/#movewindow)

[Section titled “moveWindow()”](https://tauri.app/reference/javascript/positioner/#movewindow)

    function moveWindow(to): Promise<void>

Moves the `Window` to the given [Position](https://tauri.app/reference/javascript/positioner/#position)
 using `WindowExt.move_window()` All positions are relative to the **current** screen.

#### [Parameters](https://tauri.app/reference/javascript/positioner/#parameters-1)

[Section titled “Parameters”](https://tauri.app/reference/javascript/positioner/#parameters-1)

| Parameter | Type | Description |
| --- | --- | --- |
| `to` | [`Position`](https://tauri.app/reference/javascript/positioner/#position) | The [Position](https://tauri.app/reference/javascript/positioner/#position)<br> to move to. |

#### [Returns](https://tauri.app/reference/javascript/positioner/#returns-1)

[Section titled “Returns”](https://tauri.app/reference/javascript/positioner/#returns-1)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`void`\>

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/positioner/guest-js/index.ts#L36](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/positioner/guest-js/index.ts#L36)

* * *

### [moveWindowConstrained()](https://tauri.app/reference/javascript/positioner/#movewindowconstrained)

[Section titled “moveWindowConstrained()”](https://tauri.app/reference/javascript/positioner/#movewindowconstrained)

    function moveWindowConstrained(to): Promise<void>

Moves the `Window` to the given [Position](https://tauri.app/reference/javascript/positioner/#position)
 using `WindowExt.move_window_constrained()`

This move operation constrains the window to the screen dimensions in case of tray-icon positions.

#### [Parameters](https://tauri.app/reference/javascript/positioner/#parameters-2)

[Section titled “Parameters”](https://tauri.app/reference/javascript/positioner/#parameters-2)

| Parameter | Type | Description |
| --- | --- | --- |
| `to` | [`Position`](https://tauri.app/reference/javascript/positioner/#position) | The (tray) [Position](https://tauri.app/reference/javascript/positioner/#position)<br> to move to. |

#### [Returns](https://tauri.app/reference/javascript/positioner/#returns-2)

[Section titled “Returns”](https://tauri.app/reference/javascript/positioner/#returns-2)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`void`\>

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/positioner/guest-js/index.ts#L49](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/positioner/guest-js/index.ts#L49)

* * *

[Support on Open Collective](https://opencollective.com/tauri)
 [Sponsor on GitHub](https://github.com/sponsors/tauri-apps)

© 2026 Tauri Contributors. CC-BY / MIT

---

# @tauri-apps/plugin-nfc | Tauri

[Skip to content](https://tauri.app/reference/javascript/nfc/#_top)

@tauri-apps/plugin-nfc
======================

[Enumerations](https://tauri.app/reference/javascript/nfc/#enumerations)

-------------------------------------------------------------------------

[Section titled “Enumerations”](https://tauri.app/reference/javascript/nfc/#enumerations)

### [NFCTypeNameFormat](https://tauri.app/reference/javascript/nfc/#nfctypenameformat)

[Section titled “NFCTypeNameFormat”](https://tauri.app/reference/javascript/nfc/#nfctypenameformat)

#### [Enumeration Members](https://tauri.app/reference/javascript/nfc/#enumeration-members)

[Section titled “Enumeration Members”](https://tauri.app/reference/javascript/nfc/#enumeration-members)

##### [AbsoluteURI](https://tauri.app/reference/javascript/nfc/#absoluteuri)

[Section titled “AbsoluteURI”](https://tauri.app/reference/javascript/nfc/#absoluteuri)

    AbsoluteURI: 3;

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/nfc/guest-js/index.ts#L84](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/nfc/guest-js/index.ts#L84)

##### [Empty](https://tauri.app/reference/javascript/nfc/#empty)

[Section titled “Empty”](https://tauri.app/reference/javascript/nfc/#empty)

    Empty: 0;

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/nfc/guest-js/index.ts#L81](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/nfc/guest-js/index.ts#L81)

##### [Media](https://tauri.app/reference/javascript/nfc/#media)

[Section titled “Media”](https://tauri.app/reference/javascript/nfc/#media)

    Media: 2;

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/nfc/guest-js/index.ts#L83](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/nfc/guest-js/index.ts#L83)

##### [NfcExternal](https://tauri.app/reference/javascript/nfc/#nfcexternal)

[Section titled “NfcExternal”](https://tauri.app/reference/javascript/nfc/#nfcexternal)

    NfcExternal: 4;

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/nfc/guest-js/index.ts#L85](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/nfc/guest-js/index.ts#L85)

##### [NfcWellKnown](https://tauri.app/reference/javascript/nfc/#nfcwellknown)

[Section titled “NfcWellKnown”](https://tauri.app/reference/javascript/nfc/#nfcwellknown)

    NfcWellKnown: 1;

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/nfc/guest-js/index.ts#L82](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/nfc/guest-js/index.ts#L82)

##### [Unchanged](https://tauri.app/reference/javascript/nfc/#unchanged)

[Section titled “Unchanged”](https://tauri.app/reference/javascript/nfc/#unchanged)

    Unchanged: 6;

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/nfc/guest-js/index.ts#L87](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/nfc/guest-js/index.ts#L87)

##### [Unknown](https://tauri.app/reference/javascript/nfc/#unknown)

[Section titled “Unknown”](https://tauri.app/reference/javascript/nfc/#unknown)

    Unknown: 5;

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/nfc/guest-js/index.ts#L86](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/nfc/guest-js/index.ts#L86)

* * *

### [TechKind](https://tauri.app/reference/javascript/nfc/#techkind)

[Section titled “TechKind”](https://tauri.app/reference/javascript/nfc/#techkind)

#### [Enumeration Members](https://tauri.app/reference/javascript/nfc/#enumeration-members-1)

[Section titled “Enumeration Members”](https://tauri.app/reference/javascript/nfc/#enumeration-members-1)

##### [IsoDep](https://tauri.app/reference/javascript/nfc/#isodep)

[Section titled “IsoDep”](https://tauri.app/reference/javascript/nfc/#isodep)

    IsoDep: 0;

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/nfc/guest-js/index.ts#L17](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/nfc/guest-js/index.ts#L17)

##### [MifareClassic](https://tauri.app/reference/javascript/nfc/#mifareclassic)

[Section titled “MifareClassic”](https://tauri.app/reference/javascript/nfc/#mifareclassic)

    MifareClassic: 1;

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/nfc/guest-js/index.ts#L18](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/nfc/guest-js/index.ts#L18)

##### [MifareUltralight](https://tauri.app/reference/javascript/nfc/#mifareultralight)

[Section titled “MifareUltralight”](https://tauri.app/reference/javascript/nfc/#mifareultralight)

    MifareUltralight: 2;

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/nfc/guest-js/index.ts#L19](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/nfc/guest-js/index.ts#L19)

##### [Ndef](https://tauri.app/reference/javascript/nfc/#ndef)

[Section titled “Ndef”](https://tauri.app/reference/javascript/nfc/#ndef)

    Ndef: 3;

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/nfc/guest-js/index.ts#L20](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/nfc/guest-js/index.ts#L20)

##### [NdefFormatable](https://tauri.app/reference/javascript/nfc/#ndefformatable)

[Section titled “NdefFormatable”](https://tauri.app/reference/javascript/nfc/#ndefformatable)

    NdefFormatable: 4;

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/nfc/guest-js/index.ts#L21](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/nfc/guest-js/index.ts#L21)

##### [NfcA](https://tauri.app/reference/javascript/nfc/#nfca)

[Section titled “NfcA”](https://tauri.app/reference/javascript/nfc/#nfca)

    NfcA: 5;

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/nfc/guest-js/index.ts#L22](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/nfc/guest-js/index.ts#L22)

##### [NfcB](https://tauri.app/reference/javascript/nfc/#nfcb)

[Section titled “NfcB”](https://tauri.app/reference/javascript/nfc/#nfcb)

    NfcB: 6;

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/nfc/guest-js/index.ts#L23](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/nfc/guest-js/index.ts#L23)

##### [NfcBarcode](https://tauri.app/reference/javascript/nfc/#nfcbarcode)

[Section titled “NfcBarcode”](https://tauri.app/reference/javascript/nfc/#nfcbarcode)

    NfcBarcode: 7;

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/nfc/guest-js/index.ts#L24](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/nfc/guest-js/index.ts#L24)

##### [NfcF](https://tauri.app/reference/javascript/nfc/#nfcf)

[Section titled “NfcF”](https://tauri.app/reference/javascript/nfc/#nfcf)

    NfcF: 8;

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/nfc/guest-js/index.ts#L25](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/nfc/guest-js/index.ts#L25)

##### [NfcV](https://tauri.app/reference/javascript/nfc/#nfcv)

[Section titled “NfcV”](https://tauri.app/reference/javascript/nfc/#nfcv)

    NfcV: 9;

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/nfc/guest-js/index.ts#L26](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/nfc/guest-js/index.ts#L26)

[Interfaces](https://tauri.app/reference/javascript/nfc/#interfaces)

---------------------------------------------------------------------

[Section titled “Interfaces”](https://tauri.app/reference/javascript/nfc/#interfaces)

### [NFCRecord](https://tauri.app/reference/javascript/nfc/#nfcrecord)

[Section titled “NFCRecord”](https://tauri.app/reference/javascript/nfc/#nfcrecord)

#### [Properties](https://tauri.app/reference/javascript/nfc/#properties)

[Section titled “Properties”](https://tauri.app/reference/javascript/nfc/#properties)

| Property | Type | Defined in |
| --- | --- | --- |
| `format` | [`NFCTypeNameFormat`](https://tauri.app/reference/javascript/nfc/#nfctypenameformat) | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/nfc/guest-js/index.ts#L104](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/nfc/guest-js/index.ts#L104) |
| `id` | `number`\[\] | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/nfc/guest-js/index.ts#L106](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/nfc/guest-js/index.ts#L106) |
| `kind` | `number`\[\] | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/nfc/guest-js/index.ts#L105](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/nfc/guest-js/index.ts#L105) |
| `payload` | `number`\[\] | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/nfc/guest-js/index.ts#L107](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/nfc/guest-js/index.ts#L107) |

* * *

### [ScanOptions](https://tauri.app/reference/javascript/nfc/#scanoptions)

[Section titled “ScanOptions”](https://tauri.app/reference/javascript/nfc/#scanoptions)

#### [Properties](https://tauri.app/reference/javascript/nfc/#properties-1)

[Section titled “Properties”](https://tauri.app/reference/javascript/nfc/#properties-1)

| Property | Type | Description | Defined in |
| --- | --- | --- | --- |
| `keepSessionAlive?` | `boolean` | \-  | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/nfc/guest-js/index.ts#L63](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/nfc/guest-js/index.ts#L63) |
| `message?` | `string` | Message displayed in the UI. iOS only. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/nfc/guest-js/index.ts#L65](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/nfc/guest-js/index.ts#L65) |
| `successMessage?` | `string` | Message displayed in the UI when the message has been read. iOS only. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/nfc/guest-js/index.ts#L67](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/nfc/guest-js/index.ts#L67) |

* * *

### [Tag](https://tauri.app/reference/javascript/nfc/#tag)

[Section titled “Tag”](https://tauri.app/reference/javascript/nfc/#tag)

#### [Properties](https://tauri.app/reference/javascript/nfc/#properties-2)

[Section titled “Properties”](https://tauri.app/reference/javascript/nfc/#properties-2)

| Property | Type | Defined in |
| --- | --- | --- |
| `id` | `number`\[\] | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/nfc/guest-js/index.ts#L98](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/nfc/guest-js/index.ts#L98) |
| `kind` | `string`\[\] | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/nfc/guest-js/index.ts#L99](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/nfc/guest-js/index.ts#L99) |
| `records` | [`TagRecord`](https://tauri.app/reference/javascript/nfc/#tagrecord)<br>\[\] | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/nfc/guest-js/index.ts#L100](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/nfc/guest-js/index.ts#L100) |

* * *

### [TagRecord](https://tauri.app/reference/javascript/nfc/#tagrecord)

[Section titled “TagRecord”](https://tauri.app/reference/javascript/nfc/#tagrecord)

#### [Properties](https://tauri.app/reference/javascript/nfc/#properties-3)

[Section titled “Properties”](https://tauri.app/reference/javascript/nfc/#properties-3)

| Property | Type | Defined in |
| --- | --- | --- |
| `id` | `number`\[\] | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/nfc/guest-js/index.ts#L93](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/nfc/guest-js/index.ts#L93) |
| `kind` | `number`\[\] | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/nfc/guest-js/index.ts#L92](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/nfc/guest-js/index.ts#L92) |
| `payload` | `number`\[\] | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/nfc/guest-js/index.ts#L94](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/nfc/guest-js/index.ts#L94) |
| `tnf` | [`NFCTypeNameFormat`](https://tauri.app/reference/javascript/nfc/#nfctypenameformat) | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/nfc/guest-js/index.ts#L91](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/nfc/guest-js/index.ts#L91) |

* * *

### [UriFilter](https://tauri.app/reference/javascript/nfc/#urifilter)

[Section titled “UriFilter”](https://tauri.app/reference/javascript/nfc/#urifilter)

#### [Properties](https://tauri.app/reference/javascript/nfc/#properties-4)

[Section titled “Properties”](https://tauri.app/reference/javascript/nfc/#properties-4)

| Property | Type | Defined in |
| --- | --- | --- |
| `host?` | `string` | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/nfc/guest-js/index.ts#L12](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/nfc/guest-js/index.ts#L12) |
| `pathPrefix?` | `string` | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/nfc/guest-js/index.ts#L13](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/nfc/guest-js/index.ts#L13) |
| `scheme?` | `string` | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/nfc/guest-js/index.ts#L11](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/nfc/guest-js/index.ts#L11) |

* * *

### [WriteOptions](https://tauri.app/reference/javascript/nfc/#writeoptions)

[Section titled “WriteOptions”](https://tauri.app/reference/javascript/nfc/#writeoptions)

#### [Properties](https://tauri.app/reference/javascript/nfc/#properties-5)

[Section titled “Properties”](https://tauri.app/reference/javascript/nfc/#properties-5)

| Property | Type | Description | Defined in |
| --- | --- | --- | --- |
| `kind?` | [`ScanKind`](https://tauri.app/reference/javascript/nfc/#scankind) | \-  | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/nfc/guest-js/index.ts#L71](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/nfc/guest-js/index.ts#L71) |
| `message?` | `string` | Message displayed in the UI when reading the tag. iOS only. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/nfc/guest-js/index.ts#L73](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/nfc/guest-js/index.ts#L73) |
| `successMessage?` | `string` | Message displayed in the UI when the message has been written. iOS only. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/nfc/guest-js/index.ts#L77](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/nfc/guest-js/index.ts#L77) |
| `successfulReadMessage?` | `string` | Message displayed in the UI when the tag has been read. iOS only. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/nfc/guest-js/index.ts#L75](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/nfc/guest-js/index.ts#L75) |

[Type Aliases](https://tauri.app/reference/javascript/nfc/#type-aliases)

-------------------------------------------------------------------------

[Section titled “Type Aliases”](https://tauri.app/reference/javascript/nfc/#type-aliases)

### [ScanKind](https://tauri.app/reference/javascript/nfc/#scankind)

[Section titled “ScanKind”](https://tauri.app/reference/javascript/nfc/#scankind)

    type ScanKind: object | object;

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/nfc/guest-js/index.ts#L29](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/nfc/guest-js/index.ts#L29)

[Variables](https://tauri.app/reference/javascript/nfc/#variables)

-------------------------------------------------------------------

[Section titled “Variables”](https://tauri.app/reference/javascript/nfc/#variables)

### [RTD\_TEXT](https://tauri.app/reference/javascript/nfc/#rtd_text)

[Section titled “RTD\_TEXT”](https://tauri.app/reference/javascript/nfc/#rtd_text)

    const RTD_TEXT: number[];

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/nfc/guest-js/index.ts#L7](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/nfc/guest-js/index.ts#L7)

* * *

### [RTD\_URI](https://tauri.app/reference/javascript/nfc/#rtd_uri)

[Section titled “RTD\_URI”](https://tauri.app/reference/javascript/nfc/#rtd_uri)

    const RTD_URI: number[];

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/nfc/guest-js/index.ts#L8](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/nfc/guest-js/index.ts#L8)

[Functions](https://tauri.app/reference/javascript/nfc/#functions)

-------------------------------------------------------------------

[Section titled “Functions”](https://tauri.app/reference/javascript/nfc/#functions)

### [isAvailable()](https://tauri.app/reference/javascript/nfc/#isavailable)

[Section titled “isAvailable()”](https://tauri.app/reference/javascript/nfc/#isavailable)

    function isAvailable(): Promise<boolean>

#### [Returns](https://tauri.app/reference/javascript/nfc/#returns)

[Section titled “Returns”](https://tauri.app/reference/javascript/nfc/#returns)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`boolean`\>

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/nfc/guest-js/index.ts#L271](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/nfc/guest-js/index.ts#L271)

* * *

### [record()](https://tauri.app/reference/javascript/nfc/#record)

[Section titled “record()”](https://tauri.app/reference/javascript/nfc/#record)

    function record(   format,   kind,   id,   payload): NFCRecord

#### [Parameters](https://tauri.app/reference/javascript/nfc/#parameters)

[Section titled “Parameters”](https://tauri.app/reference/javascript/nfc/#parameters)

| Parameter | Type |
| --- | --- |
| `format` | [`NFCTypeNameFormat`](https://tauri.app/reference/javascript/nfc/#nfctypenameformat) |
| `kind` | `string` \| `number`\[\] |
| `id` | `string` \| `number`\[\] |
| `payload` | `string` \| `number`\[\] |

#### [Returns](https://tauri.app/reference/javascript/nfc/#returns-1)

[Section titled “Returns”](https://tauri.app/reference/javascript/nfc/#returns-1)

[`NFCRecord`](https://tauri.app/reference/javascript/nfc/#nfcrecord)

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/nfc/guest-js/index.ts#L110](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/nfc/guest-js/index.ts#L110)

* * *

### [scan()](https://tauri.app/reference/javascript/nfc/#scan)

[Section titled “scan()”](https://tauri.app/reference/javascript/nfc/#scan)

    function scan(kind, options?): Promise<Tag>

Scans an NFC tag.

    import { scan } from "@tauri-apps/plugin-nfc";await scan({ type: "tag" });

See [https://developer.android.com/develop/connectivity/nfc/nfc#ndef](https://developer.android.com/develop/connectivity/nfc/nfc#ndef)
 for more information.

#### [Parameters](https://tauri.app/reference/javascript/nfc/#parameters-1)

[Section titled “Parameters”](https://tauri.app/reference/javascript/nfc/#parameters-1)

| Parameter | Type | Description |
| --- | --- | --- |
| `kind` | [`ScanKind`](https://tauri.app/reference/javascript/nfc/#scankind) |     |
| `options`? | [`ScanOptions`](https://tauri.app/reference/javascript/nfc/#scanoptions) |     |

#### [Returns](https://tauri.app/reference/javascript/nfc/#returns-2)

[Section titled “Returns”](https://tauri.app/reference/javascript/nfc/#returns-2)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<[`Tag`](https://tauri.app/reference/javascript/nfc/#tag)
\>

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/nfc/guest-js/index.ts#L231](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/nfc/guest-js/index.ts#L231)

* * *

### [textRecord()](https://tauri.app/reference/javascript/nfc/#textrecord)

[Section titled “textRecord()”](https://tauri.app/reference/javascript/nfc/#textrecord)

    function textRecord(   text,   id?,   language?): NFCRecord

#### [Parameters](https://tauri.app/reference/javascript/nfc/#parameters-2)

[Section titled “Parameters”](https://tauri.app/reference/javascript/nfc/#parameters-2)

| Parameter | Type | Default value |
| --- | --- | --- |
| `text` | `string` | `undefined` |
| `id`? | `string` \| `number`\[\] | `undefined` |
| `language`? | `string` | `'en'` |

#### [Returns](https://tauri.app/reference/javascript/nfc/#returns-3)

[Section titled “Returns”](https://tauri.app/reference/javascript/nfc/#returns-3)

[`NFCRecord`](https://tauri.app/reference/javascript/nfc/#nfcrecord)

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/nfc/guest-js/index.ts#L130](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/nfc/guest-js/index.ts#L130)

* * *

### [uriRecord()](https://tauri.app/reference/javascript/nfc/#urirecord)

[Section titled “uriRecord()”](https://tauri.app/reference/javascript/nfc/#urirecord)

    function uriRecord(uri, id?): NFCRecord

#### [Parameters](https://tauri.app/reference/javascript/nfc/#parameters-3)

[Section titled “Parameters”](https://tauri.app/reference/javascript/nfc/#parameters-3)

| Parameter | Type |
| --- | --- |
| `uri` | `string` |
| `id`? | `string` \| `number`\[\] |

#### [Returns](https://tauri.app/reference/javascript/nfc/#returns-4)

[Section titled “Returns”](https://tauri.app/reference/javascript/nfc/#returns-4)

[`NFCRecord`](https://tauri.app/reference/javascript/nfc/#nfcrecord)

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/nfc/guest-js/index.ts#L203](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/nfc/guest-js/index.ts#L203)

* * *

### [write()](https://tauri.app/reference/javascript/nfc/#write)

[Section titled “write()”](https://tauri.app/reference/javascript/nfc/#write)

    function write(records, options?): Promise<void>

Write to an NFC tag.

    import { uriRecord, write } from "@tauri-apps/plugin-nfc";await write([uriRecord("https://tauri.app")], { kind: { type: "ndef" } });

If you did not previously call [scan](https://tauri.app/reference/javascript/nfc/#scan)
 with [ScanOptions.keepSessionAlive](https://tauri.app/reference/javascript/nfc/#keepsessionalive)
 set to true, it will first scan the tag then write to it.

#### [Parameters](https://tauri.app/reference/javascript/nfc/#parameters-4)

[Section titled “Parameters”](https://tauri.app/reference/javascript/nfc/#parameters-4)

| Parameter | Type | Description |
| --- | --- | --- |
| `records` | [`NFCRecord`](https://tauri.app/reference/javascript/nfc/#nfcrecord)<br>\[\] |     |
| `options`? | [`WriteOptions`](https://tauri.app/reference/javascript/nfc/#writeoptions) |     |

#### [Returns](https://tauri.app/reference/javascript/nfc/#returns-5)

[Section titled “Returns”](https://tauri.app/reference/javascript/nfc/#returns-5)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`void`\>

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/nfc/guest-js/index.ts#L256](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/nfc/guest-js/index.ts#L256)

* * *

[Support on Open Collective](https://opencollective.com/tauri)
 [Sponsor on GitHub](https://github.com/sponsors/tauri-apps)

© 2026 Tauri Contributors. CC-BY / MIT

---

# @tauri-apps/plugin-opener | Tauri

[Skip to content](https://tauri.app/reference/javascript/opener/#_top)

@tauri-apps/plugin-opener
=========================

Open files and URLs using their default application.

[Security](https://tauri.app/reference/javascript/opener/#security)

--------------------------------------------------------------------

[Section titled “Security”](https://tauri.app/reference/javascript/opener/#security)

This API has a scope configuration that forces you to restrict the files and urls to be opened.

### [Restricting access to the open | `open` API](https://tauri.app/reference/javascript/opener/#restricting-access-to-the-open--open-api)

[Section titled “Restricting access to the open | open API”](https://tauri.app/reference/javascript/opener/#restricting-access-to-the-open--open-api)

On the configuration object, `open: true` means that the open API can be used with any URL, as the argument is validated with the `^((mailto:\w+)|(tel:\w+)|(https?://\w+)).+` regex. You can change that regex by changing the boolean value to a string, e.g. `open: ^https://github.com/`.

[Functions](https://tauri.app/reference/javascript/opener/#functions)

----------------------------------------------------------------------

[Section titled “Functions”](https://tauri.app/reference/javascript/opener/#functions)

### [openPath()](https://tauri.app/reference/javascript/opener/#openpath)

[Section titled “openPath()”](https://tauri.app/reference/javascript/opener/#openpath)

    function openPath(path, openWith?): Promise<void>

Opens a path with the system’s default app, or the one specified with openWith.

#### [Parameters](https://tauri.app/reference/javascript/opener/#parameters)

[Section titled “Parameters”](https://tauri.app/reference/javascript/opener/#parameters)

| Parameter | Type | Description |
| --- | --- | --- |
| `path` | `string` | The path to open. |
| `openWith`? | `string` | The app to open the path with. If not specified, defaults to the system default application for the specified path type. |

#### [Returns](https://tauri.app/reference/javascript/opener/#returns)

[Section titled “Returns”](https://tauri.app/reference/javascript/opener/#returns)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`void`\>

#### [Example](https://tauri.app/reference/javascript/opener/#example)

[Section titled “Example”](https://tauri.app/reference/javascript/opener/#example)

    import { openPath } from '@tauri-apps/plugin-opener';
    // opens a file using the default program:await openPath('/path/to/file');// opens a file using `vlc` command on Windows.await openPath('C:/path/to/file', 'vlc');

#### [Since](https://tauri.app/reference/javascript/opener/#since)

[Section titled “Since”](https://tauri.app/reference/javascript/opener/#since)

2.0.0

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/opener/guest-js/index.ts#L71](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/opener/guest-js/index.ts#L71)

* * *

### [openUrl()](https://tauri.app/reference/javascript/opener/#openurl)

[Section titled “openUrl()”](https://tauri.app/reference/javascript/opener/#openurl)

    function openUrl(url, openWith?): Promise<void>

Opens a url with the system’s default app, or the one specified with openWith.

#### [Parameters](https://tauri.app/reference/javascript/opener/#parameters-1)

[Section titled “Parameters”](https://tauri.app/reference/javascript/opener/#parameters-1)

| Parameter | Type | Description |
| --- | --- | --- |
| `url` | `string` \| [`URL`](https://developer.mozilla.org/docs/Web/API/URL) | The URL to open. |
| `openWith`? | `string` | The app to open the URL with. If not specified, defaults to the system default application for the specified url type. On mobile, `openWith` can be provided as `inAppBrowser` to open the URL in an in-app browser. Otherwise, it will open the URL in the system default browser. |

#### [Returns](https://tauri.app/reference/javascript/opener/#returns-1)

[Section titled “Returns”](https://tauri.app/reference/javascript/opener/#returns-1)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`void`\>

#### [Example](https://tauri.app/reference/javascript/opener/#example-1)

[Section titled “Example”](https://tauri.app/reference/javascript/opener/#example-1)

    import { openUrl } from '@tauri-apps/plugin-opener';
    // opens the given URL on the default browser:await openUrl('https://github.com/tauri-apps/tauri');// opens the given URL using `firefox`:await openUrl('https://github.com/tauri-apps/tauri', 'firefox');

#### [Since](https://tauri.app/reference/javascript/opener/#since-1)

[Section titled “Since”](https://tauri.app/reference/javascript/opener/#since-1)

2.0.0

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/opener/guest-js/index.ts#L42](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/opener/guest-js/index.ts#L42)

* * *

### [revealItemInDir()](https://tauri.app/reference/javascript/opener/#revealitemindir)

[Section titled “revealItemInDir()”](https://tauri.app/reference/javascript/opener/#revealitemindir)

    function revealItemInDir(path): Promise<void>

Reveal a path with the system’s default explorer.

Platform-specific:

*   **Android / iOS:** Unsupported.

#### [Parameters](https://tauri.app/reference/javascript/opener/#parameters-2)

[Section titled “Parameters”](https://tauri.app/reference/javascript/opener/#parameters-2)

| Parameter | Type | Description |
| --- | --- | --- |
| `path` | `string` \| `string`\[\] | The path to reveal. |

#### [Returns](https://tauri.app/reference/javascript/opener/#returns-2)

[Section titled “Returns”](https://tauri.app/reference/javascript/opener/#returns-2)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`void`\>

#### [Example](https://tauri.app/reference/javascript/opener/#example-2)

[Section titled “Example”](https://tauri.app/reference/javascript/opener/#example-2)

    import { revealItemInDir } from '@tauri-apps/plugin-opener';await revealItemInDir('/path/to/file');await revealItemInDir([ '/path/to/file', '/path/to/another/file' ]);

#### [Since](https://tauri.app/reference/javascript/opener/#since-2)

[Section titled “Since”](https://tauri.app/reference/javascript/opener/#since-2)

2.0.0

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/opener/guest-js/index.ts#L96](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/opener/guest-js/index.ts#L96)

* * *

[Support on Open Collective](https://opencollective.com/tauri)
 [Sponsor on GitHub](https://github.com/sponsors/tauri-apps)

© 2026 Tauri Contributors. CC-BY / MIT

---

# @tauri-apps/plugin-upload | Tauri

[Skip to content](https://tauri.app/reference/javascript/upload/#_top)

@tauri-apps/plugin-upload
=========================

[Enumerations](https://tauri.app/reference/javascript/upload/#enumerations)

----------------------------------------------------------------------------

[Section titled “Enumerations”](https://tauri.app/reference/javascript/upload/#enumerations)

### [HttpMethod](https://tauri.app/reference/javascript/upload/#httpmethod)

[Section titled “HttpMethod”](https://tauri.app/reference/javascript/upload/#httpmethod)

#### [Enumeration Members](https://tauri.app/reference/javascript/upload/#enumeration-members)

[Section titled “Enumeration Members”](https://tauri.app/reference/javascript/upload/#enumeration-members)

##### [Patch](https://tauri.app/reference/javascript/upload/#patch)

[Section titled “Patch”](https://tauri.app/reference/javascript/upload/#patch)

    Patch: "PATCH";

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/upload/guest-js/index.ts#L19](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/upload/guest-js/index.ts#L19)

##### [Post](https://tauri.app/reference/javascript/upload/#post)

[Section titled “Post”](https://tauri.app/reference/javascript/upload/#post)

    Post: "POST";

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/upload/guest-js/index.ts#L17](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/upload/guest-js/index.ts#L17)

##### [Put](https://tauri.app/reference/javascript/upload/#put)

[Section titled “Put”](https://tauri.app/reference/javascript/upload/#put)

    Put: "PUT";

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/upload/guest-js/index.ts#L18](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/upload/guest-js/index.ts#L18)

[Functions](https://tauri.app/reference/javascript/upload/#functions)

----------------------------------------------------------------------

[Section titled “Functions”](https://tauri.app/reference/javascript/upload/#functions)

### [download()](https://tauri.app/reference/javascript/upload/#download)

[Section titled “download()”](https://tauri.app/reference/javascript/upload/#download)

    function download(   url,   filePath,   progressHandler?,   headers?,body?): Promise<void>

#### [Parameters](https://tauri.app/reference/javascript/upload/#parameters)

[Section titled “Parameters”](https://tauri.app/reference/javascript/upload/#parameters)

| Parameter | Type |
| --- | --- |
| `url` | `string` |
| `filePath` | `string` |
| `progressHandler`? | `ProgressHandler` |
| `headers`? | [`Map`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Map)<br><`string`, `string`\> |
| `body`? | `string` |

#### [Returns](https://tauri.app/reference/javascript/upload/#returns)

[Section titled “Returns”](https://tauri.app/reference/javascript/upload/#returns)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`void`\>

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/upload/guest-js/index.ts#L53](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/upload/guest-js/index.ts#L53)

* * *

### [upload()](https://tauri.app/reference/javascript/upload/#upload)

[Section titled “upload()”](https://tauri.app/reference/javascript/upload/#upload)

    function upload(   url,   filePath,   progressHandler?,   headers?,method?): Promise<string>

#### [Parameters](https://tauri.app/reference/javascript/upload/#parameters-1)

[Section titled “Parameters”](https://tauri.app/reference/javascript/upload/#parameters-1)

| Parameter | Type |
| --- | --- |
| `url` | `string` |
| `filePath` | `string` |
| `progressHandler`? | `ProgressHandler` |
| `headers`? | [`Map`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Map)<br><`string`, `string`\> |
| `method`? | [`HttpMethod`](https://tauri.app/reference/javascript/upload/#httpmethod) |

#### [Returns](https://tauri.app/reference/javascript/upload/#returns-1)

[Section titled “Returns”](https://tauri.app/reference/javascript/upload/#returns-1)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`string`\>

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/upload/guest-js/index.ts#L22](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/upload/guest-js/index.ts#L22)

* * *

[Support on Open Collective](https://opencollective.com/tauri)
 [Sponsor on GitHub](https://github.com/sponsors/tauri-apps)

© 2026 Tauri Contributors. CC-BY / MIT

---

# @tauri-apps/plugin-dialog | Tauri

[Skip to content](https://tauri.app/reference/javascript/dialog/#_top)

@tauri-apps/plugin-dialog
=========================

[Interfaces](https://tauri.app/reference/javascript/dialog/#interfaces)

------------------------------------------------------------------------

[Section titled “Interfaces”](https://tauri.app/reference/javascript/dialog/#interfaces)

### [ConfirmDialogOptions](https://tauri.app/reference/javascript/dialog/#confirmdialogoptions)

[Section titled “ConfirmDialogOptions”](https://tauri.app/reference/javascript/dialog/#confirmdialogoptions)

#### [Properties](https://tauri.app/reference/javascript/dialog/#properties)

[Section titled “Properties”](https://tauri.app/reference/javascript/dialog/#properties)

| Property | Type | Description | Defined in |
| --- | --- | --- | --- |
| `cancelLabel?` | `string` | The label of the cancel button. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/dialog/guest-js/index.ts#L258](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/dialog/guest-js/index.ts#L258) |
| `kind?` | `"info"` \| `"warning"` \| `"error"` | The kind of the dialog. Defaults to `info`. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/dialog/guest-js/index.ts#L254](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/dialog/guest-js/index.ts#L254) |
| `okLabel?` | `string` | The label of the confirm button. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/dialog/guest-js/index.ts#L256](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/dialog/guest-js/index.ts#L256) |
| `title?` | `string` | The title of the dialog. Defaults to the app name. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/dialog/guest-js/index.ts#L252](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/dialog/guest-js/index.ts#L252) |

* * *

### [DialogFilter](https://tauri.app/reference/javascript/dialog/#dialogfilter)

[Section titled “DialogFilter”](https://tauri.app/reference/javascript/dialog/#dialogfilter)

Extension filters for the file dialog.

#### [Since](https://tauri.app/reference/javascript/dialog/#since)

[Section titled “Since”](https://tauri.app/reference/javascript/dialog/#since)

2.0.0

#### [Properties](https://tauri.app/reference/javascript/dialog/#properties-1)

[Section titled “Properties”](https://tauri.app/reference/javascript/dialog/#properties-1)

| Property | Type | Description | Defined in |
| --- | --- | --- | --- |
| `extensions` | `string`\[\] | Extensions to filter, without a `.` prefix. **Note:** Mobile platforms have different APIs for filtering that may not support extensions. iOS: Extensions are supported in the document picker, but not in the media picker. Android: Extensions are not supported. For these platforms, MIME types are the primary way to filter files, as opposed to extensions. This means the string values here labeled as `extensions` may also be a MIME type. This property name of `extensions` is being kept for backwards compatibility, but this may be revisited to specify the difference between extension or MIME type filtering. **Example** `extensions: ['svg', 'png']` | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/dialog/guest-js/index.ts#L32](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/dialog/guest-js/index.ts#L32) |
| `name` | `string` | Filter name. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/dialog/guest-js/index.ts#L14](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/dialog/guest-js/index.ts#L14) |

* * *

### [MessageDialogOptions](https://tauri.app/reference/javascript/dialog/#messagedialogoptions)

[Section titled “MessageDialogOptions”](https://tauri.app/reference/javascript/dialog/#messagedialogoptions)

#### [Since](https://tauri.app/reference/javascript/dialog/#since-1)

[Section titled “Since”](https://tauri.app/reference/javascript/dialog/#since-1)

2.0.0

#### [Properties](https://tauri.app/reference/javascript/dialog/#properties-2)

[Section titled “Properties”](https://tauri.app/reference/javascript/dialog/#properties-2)

| Property | Type | Description | Defined in |
| --- | --- | --- | --- |
| `buttons?` | [`MessageDialogButtons`](https://tauri.app/reference/javascript/dialog/#messagedialogbuttons) | The buttons of the dialog. **Example** `// Use system default buttons texts await message('Hello World!', { buttons: 'Ok' }) await message('Hello World!', { buttons: 'OkCancel' }) // Or with custom button texts await message('Hello World!', { buttons: { ok: 'Yes!' } }) await message('Take on the task?', { buttons: { ok: 'Accept', cancel: 'Cancel' } }) await message('Show the file content?', { buttons: { yes: 'Show content', no: 'Show in folder', cancel: 'Cancel' } })` **Since** 2.4.0 | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/dialog/guest-js/index.ts#L224](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/dialog/guest-js/index.ts#L224) |
| `kind?` | `"info"` \| `"warning"` \| `"error"` | The kind of the dialog. Defaults to `info`. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/dialog/guest-js/index.ts#L195](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/dialog/guest-js/index.ts#L195) |
| ~`okLabel?`~ | `string` | The label of the Ok button. **Deprecated** Use [`MessageDialogOptions.buttons`](https://tauri.app/reference/javascript/dialog/#buttons)<br> instead. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/dialog/guest-js/index.ts#L201](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/dialog/guest-js/index.ts#L201) |
| `title?` | `string` | The title of the dialog. Defaults to the app name. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/dialog/guest-js/index.ts#L193](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/dialog/guest-js/index.ts#L193) |

* * *

### [OpenDialogOptions](https://tauri.app/reference/javascript/dialog/#opendialogoptions)

[Section titled “OpenDialogOptions”](https://tauri.app/reference/javascript/dialog/#opendialogoptions)

Options for the open dialog.

#### [Since](https://tauri.app/reference/javascript/dialog/#since-2)

[Section titled “Since”](https://tauri.app/reference/javascript/dialog/#since-2)

2.0.0

#### [Properties](https://tauri.app/reference/javascript/dialog/#properties-3)

[Section titled “Properties”](https://tauri.app/reference/javascript/dialog/#properties-3)

| Property | Type | Description | Defined in |
| --- | --- | --- | --- |
| `canCreateDirectories?` | `boolean` | Whether to allow creating directories in the dialog. Enabled by default. **macOS Only** | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/dialog/guest-js/index.ts#L71](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/dialog/guest-js/index.ts#L71) |
| `defaultPath?` | `string` | Initial directory or file path. If it’s a directory path, the dialog interface will change to that folder. If it’s not an existing directory, the file name will be set to the dialog’s file name input and the dialog will be set to the parent folder. On mobile the file name is always used on the dialog’s file name input. If not provided, Android uses `(invalid).txt` as default file name. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/dialog/guest-js/index.ts#L60](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/dialog/guest-js/index.ts#L60) |
| `directory?` | `boolean` | Whether the dialog is a directory selection or not. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/dialog/guest-js/index.ts#L64](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/dialog/guest-js/index.ts#L64) |
| `filters?` | [`DialogFilter`](https://tauri.app/reference/javascript/dialog/#dialogfilter)<br>\[\] | The filters of the dialog. On mobile platforms, if either: A) the [`pickerMode`](https://tauri.app/reference/javascript/dialog/#pickermode)<br> is set to `media`, `image`, or `video` — or — B) the filters include **only** either image or video mime types, the media picker will be displayed. Otherwise, the document picker will be displayed. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/dialog/guest-js/index.ts#L51](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/dialog/guest-js/index.ts#L51) |
| `multiple?` | `boolean` | Whether the dialog allows multiple selection or not. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/dialog/guest-js/index.ts#L62](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/dialog/guest-js/index.ts#L62) |
| `pickerMode?` | [`PickerMode`](https://tauri.app/reference/javascript/dialog/#pickermode-1) | The preferred mode of the dialog. This is meant for mobile platforms (iOS and Android) which have distinct file and media pickers. If not provided, the dialog will automatically choose the best mode based on the MIME types or extensions of the [`filters`](https://tauri.app/reference/javascript/dialog/#filters)<br>. On desktop, this option is ignored. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/dialog/guest-js/index.ts#L78](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/dialog/guest-js/index.ts#L78) |
| `recursive?` | `boolean` | If `directory` is true, indicates that it will be read recursively later. Defines whether subdirectories will be allowed on the scope or not. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/dialog/guest-js/index.ts#L69](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/dialog/guest-js/index.ts#L69) |
| `title?` | `string` | The title of the dialog window (desktop only). | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/dialog/guest-js/index.ts#L42](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/dialog/guest-js/index.ts#L42) |

* * *

### [SaveDialogOptions](https://tauri.app/reference/javascript/dialog/#savedialogoptions)

[Section titled “SaveDialogOptions”](https://tauri.app/reference/javascript/dialog/#savedialogoptions)

Options for the save dialog.

#### [Since](https://tauri.app/reference/javascript/dialog/#since-3)

[Section titled “Since”](https://tauri.app/reference/javascript/dialog/#since-3)

2.0.0

#### [Properties](https://tauri.app/reference/javascript/dialog/#properties-4)

[Section titled “Properties”](https://tauri.app/reference/javascript/dialog/#properties-4)

| Property | Type | Description | Defined in |
| --- | --- | --- | --- |
| `canCreateDirectories?` | `boolean` | Whether to allow creating directories in the dialog. Enabled by default. **macOS Only** | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/dialog/guest-js/index.ts#L101](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/dialog/guest-js/index.ts#L101) |
| `defaultPath?` | `string` | Initial directory or file path. If it’s a directory path, the dialog interface will change to that folder. If it’s not an existing directory, the file name will be set to the dialog’s file name input and the dialog will be set to the parent folder. On mobile the file name is always used on the dialog’s file name input. If not provided, Android uses `(invalid).txt` as default file name. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/dialog/guest-js/index.ts#L99](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/dialog/guest-js/index.ts#L99) |
| `filters?` | [`DialogFilter`](https://tauri.app/reference/javascript/dialog/#dialogfilter)<br>\[\] | The filters of the dialog. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/dialog/guest-js/index.ts#L90](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/dialog/guest-js/index.ts#L90) |
| `title?` | `string` | The title of the dialog window (desktop only). | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/dialog/guest-js/index.ts#L88](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/dialog/guest-js/index.ts#L88) |

[Type Aliases](https://tauri.app/reference/javascript/dialog/#type-aliases)

----------------------------------------------------------------------------

[Section titled “Type Aliases”](https://tauri.app/reference/javascript/dialog/#type-aliases)

### [MessageDialogButtons](https://tauri.app/reference/javascript/dialog/#messagedialogbuttons)

[Section titled “MessageDialogButtons”](https://tauri.app/reference/javascript/dialog/#messagedialogbuttons)

    type MessageDialogButtons: MessageDialogDefaultButtons | MessageDialogCustomButtons;

The buttons of a message dialog.

#### [Since](https://tauri.app/reference/javascript/dialog/#since-4)

[Section titled “Since”](https://tauri.app/reference/javascript/dialog/#since-4)

2.4.0

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/dialog/guest-js/index.ts#L184](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/dialog/guest-js/index.ts#L184)

* * *

### [MessageDialogButtonsOk](https://tauri.app/reference/javascript/dialog/#messagedialogbuttonsok)

[Section titled “MessageDialogButtonsOk”](https://tauri.app/reference/javascript/dialog/#messagedialogbuttonsok)

    type MessageDialogButtonsOk: object & BanExcept<"ok">;

The Ok button of a message dialog.

#### [Type declaration](https://tauri.app/reference/javascript/dialog/#type-declaration)

[Section titled “Type declaration”](https://tauri.app/reference/javascript/dialog/#type-declaration)

| Name | Type | Description | Defined in |
| --- | --- | --- | --- |
| `ok` | `string` | The Ok button. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/dialog/guest-js/index.ts#L166](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/dialog/guest-js/index.ts#L166) |

#### [Since](https://tauri.app/reference/javascript/dialog/#since-5)

[Section titled “Since”](https://tauri.app/reference/javascript/dialog/#since-5)

2.4.0

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/dialog/guest-js/index.ts#L164](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/dialog/guest-js/index.ts#L164)

* * *

### [MessageDialogButtonsOkCancel](https://tauri.app/reference/javascript/dialog/#messagedialogbuttonsokcancel)

[Section titled “MessageDialogButtonsOkCancel”](https://tauri.app/reference/javascript/dialog/#messagedialogbuttonsokcancel)

    type MessageDialogButtonsOkCancel: object & BanExcept<"ok" | "cancel">;

The Ok and Cancel buttons of a message dialog.

#### [Type declaration](https://tauri.app/reference/javascript/dialog/#type-declaration-1)

[Section titled “Type declaration”](https://tauri.app/reference/javascript/dialog/#type-declaration-1)

| Name | Type | Description | Defined in |
| --- | --- | --- | --- |
| `cancel` | `string` | The Cancel button. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/dialog/guest-js/index.ts#L156](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/dialog/guest-js/index.ts#L156) |
| `ok` | `string` | The Ok button. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/dialog/guest-js/index.ts#L154](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/dialog/guest-js/index.ts#L154) |

#### [Since](https://tauri.app/reference/javascript/dialog/#since-6)

[Section titled “Since”](https://tauri.app/reference/javascript/dialog/#since-6)

2.4.0

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/dialog/guest-js/index.ts#L152](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/dialog/guest-js/index.ts#L152)

* * *

### [MessageDialogButtonsYesNoCancel](https://tauri.app/reference/javascript/dialog/#messagedialogbuttonsyesnocancel)

[Section titled “MessageDialogButtonsYesNoCancel”](https://tauri.app/reference/javascript/dialog/#messagedialogbuttonsyesnocancel)

    type MessageDialogButtonsYesNoCancel: object & BanExcept<"yes" | "no" | "cancel">;

The Yes, No and Cancel buttons of a message dialog.

#### [Type declaration](https://tauri.app/reference/javascript/dialog/#type-declaration-2)

[Section titled “Type declaration”](https://tauri.app/reference/javascript/dialog/#type-declaration-2)

| Name | Type | Description | Defined in |
| --- | --- | --- | --- |
| `cancel` | `string` | The Cancel button. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/dialog/guest-js/index.ts#L144](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/dialog/guest-js/index.ts#L144) |
| `no` | `string` | The No button. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/dialog/guest-js/index.ts#L142](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/dialog/guest-js/index.ts#L142) |
| `yes` | `string` | The Yes button. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/dialog/guest-js/index.ts#L140](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/dialog/guest-js/index.ts#L140) |

#### [Since](https://tauri.app/reference/javascript/dialog/#since-7)

[Section titled “Since”](https://tauri.app/reference/javascript/dialog/#since-7)

2.4.0

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/dialog/guest-js/index.ts#L138](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/dialog/guest-js/index.ts#L138)

* * *

### [MessageDialogCustomButtons](https://tauri.app/reference/javascript/dialog/#messagedialogcustombuttons)

[Section titled “MessageDialogCustomButtons”](https://tauri.app/reference/javascript/dialog/#messagedialogcustombuttons)

    type MessageDialogCustomButtons: MessageDialogButtonsYesNoCancel | MessageDialogButtonsOkCancel | MessageDialogButtonsOk;

Custom buttons for a message dialog.

#### [Since](https://tauri.app/reference/javascript/dialog/#since-8)

[Section titled “Since”](https://tauri.app/reference/javascript/dialog/#since-8)

2.4.0

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/dialog/guest-js/index.ts#L174](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/dialog/guest-js/index.ts#L174)

* * *

### [MessageDialogDefaultButtons](https://tauri.app/reference/javascript/dialog/#messagedialogdefaultbuttons)

[Section titled “MessageDialogDefaultButtons”](https://tauri.app/reference/javascript/dialog/#messagedialogdefaultbuttons)

    type MessageDialogDefaultButtons: "Ok" | "OkCancel" | "YesNo" | "YesNoCancel";

Default buttons for a message dialog.

#### [Since](https://tauri.app/reference/javascript/dialog/#since-9)

[Section titled “Since”](https://tauri.app/reference/javascript/dialog/#since-9)

2.4.0

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/dialog/guest-js/index.ts#L119](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/dialog/guest-js/index.ts#L119)

* * *

### [MessageDialogResult](https://tauri.app/reference/javascript/dialog/#messagedialogresult)

[Section titled “MessageDialogResult”](https://tauri.app/reference/javascript/dialog/#messagedialogresult)

    type MessageDialogResult:  | "Yes"  | "No"  | "Ok"  | "Cancel"  | string & object;

The result of a message dialog.

The result is a string if the dialog has custom buttons, otherwise it is one of the default buttons.

#### [Since](https://tauri.app/reference/javascript/dialog/#since-10)

[Section titled “Since”](https://tauri.app/reference/javascript/dialog/#since-10)

2.4.0

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/dialog/guest-js/index.ts#L371](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/dialog/guest-js/index.ts#L371)

* * *

### [OpenDialogReturn<T>](https://tauri.app/reference/javascript/dialog/#opendialogreturnt)

[Section titled “OpenDialogReturn<T>”](https://tauri.app/reference/javascript/dialog/#opendialogreturnt)

    type OpenDialogReturn<T>: T["directory"] extends true ? T["multiple"] extends true ? string[] | null : string | null : T["multiple"] extends true ? string[] | null : string | null;

#### [Type Parameters](https://tauri.app/reference/javascript/dialog/#type-parameters)

[Section titled “Type Parameters”](https://tauri.app/reference/javascript/dialog/#type-parameters)

| Type Parameter |
| --- |
| `T` _extends_ [`OpenDialogOptions`](https://tauri.app/reference/javascript/dialog/#opendialogoptions) |

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/dialog/guest-js/index.ts#L261](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/dialog/guest-js/index.ts#L261)

* * *

### [PickerMode](https://tauri.app/reference/javascript/dialog/#pickermode)

[Section titled “PickerMode”](https://tauri.app/reference/javascript/dialog/#pickermode)

    type PickerMode: "document" | "media" | "image" | "video";

The preferred mode of the dialog. This is meant for mobile platforms (iOS and Android) which have distinct file and media pickers. On desktop, this option is ignored. If not provided, the dialog will automatically choose the best mode based on the MIME types or extensions of the filters.

**Note:** This option is only supported on iOS 14 and above. This parameter is ignored on iOS 13 and below.

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/dialog/guest-js/index.ts#L112](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/dialog/guest-js/index.ts#L112)

[Functions](https://tauri.app/reference/javascript/dialog/#functions)

----------------------------------------------------------------------

[Section titled “Functions”](https://tauri.app/reference/javascript/dialog/#functions)

### [ask()](https://tauri.app/reference/javascript/dialog/#ask)

[Section titled “ask()”](https://tauri.app/reference/javascript/dialog/#ask)

    function ask(message, options?): Promise<boolean>

Shows a question dialog with `Yes` and `No` buttons.

#### [Parameters](https://tauri.app/reference/javascript/dialog/#parameters)

[Section titled “Parameters”](https://tauri.app/reference/javascript/dialog/#parameters)

| Parameter | Type | Description |
| --- | --- | --- |
| `message` | `string` | The message to show. |
| `options`? | `string` \| [`ConfirmDialogOptions`](https://tauri.app/reference/javascript/dialog/#confirmdialogoptions) | The dialog’s options. If a string, it represents the dialog title. |

#### [Returns](https://tauri.app/reference/javascript/dialog/#returns)

[Section titled “Returns”](https://tauri.app/reference/javascript/dialog/#returns)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`boolean`\>

A promise resolving to a boolean indicating whether `Yes` was clicked or not.

#### [Example](https://tauri.app/reference/javascript/dialog/#example)

[Section titled “Example”](https://tauri.app/reference/javascript/dialog/#example)

    import { ask } from '@tauri-apps/plugin-dialog';const yes = await ask('Are you sure?', 'Tauri');const yes2 = await ask('This action cannot be reverted. Are you sure?', { title: 'Tauri', kind: 'warning' });

#### [Since](https://tauri.app/reference/javascript/dialog/#since-11)

[Section titled “Since”](https://tauri.app/reference/javascript/dialog/#since-11)

2.0.0

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/dialog/guest-js/index.ts#L421](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/dialog/guest-js/index.ts#L421)

* * *

### [confirm()](https://tauri.app/reference/javascript/dialog/#confirm)

[Section titled “confirm()”](https://tauri.app/reference/javascript/dialog/#confirm)

    function confirm(message, options?): Promise<boolean>

Shows a question dialog with `Ok` and `Cancel` buttons.

#### [Parameters](https://tauri.app/reference/javascript/dialog/#parameters-1)

[Section titled “Parameters”](https://tauri.app/reference/javascript/dialog/#parameters-1)

| Parameter | Type | Description |
| --- | --- | --- |
| `message` | `string` | The message to show. |
| `options`? | `string` \| [`ConfirmDialogOptions`](https://tauri.app/reference/javascript/dialog/#confirmdialogoptions) | The dialog’s options. If a string, it represents the dialog title. |

#### [Returns](https://tauri.app/reference/javascript/dialog/#returns-1)

[Section titled “Returns”](https://tauri.app/reference/javascript/dialog/#returns-1)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`boolean`\>

A promise resolving to a boolean indicating whether `Ok` was clicked or not.

#### [Example](https://tauri.app/reference/javascript/dialog/#example-1)

[Section titled “Example”](https://tauri.app/reference/javascript/dialog/#example-1)

    import { confirm } from '@tauri-apps/plugin-dialog';const confirmed = await confirm('Are you sure?', 'Tauri');const confirmed2 = await confirm('This action cannot be reverted. Are you sure?', { title: 'Tauri', kind: 'warning' });

#### [Since](https://tauri.app/reference/javascript/dialog/#since-12)

[Section titled “Since”](https://tauri.app/reference/javascript/dialog/#since-12)

2.0.0

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/dialog/guest-js/index.ts#L451](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/dialog/guest-js/index.ts#L451)

* * *

### [message()](https://tauri.app/reference/javascript/dialog/#message)

[Section titled “message()”](https://tauri.app/reference/javascript/dialog/#message)

    function message(message, options?): Promise<MessageDialogResult>

Shows a message dialog with an `Ok` button.

#### [Parameters](https://tauri.app/reference/javascript/dialog/#parameters-2)

[Section titled “Parameters”](https://tauri.app/reference/javascript/dialog/#parameters-2)

| Parameter | Type | Description |
| --- | --- | --- |
| `message` | `string` | The message to show. |
| `options`? | `string` \| [`MessageDialogOptions`](https://tauri.app/reference/javascript/dialog/#messagedialogoptions) | The dialog’s options. If a string, it represents the dialog title. |

#### [Returns](https://tauri.app/reference/javascript/dialog/#returns-2)

[Section titled “Returns”](https://tauri.app/reference/javascript/dialog/#returns-2)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<[`MessageDialogResult`](https://tauri.app/reference/javascript/dialog/#messagedialogresult)
\>

A promise indicating the success or failure of the operation.

#### [Example](https://tauri.app/reference/javascript/dialog/#example-2)

[Section titled “Example”](https://tauri.app/reference/javascript/dialog/#example-2)

    import { message } from '@tauri-apps/plugin-dialog';await message('Tauri is awesome', 'Tauri');await message('File not found', { title: 'Tauri', kind: 'error' });

#### [Since](https://tauri.app/reference/javascript/dialog/#since-13)

[Section titled “Since”](https://tauri.app/reference/javascript/dialog/#since-13)

2.0.0

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/dialog/guest-js/index.ts#L390](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/dialog/guest-js/index.ts#L390)

* * *

### [open()](https://tauri.app/reference/javascript/dialog/#open)

[Section titled “open()”](https://tauri.app/reference/javascript/dialog/#open)

    function open<T>(options): Promise<OpenDialogReturn<T>>

Open a file/directory selection dialog.

The selected paths are added to the filesystem and asset protocol scopes. When security is more important than the easy of use of this API, prefer writing a dedicated command instead.

Note that the scope change is not persisted, so the values are cleared when the application is restarted. You can save it to the filesystem using [tauri-plugin-persisted-scope](https://github.com/tauri-apps/tauri-plugin-persisted-scope)
.

#### [Type Parameters](https://tauri.app/reference/javascript/dialog/#type-parameters-1)

[Section titled “Type Parameters”](https://tauri.app/reference/javascript/dialog/#type-parameters-1)

| Type Parameter |
| --- |
| `T` _extends_ [`OpenDialogOptions`](https://tauri.app/reference/javascript/dialog/#opendialogoptions) |

#### [Parameters](https://tauri.app/reference/javascript/dialog/#parameters-3)

[Section titled “Parameters”](https://tauri.app/reference/javascript/dialog/#parameters-3)

| Parameter | Type |
| --- | --- |
| `options` | `T` |

#### [Returns](https://tauri.app/reference/javascript/dialog/#returns-3)

[Section titled “Returns”](https://tauri.app/reference/javascript/dialog/#returns-3)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<[`OpenDialogReturn`](https://tauri.app/reference/javascript/dialog/#opendialogreturnt)
<`T`\>>

A promise resolving to the selected path(s)

#### [Examples](https://tauri.app/reference/javascript/dialog/#examples)

[Section titled “Examples”](https://tauri.app/reference/javascript/dialog/#examples)

    import { open } from '@tauri-apps/plugin-dialog';// Open a selection dialog for image filesconst selected = await open({  multiple: true,  filters: [{    name: 'Image',    extensions: ['png', 'jpeg']  }]});if (Array.isArray(selected)) {  // user selected multiple files} else if (selected === null) {  // user cancelled the selection} else {  // user selected a single file}

    import { open } from '@tauri-apps/plugin-dialog';import { appDir } from '@tauri-apps/api/path';// Open a selection dialog for directoriesconst selected = await open({  directory: true,  multiple: true,  defaultPath: await appDir(),});if (Array.isArray(selected)) {  // user selected multiple directories} else if (selected === null) {  // user cancelled the selection} else {  // user selected a single directory}

#### [Since](https://tauri.app/reference/javascript/dialog/#since-14)

[Section titled “Since”](https://tauri.app/reference/javascript/dialog/#since-14)

2.0.0

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/dialog/guest-js/index.ts#L321](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/dialog/guest-js/index.ts#L321)

* * *

### [save()](https://tauri.app/reference/javascript/dialog/#save)

[Section titled “save()”](https://tauri.app/reference/javascript/dialog/#save)

    function save(options): Promise<string | null>

Open a file/directory save dialog.

The selected path is added to the filesystem and asset protocol scopes. When security is more important than the easy of use of this API, prefer writing a dedicated command instead.

Note that the scope change is not persisted, so the values are cleared when the application is restarted. You can save it to the filesystem using [tauri-plugin-persisted-scope](https://github.com/tauri-apps/tauri-plugin-persisted-scope)
.

#### [Parameters](https://tauri.app/reference/javascript/dialog/#parameters-4)

[Section titled “Parameters”](https://tauri.app/reference/javascript/dialog/#parameters-4)

| Parameter | Type |
| --- | --- |
| `options` | [`SaveDialogOptions`](https://tauri.app/reference/javascript/dialog/#savedialogoptions) |

#### [Returns](https://tauri.app/reference/javascript/dialog/#returns-4)

[Section titled “Returns”](https://tauri.app/reference/javascript/dialog/#returns-4)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`string` | `null`\>

A promise resolving to the selected path.

#### [Example](https://tauri.app/reference/javascript/dialog/#example-3)

[Section titled “Example”](https://tauri.app/reference/javascript/dialog/#example-3)

    import { save } from '@tauri-apps/plugin-dialog';const filePath = await save({  filters: [{    name: 'Image',    extensions: ['png', 'jpeg']  }]});

#### [Since](https://tauri.app/reference/javascript/dialog/#since-15)

[Section titled “Since”](https://tauri.app/reference/javascript/dialog/#since-15)

2.0.0

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/dialog/guest-js/index.ts#L355](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/dialog/guest-js/index.ts#L355)

* * *

[Support on Open Collective](https://opencollective.com/tauri)
 [Sponsor on GitHub](https://github.com/sponsors/tauri-apps)

© 2026 Tauri Contributors. CC-BY / MIT

---

# @tauri-apps/plugin-websocket | Tauri

[Skip to content](https://tauri.app/reference/javascript/websocket/#_top)

@tauri-apps/plugin-websocket
============================

[Classes](https://tauri.app/reference/javascript/websocket/#classes)

---------------------------------------------------------------------

[Section titled “Classes”](https://tauri.app/reference/javascript/websocket/#classes)

### [default](https://tauri.app/reference/javascript/websocket/#default)

[Section titled “default”](https://tauri.app/reference/javascript/websocket/#default)

#### [Constructors](https://tauri.app/reference/javascript/websocket/#constructors)

[Section titled “Constructors”](https://tauri.app/reference/javascript/websocket/#constructors)

##### [new default()](https://tauri.app/reference/javascript/websocket/#new-default)

[Section titled “new default()”](https://tauri.app/reference/javascript/websocket/#new-default)

    new default(id, listeners): default

###### [Parameters](https://tauri.app/reference/javascript/websocket/#parameters)

[Section titled “Parameters”](https://tauri.app/reference/javascript/websocket/#parameters)

| Parameter | Type |
| --- | --- |
| `id` | `number` |
| `listeners` | [`Set`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Set)<br><(`arg`) => `void`\> |

###### [Returns](https://tauri.app/reference/javascript/websocket/#returns)

[Section titled “Returns”](https://tauri.app/reference/javascript/websocket/#returns)

[`default`](https://tauri.app/reference/javascript/websocket/#default)

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/websocket/guest-js/index.ts#L63](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/websocket/guest-js/index.ts#L63)

#### [Properties](https://tauri.app/reference/javascript/websocket/#properties)

[Section titled “Properties”](https://tauri.app/reference/javascript/websocket/#properties)

| Property | Type | Defined in |
| --- | --- | --- |
| `id` | `number` | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/websocket/guest-js/index.ts#L60](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/websocket/guest-js/index.ts#L60) |

#### [Methods](https://tauri.app/reference/javascript/websocket/#methods)

[Section titled “Methods”](https://tauri.app/reference/javascript/websocket/#methods)

##### [addListener()](https://tauri.app/reference/javascript/websocket/#addlistener)

[Section titled “addListener()”](https://tauri.app/reference/javascript/websocket/#addlistener)

    addListener(cb): () => void

###### [Parameters](https://tauri.app/reference/javascript/websocket/#parameters-1)

[Section titled “Parameters”](https://tauri.app/reference/javascript/websocket/#parameters-1)

| Parameter | Type |
| --- | --- |
| `cb` | (`arg`) => `void` |

###### [Returns](https://tauri.app/reference/javascript/websocket/#returns-1)

[Section titled “Returns”](https://tauri.app/reference/javascript/websocket/#returns-1)

`Function`

###### [Returns](https://tauri.app/reference/javascript/websocket/#returns-2)

[Section titled “Returns”](https://tauri.app/reference/javascript/websocket/#returns-2)

`void`

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/websocket/guest-js/index.ts#L92](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/websocket/guest-js/index.ts#L92)

##### [disconnect()](https://tauri.app/reference/javascript/websocket/#disconnect)

[Section titled “disconnect()”](https://tauri.app/reference/javascript/websocket/#disconnect)

    disconnect(): Promise<void>

###### [Returns](https://tauri.app/reference/javascript/websocket/#returns-3)

[Section titled “Returns”](https://tauri.app/reference/javascript/websocket/#returns-3)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`void`\>

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/websocket/guest-js/index.ts#L119](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/websocket/guest-js/index.ts#L119)

##### [send()](https://tauri.app/reference/javascript/websocket/#send)

[Section titled “send()”](https://tauri.app/reference/javascript/websocket/#send)

    send(message): Promise<void>

###### [Parameters](https://tauri.app/reference/javascript/websocket/#parameters-2)

[Section titled “Parameters”](https://tauri.app/reference/javascript/websocket/#parameters-2)

| Parameter | Type |
| --- | --- |
| `message` | `string` \| `number`\[\] \| [`Message`](https://tauri.app/reference/javascript/websocket/#message) |

###### [Returns](https://tauri.app/reference/javascript/websocket/#returns-4)

[Section titled “Returns”](https://tauri.app/reference/javascript/websocket/#returns-4)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`void`\>

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/websocket/guest-js/index.ts#L100](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/websocket/guest-js/index.ts#L100)

##### [connect()](https://tauri.app/reference/javascript/websocket/#connect)

[Section titled “connect()”](https://tauri.app/reference/javascript/websocket/#connect)

    static connect(url, config?): Promise<default>

###### [Parameters](https://tauri.app/reference/javascript/websocket/#parameters-3)

[Section titled “Parameters”](https://tauri.app/reference/javascript/websocket/#parameters-3)

| Parameter | Type |
| --- | --- |
| `url` | `string` |
| `config`? | [`ConnectionConfig`](https://tauri.app/reference/javascript/websocket/#connectionconfig) |

###### [Returns](https://tauri.app/reference/javascript/websocket/#returns-5)

[Section titled “Returns”](https://tauri.app/reference/javascript/websocket/#returns-5)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<[`default`](https://tauri.app/reference/javascript/websocket/#default)
\>

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/websocket/guest-js/index.ts#L68](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/websocket/guest-js/index.ts#L68)

[Interfaces](https://tauri.app/reference/javascript/websocket/#interfaces)

---------------------------------------------------------------------------

[Section titled “Interfaces”](https://tauri.app/reference/javascript/websocket/#interfaces)

### [CloseFrame](https://tauri.app/reference/javascript/websocket/#closeframe)

[Section titled “CloseFrame”](https://tauri.app/reference/javascript/websocket/#closeframe)

#### [Properties](https://tauri.app/reference/javascript/websocket/#properties-1)

[Section titled “Properties”](https://tauri.app/reference/javascript/websocket/#properties-1)

| Property | Type | Defined in |
| --- | --- | --- |
| `code` | `number` | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/websocket/guest-js/index.ts#L48](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/websocket/guest-js/index.ts#L48) |
| `reason` | `string` | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/websocket/guest-js/index.ts#L49](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/websocket/guest-js/index.ts#L49) |

* * *

### [ConnectionConfig](https://tauri.app/reference/javascript/websocket/#connectionconfig)

[Section titled “ConnectionConfig”](https://tauri.app/reference/javascript/websocket/#connectionconfig)

#### [Properties](https://tauri.app/reference/javascript/websocket/#properties-2)

[Section titled “Properties”](https://tauri.app/reference/javascript/websocket/#properties-2)

| Property | Type | Description | Defined in |
| --- | --- | --- | --- |
| `acceptUnmaskedFrames?` | `boolean` | When set to true, the server will accept and handle unmasked frames from the client. According to the RFC 6455, the server must close the connection to the client in such cases, however it seems like there are some popular libraries that are sending unmasked frames, ignoring the RFC. By default this option is set to false, i.e. according to RFC 6455. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/websocket/guest-js/index.ts#L35](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/websocket/guest-js/index.ts#L35) |
| `headers?` | `HeadersInit` | Additional connect request headers. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/websocket/guest-js/index.ts#L39](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/websocket/guest-js/index.ts#L39) |
| `maxFrameSize?` | `number` \| `"none"` | The maximum size of a single incoming message frame. The string “none” means no size limit. The limit is for frame payload NOT including the frame header. The default value is 16 MiB which should be reasonably big for all normal use-cases but small enough to prevent memory eating by a malicious user. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/websocket/guest-js/index.ts#L31](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/websocket/guest-js/index.ts#L31) |
| `maxMessageSize?` | `number` \| `"none"` | The maximum size of an incoming message. The string “none” means no size limit. The default value is 64 MiB which should be reasonably big for all normal use-cases but small enough to prevent memory eating by a malicious user. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/websocket/guest-js/index.ts#L27](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/websocket/guest-js/index.ts#L27) |
| `maxWriteBufferSize?` | `number` | The max size of the write buffer in bytes. Setting this can provide backpressure in the case the write buffer is filling up due to write errors. The default value is unlimited. Note: The write buffer only builds up past write\_buffer\_size when writes to the underlying stream are failing. So the write buffer can not fill up if you are not observing write errors. Note: Should always be at least write\_buffer\_size + 1 message and probably a little more depending on error handling strategy. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/websocket/guest-js/index.ts#L23](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/websocket/guest-js/index.ts#L23) |
| `readBufferSize?` | `number` | Read buffer capacity. The default value is 128 KiB. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/websocket/guest-js/index.ts#L11](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/websocket/guest-js/index.ts#L11) |
| `writeBufferSize?` | `number` | The target minimum size of the write buffer to reach before writing the data to the underlying stream. The default value is 128 KiB. If set to 0 each message will be eagerly written to the underlying stream. It is often more optimal to allow them to buffer a little, hence the default value. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/websocket/guest-js/index.ts#L16](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/websocket/guest-js/index.ts#L16) |

* * *

### [MessageKind<T, D>](https://tauri.app/reference/javascript/websocket/#messagekindt-d)

[Section titled “MessageKind<T, D>”](https://tauri.app/reference/javascript/websocket/#messagekindt-d)

#### [Type Parameters](https://tauri.app/reference/javascript/websocket/#type-parameters)

[Section titled “Type Parameters”](https://tauri.app/reference/javascript/websocket/#type-parameters)

| Type Parameter |
| --- |
| `T` |
| `D` |

#### [Properties](https://tauri.app/reference/javascript/websocket/#properties-3)

[Section titled “Properties”](https://tauri.app/reference/javascript/websocket/#properties-3)

| Property | Type | Defined in |
| --- | --- | --- |
| `data` | `D` | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/websocket/guest-js/index.ts#L44](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/websocket/guest-js/index.ts#L44) |
| `type` | `T` | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/websocket/guest-js/index.ts#L43](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/websocket/guest-js/index.ts#L43) |

[Type Aliases](https://tauri.app/reference/javascript/websocket/#type-aliases)

-------------------------------------------------------------------------------

[Section titled “Type Aliases”](https://tauri.app/reference/javascript/websocket/#type-aliases)

### [Message](https://tauri.app/reference/javascript/websocket/#message)

[Section titled “Message”](https://tauri.app/reference/javascript/websocket/#message)

    type Message:  | MessageKind<"Text", string>  | MessageKind<"Binary", number[]>  | MessageKind<"Ping", number[]>  | MessageKind<"Pong", number[]>| MessageKind<"Close", CloseFrame | null>;

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/websocket/guest-js/index.ts#L52](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/websocket/guest-js/index.ts#L52)

* * *

[Support on Open Collective](https://opencollective.com/tauri)
 [Sponsor on GitHub](https://github.com/sponsors/tauri-apps)

© 2026 Tauri Contributors. CC-BY / MIT

---

# @tauri-apps/plugin-cli | Tauri

[Skip to content](https://tauri.app/reference/javascript/cli/#_top)

@tauri-apps/plugin-cli
======================

Parse arguments from your Command Line Interface.

[Interfaces](https://tauri.app/reference/javascript/cli/#interfaces)

---------------------------------------------------------------------

[Section titled “Interfaces”](https://tauri.app/reference/javascript/cli/#interfaces)

### [ArgMatch](https://tauri.app/reference/javascript/cli/#argmatch)

[Section titled “ArgMatch”](https://tauri.app/reference/javascript/cli/#argmatch)

#### [Since](https://tauri.app/reference/javascript/cli/#since)

[Section titled “Since”](https://tauri.app/reference/javascript/cli/#since)

2.0.0

#### [Properties](https://tauri.app/reference/javascript/cli/#properties)

[Section titled “Properties”](https://tauri.app/reference/javascript/cli/#properties)

| Property | Type | Description | Defined in |
| --- | --- | --- | --- |
| `occurrences` | `number` | Number of occurrences | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/cli/guest-js/index.ts#L26](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/cli/guest-js/index.ts#L26) |
| `value` | `null` \| `string` \| `boolean` \| `string`\[\] | string if takes value boolean if flag string\[\] or null if takes multiple values | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/cli/guest-js/index.ts#L22](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/cli/guest-js/index.ts#L22) |

* * *

### [CliMatches](https://tauri.app/reference/javascript/cli/#climatches)

[Section titled “CliMatches”](https://tauri.app/reference/javascript/cli/#climatches)

#### [Since](https://tauri.app/reference/javascript/cli/#since-1)

[Section titled “Since”](https://tauri.app/reference/javascript/cli/#since-1)

2.0.0

#### [Properties](https://tauri.app/reference/javascript/cli/#properties-1)

[Section titled “Properties”](https://tauri.app/reference/javascript/cli/#properties-1)

| Property | Type | Defined in |
| --- | --- | --- |
| `args` | [`Record`](https://www.typescriptlang.org/docs/handbook/utility-types.html#recordkeys-type)<br><`string`, [`ArgMatch`](https://tauri.app/reference/javascript/cli/#argmatch)<br>\> | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/cli/guest-js/index.ts#L41](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/cli/guest-js/index.ts#L41) |
| `subcommand` | `null` \| [`SubcommandMatch`](https://tauri.app/reference/javascript/cli/#subcommandmatch) | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/cli/guest-js/index.ts#L42](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/cli/guest-js/index.ts#L42) |

* * *

### [SubcommandMatch](https://tauri.app/reference/javascript/cli/#subcommandmatch)

[Section titled “SubcommandMatch”](https://tauri.app/reference/javascript/cli/#subcommandmatch)

#### [Since](https://tauri.app/reference/javascript/cli/#since-2)

[Section titled “Since”](https://tauri.app/reference/javascript/cli/#since-2)

2.0.0

#### [Properties](https://tauri.app/reference/javascript/cli/#properties-2)

[Section titled “Properties”](https://tauri.app/reference/javascript/cli/#properties-2)

| Property | Type | Defined in |
| --- | --- | --- |
| `matches` | [`CliMatches`](https://tauri.app/reference/javascript/cli/#climatches) | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/cli/guest-js/index.ts#L34](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/cli/guest-js/index.ts#L34) |
| `name` | `string` | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/cli/guest-js/index.ts#L33](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/cli/guest-js/index.ts#L33) |

[Functions](https://tauri.app/reference/javascript/cli/#functions)

-------------------------------------------------------------------

[Section titled “Functions”](https://tauri.app/reference/javascript/cli/#functions)

### [getMatches()](https://tauri.app/reference/javascript/cli/#getmatches)

[Section titled “getMatches()”](https://tauri.app/reference/javascript/cli/#getmatches)

    function getMatches(): Promise<CliMatches>

Parse the arguments provided to the current process and get the matches using the configuration defined [`tauri.cli`](https://tauri.app/v1/api/config/#tauriconfig.cli)
 in `tauri.conf.json`

#### [Returns](https://tauri.app/reference/javascript/cli/#returns)

[Section titled “Returns”](https://tauri.app/reference/javascript/cli/#returns)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<[`CliMatches`](https://tauri.app/reference/javascript/cli/#climatches)
\>

#### [Example](https://tauri.app/reference/javascript/cli/#example)

[Section titled “Example”](https://tauri.app/reference/javascript/cli/#example)

    import { getMatches } from '@tauri-apps/plugin-cli';const matches = await getMatches();if (matches.subcommand?.name === 'run') {  // `./your-app run $ARGS` was executed  const args = matches.subcommand?.matches.args  if ('debug' in args) {    // `./your-app run --debug` was executed  }} else {  const args = matches.args  // `./your-app $ARGS` was executed}

#### [Since](https://tauri.app/reference/javascript/cli/#since-3)

[Section titled “Since”](https://tauri.app/reference/javascript/cli/#since-3)

2.0.0

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/cli/guest-js/index.ts#L66](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/cli/guest-js/index.ts#L66)

* * *

[Support on Open Collective](https://opencollective.com/tauri)
 [Sponsor on GitHub](https://github.com/sponsors/tauri-apps)

© 2026 Tauri Contributors. CC-BY / MIT

---

# @tauri-apps/plugin-updater | Tauri

[Skip to content](https://tauri.app/reference/javascript/updater/#_top)

@tauri-apps/plugin-updater
==========================

[Classes](https://tauri.app/reference/javascript/updater/#classes)

-------------------------------------------------------------------

[Section titled “Classes”](https://tauri.app/reference/javascript/updater/#classes)

### [Update](https://tauri.app/reference/javascript/updater/#update)

[Section titled “Update”](https://tauri.app/reference/javascript/updater/#update)

#### [Extends](https://tauri.app/reference/javascript/updater/#extends)

[Section titled “Extends”](https://tauri.app/reference/javascript/updater/#extends)

*   `Resource`

#### [Constructors](https://tauri.app/reference/javascript/updater/#constructors)

[Section titled “Constructors”](https://tauri.app/reference/javascript/updater/#constructors)

##### [new Update()](https://tauri.app/reference/javascript/updater/#new-update)

[Section titled “new Update()”](https://tauri.app/reference/javascript/updater/#new-update)

    new Update(metadata): Update

###### [Parameters](https://tauri.app/reference/javascript/updater/#parameters)

[Section titled “Parameters”](https://tauri.app/reference/javascript/updater/#parameters)

| Parameter | Type |
| --- | --- |
| `metadata` | `UpdateMetadata` |

###### [Returns](https://tauri.app/reference/javascript/updater/#returns)

[Section titled “Returns”](https://tauri.app/reference/javascript/updater/#returns)

[`Update`](https://tauri.app/reference/javascript/updater/#update)

###### [Overrides](https://tauri.app/reference/javascript/updater/#overrides)

[Section titled “Overrides”](https://tauri.app/reference/javascript/updater/#overrides)

`Resource.constructor`

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/updater/guest-js/index.ts#L69](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/updater/guest-js/index.ts#L69)

#### [Properties](https://tauri.app/reference/javascript/updater/#properties)

[Section titled “Properties”](https://tauri.app/reference/javascript/updater/#properties)

| Property | Type | Description | Defined in |
| --- | --- | --- | --- |
| ~`available`~ | `boolean` | **Deprecated** This is always true, check if the return value is `null` instead when using [`check`](https://tauri.app/reference/javascript/updater/#check) | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/updater/guest-js/index.ts#L61](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/updater/guest-js/index.ts#L61) |
| `body?` | `string` | \-  | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/updater/guest-js/index.ts#L65](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/updater/guest-js/index.ts#L65) |
| `currentVersion` | `string` | \-  | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/updater/guest-js/index.ts#L62](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/updater/guest-js/index.ts#L62) |
| `date?` | `string` | \-  | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/updater/guest-js/index.ts#L64](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/updater/guest-js/index.ts#L64) |
| `rawJson` | [`Record`](https://www.typescriptlang.org/docs/handbook/utility-types.html#recordkeys-type)<br><`string`, `unknown`\> | \-  | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/updater/guest-js/index.ts#L66](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/updater/guest-js/index.ts#L66) |
| `version` | `string` | \-  | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/updater/guest-js/index.ts#L63](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/updater/guest-js/index.ts#L63) |

#### [Accessors](https://tauri.app/reference/javascript/updater/#accessors)

[Section titled “Accessors”](https://tauri.app/reference/javascript/updater/#accessors)

##### [rid](https://tauri.app/reference/javascript/updater/#rid)

[Section titled “rid”](https://tauri.app/reference/javascript/updater/#rid)

    get rid(): number

###### [Returns](https://tauri.app/reference/javascript/updater/#returns-1)

[Section titled “Returns”](https://tauri.app/reference/javascript/updater/#returns-1)

`number`

###### [Inherited from](https://tauri.app/reference/javascript/updater/#inherited-from)

[Section titled “Inherited from”](https://tauri.app/reference/javascript/updater/#inherited-from)

`Resource.rid`

**Source**: undefined

#### [Methods](https://tauri.app/reference/javascript/updater/#methods)

[Section titled “Methods”](https://tauri.app/reference/javascript/updater/#methods)

##### [close()](https://tauri.app/reference/javascript/updater/#close)

[Section titled “close()”](https://tauri.app/reference/javascript/updater/#close)

    close(): Promise<void>

Destroys and cleans up this resource from memory. **You should not call any method on this object anymore and should drop any reference to it.**

###### [Returns](https://tauri.app/reference/javascript/updater/#returns-2)

[Section titled “Returns”](https://tauri.app/reference/javascript/updater/#returns-2)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`void`\>

###### [Overrides](https://tauri.app/reference/javascript/updater/#overrides-1)

[Section titled “Overrides”](https://tauri.app/reference/javascript/updater/#overrides-1)

`Resource.close`

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/updater/guest-js/index.ts#L129](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/updater/guest-js/index.ts#L129)

##### [download()](https://tauri.app/reference/javascript/updater/#download)

[Section titled “download()”](https://tauri.app/reference/javascript/updater/#download)

    download(onEvent?, options?): Promise<void>

Download the updater package

###### [Parameters](https://tauri.app/reference/javascript/updater/#parameters-1)

[Section titled “Parameters”](https://tauri.app/reference/javascript/updater/#parameters-1)

| Parameter | Type |
| --- | --- |
| `onEvent`? | (`progress`) => `void` |
| `options`? | [`DownloadOptions`](https://tauri.app/reference/javascript/updater/#downloadoptions) |

###### [Returns](https://tauri.app/reference/javascript/updater/#returns-3)

[Section titled “Returns”](https://tauri.app/reference/javascript/updater/#returns-3)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`void`\>

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/updater/guest-js/index.ts#L80](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/updater/guest-js/index.ts#L80)

##### [downloadAndInstall()](https://tauri.app/reference/javascript/updater/#downloadandinstall)

[Section titled “downloadAndInstall()”](https://tauri.app/reference/javascript/updater/#downloadandinstall)

    downloadAndInstall(onEvent?, options?): Promise<void>

Downloads the updater package and installs it

###### [Parameters](https://tauri.app/reference/javascript/updater/#parameters-2)

[Section titled “Parameters”](https://tauri.app/reference/javascript/updater/#parameters-2)

| Parameter | Type |
| --- | --- |
| `onEvent`? | (`progress`) => `void` |
| `options`? | [`DownloadOptions`](https://tauri.app/reference/javascript/updater/#downloadoptions) |

###### [Returns](https://tauri.app/reference/javascript/updater/#returns-4)

[Section titled “Returns”](https://tauri.app/reference/javascript/updater/#returns-4)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`void`\>

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/updater/guest-js/index.ts#L113](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/updater/guest-js/index.ts#L113)

##### [install()](https://tauri.app/reference/javascript/updater/#install)

[Section titled “install()”](https://tauri.app/reference/javascript/updater/#install)

    install(): Promise<void>

Install downloaded updater package

###### [Returns](https://tauri.app/reference/javascript/updater/#returns-5)

[Section titled “Returns”](https://tauri.app/reference/javascript/updater/#returns-5)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`void`\>

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/updater/guest-js/index.ts#L98](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/updater/guest-js/index.ts#L98)

[Interfaces](https://tauri.app/reference/javascript/updater/#interfaces)

-------------------------------------------------------------------------

[Section titled “Interfaces”](https://tauri.app/reference/javascript/updater/#interfaces)

### [CheckOptions](https://tauri.app/reference/javascript/updater/#checkoptions)

[Section titled “CheckOptions”](https://tauri.app/reference/javascript/updater/#checkoptions)

Options used when checking for updates

#### [Properties](https://tauri.app/reference/javascript/updater/#properties-1)

[Section titled “Properties”](https://tauri.app/reference/javascript/updater/#properties-1)

| Property | Type | Description | Defined in |
| --- | --- | --- | --- |
| `allowDowngrades?` | `boolean` | Allow downgrades to previous versions by not checking if the current version is greater than the available version. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/updater/guest-js/index.ts#L28](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/updater/guest-js/index.ts#L28) |
| `headers?` | `HeadersInit` | Request headers | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/updater/guest-js/index.ts#L12](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/updater/guest-js/index.ts#L12) |
| `proxy?` | `string` | A proxy url to be used when checking and downloading updates. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/updater/guest-js/index.ts#L20](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/updater/guest-js/index.ts#L20) |
| `target?` | `string` | Target identifier for the running application. This is sent to the backend. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/updater/guest-js/index.ts#L24](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/updater/guest-js/index.ts#L24) |
| `timeout?` | `number` | Timeout in milliseconds | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/updater/guest-js/index.ts#L16](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/updater/guest-js/index.ts#L16) |

* * *

### [DownloadOptions](https://tauri.app/reference/javascript/updater/#downloadoptions)

[Section titled “DownloadOptions”](https://tauri.app/reference/javascript/updater/#downloadoptions)

Options used when downloading an update

#### [Properties](https://tauri.app/reference/javascript/updater/#properties-2)

[Section titled “Properties”](https://tauri.app/reference/javascript/updater/#properties-2)

| Property | Type | Description | Defined in |
| --- | --- | --- | --- |
| `headers?` | `HeadersInit` | Request headers | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/updater/guest-js/index.ts#L36](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/updater/guest-js/index.ts#L36) |
| `timeout?` | `number` | Timeout in milliseconds | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/updater/guest-js/index.ts#L40](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/updater/guest-js/index.ts#L40) |

[Type Aliases](https://tauri.app/reference/javascript/updater/#type-aliases)

-----------------------------------------------------------------------------

[Section titled “Type Aliases”](https://tauri.app/reference/javascript/updater/#type-aliases)

### [DownloadEvent](https://tauri.app/reference/javascript/updater/#downloadevent)

[Section titled “DownloadEvent”](https://tauri.app/reference/javascript/updater/#downloadevent)

    type DownloadEvent: object | object | object;

Updater download event

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/updater/guest-js/index.ts#L53](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/updater/guest-js/index.ts#L53)

[Functions](https://tauri.app/reference/javascript/updater/#functions)

-----------------------------------------------------------------------

[Section titled “Functions”](https://tauri.app/reference/javascript/updater/#functions)

### [check()](https://tauri.app/reference/javascript/updater/#check)

[Section titled “check()”](https://tauri.app/reference/javascript/updater/#check)

    function check(options?): Promise<Update | null>

Check for updates, resolves to `null` if no updates are available

#### [Parameters](https://tauri.app/reference/javascript/updater/#parameters-3)

[Section titled “Parameters”](https://tauri.app/reference/javascript/updater/#parameters-3)

| Parameter | Type |
| --- | --- |
| `options`? | [`CheckOptions`](https://tauri.app/reference/javascript/updater/#checkoptions) |

#### [Returns](https://tauri.app/reference/javascript/updater/#returns-6)

[Section titled “Returns”](https://tauri.app/reference/javascript/updater/#returns-6)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<[`Update`](https://tauri.app/reference/javascript/updater/#update)
 | `null`\>

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/updater/guest-js/index.ts#L136](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/updater/guest-js/index.ts#L136)

* * *

[Support on Open Collective](https://opencollective.com/tauri)
 [Sponsor on GitHub](https://github.com/sponsors/tauri-apps)

© 2026 Tauri Contributors. CC-BY / MIT

---

# @tauri-apps/plugin-log | Tauri

[Skip to content](https://tauri.app/reference/javascript/log/#_top)

@tauri-apps/plugin-log
======================

[Enumerations](https://tauri.app/reference/javascript/log/#enumerations)

-------------------------------------------------------------------------

[Section titled “Enumerations”](https://tauri.app/reference/javascript/log/#enumerations)

### [LogLevel](https://tauri.app/reference/javascript/log/#loglevel)

[Section titled “LogLevel”](https://tauri.app/reference/javascript/log/#loglevel)

#### [Enumeration Members](https://tauri.app/reference/javascript/log/#enumeration-members)

[Section titled “Enumeration Members”](https://tauri.app/reference/javascript/log/#enumeration-members)

##### [Debug](https://tauri.app/reference/javascript/log/#debug)

[Section titled “Debug”](https://tauri.app/reference/javascript/log/#debug)

    Debug: 2;

The “debug” level.

Designates lower priority information.

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/log/guest-js/index.ts#L26](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/log/guest-js/index.ts#L26)

##### [Error](https://tauri.app/reference/javascript/log/#error)

[Section titled “Error”](https://tauri.app/reference/javascript/log/#error)

    Error: 5;

The “error” level.

Designates very serious errors.

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/log/guest-js/index.ts#L44](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/log/guest-js/index.ts#L44)

##### [Info](https://tauri.app/reference/javascript/log/#info)

[Section titled “Info”](https://tauri.app/reference/javascript/log/#info)

    Info: 3;

The “info” level.

Designates useful information.

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/log/guest-js/index.ts#L32](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/log/guest-js/index.ts#L32)

##### [Trace](https://tauri.app/reference/javascript/log/#trace)

[Section titled “Trace”](https://tauri.app/reference/javascript/log/#trace)

    Trace: 1;

The “trace” level.

Designates very low priority, often extremely verbose, information.

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/log/guest-js/index.ts#L20](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/log/guest-js/index.ts#L20)

##### [Warn](https://tauri.app/reference/javascript/log/#warn)

[Section titled “Warn”](https://tauri.app/reference/javascript/log/#warn)

    Warn: 4;

The “warn” level.

Designates hazardous situations.

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/log/guest-js/index.ts#L38](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/log/guest-js/index.ts#L38)

[Interfaces](https://tauri.app/reference/javascript/log/#interfaces)

---------------------------------------------------------------------

[Section titled “Interfaces”](https://tauri.app/reference/javascript/log/#interfaces)

### [LogOptions](https://tauri.app/reference/javascript/log/#logoptions)

[Section titled “LogOptions”](https://tauri.app/reference/javascript/log/#logoptions)

#### [Properties](https://tauri.app/reference/javascript/log/#properties)

[Section titled “Properties”](https://tauri.app/reference/javascript/log/#properties)

| Property | Type | Defined in |
| --- | --- | --- |
| `file?` | `string` | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/log/guest-js/index.ts#L9](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/log/guest-js/index.ts#L9) |
| `keyValues?` | [`Record`](https://www.typescriptlang.org/docs/handbook/utility-types.html#recordkeys-type)<br><`string`, `undefined` \| `string`\> | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/log/guest-js/index.ts#L11](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/log/guest-js/index.ts#L11) |
| `line?` | `number` | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/log/guest-js/index.ts#L10](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/log/guest-js/index.ts#L10) |

[Functions](https://tauri.app/reference/javascript/log/#functions)

-------------------------------------------------------------------

[Section titled “Functions”](https://tauri.app/reference/javascript/log/#functions)

### [attachConsole()](https://tauri.app/reference/javascript/log/#attachconsole)

[Section titled “attachConsole()”](https://tauri.app/reference/javascript/log/#attachconsole)

    function attachConsole(): Promise<UnlistenFn>

Attaches a listener that writes log entries to the console as they come in.

#### [Returns](https://tauri.app/reference/javascript/log/#returns)

[Section titled “Returns”](https://tauri.app/reference/javascript/log/#returns)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`UnlistenFn`\>

a function to cancel the listener.

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/log/guest-js/index.ts#L277](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/log/guest-js/index.ts#L277)

* * *

### [attachLogger()](https://tauri.app/reference/javascript/log/#attachlogger)

[Section titled “attachLogger()”](https://tauri.app/reference/javascript/log/#attachlogger)

    function attachLogger(fn): Promise<UnlistenFn>

Attaches a listener for the log, and calls the passed function for each log entry.

#### [Parameters](https://tauri.app/reference/javascript/log/#parameters)

[Section titled “Parameters”](https://tauri.app/reference/javascript/log/#parameters)

| Parameter | Type | Description |
| --- | --- | --- |
| `fn` | `LoggerFn` |     |

#### [Returns](https://tauri.app/reference/javascript/log/#returns-1)

[Section titled “Returns”](https://tauri.app/reference/javascript/log/#returns-1)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`UnlistenFn`\>

a function to cancel the listener.

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/log/guest-js/index.ts#L256](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/log/guest-js/index.ts#L256)

* * *

### [debug()](https://tauri.app/reference/javascript/log/#debug-1)

[Section titled “debug()”](https://tauri.app/reference/javascript/log/#debug-1)

    function debug(message, options?): Promise<void>

Logs a message at the debug level.

#### [Parameters](https://tauri.app/reference/javascript/log/#parameters-1)

[Section titled “Parameters”](https://tauri.app/reference/javascript/log/#parameters-1)

| Parameter | Type | Description |
| --- | --- | --- |
| `message` | `string` | \# Examples `import { debug } from '@tauri-apps/plugin-log'; const pos = { x: 3.234, y: -1.223 }; debug(`New position: x: {pos.x}, y: {pos.y}`);` |
| `options`? | [`LogOptions`](https://tauri.app/reference/javascript/log/#logoptions) | \-  |

#### [Returns](https://tauri.app/reference/javascript/log/#returns-2)

[Section titled “Returns”](https://tauri.app/reference/javascript/log/#returns-2)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`void`\>

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/log/guest-js/index.ts#L214](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/log/guest-js/index.ts#L214)

* * *

### [error()](https://tauri.app/reference/javascript/log/#error-1)

[Section titled “error()”](https://tauri.app/reference/javascript/log/#error-1)

    function error(message, options?): Promise<void>

Logs a message at the error level.

#### [Parameters](https://tauri.app/reference/javascript/log/#parameters-2)

[Section titled “Parameters”](https://tauri.app/reference/javascript/log/#parameters-2)

| Parameter | Type | Description |
| --- | --- | --- |
| `message` | `string` | \# Examples `import { error } from '@tauri-apps/plugin-log'; const err_info = "No connection"; const port = 22; error(`Error: ${err\_info} on port ${port}`);` |
| `options`? | [`LogOptions`](https://tauri.app/reference/javascript/log/#logoptions) | \-  |

#### [Returns](https://tauri.app/reference/javascript/log/#returns-3)

[Section titled “Returns”](https://tauri.app/reference/javascript/log/#returns-3)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`void`\>

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/log/guest-js/index.ts#L148](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/log/guest-js/index.ts#L148)

* * *

### [info()](https://tauri.app/reference/javascript/log/#info-1)

[Section titled “info()”](https://tauri.app/reference/javascript/log/#info-1)

    function info(message, options?): Promise<void>

Logs a message at the info level.

#### [Parameters](https://tauri.app/reference/javascript/log/#parameters-3)

[Section titled “Parameters”](https://tauri.app/reference/javascript/log/#parameters-3)

| Parameter | Type | Description |
| --- | --- | --- |
| `message` | `string` | \# Examples `import { info } from '@tauri-apps/plugin-log'; const conn_info = { port: 40, speed: 3.20 }; info(`Connected to port {conn\_info.port} at {conn\_info.speed} Mb/s`);` |
| `options`? | [`LogOptions`](https://tauri.app/reference/javascript/log/#logoptions) | \-  |

#### [Returns](https://tauri.app/reference/javascript/log/#returns-4)

[Section titled “Returns”](https://tauri.app/reference/javascript/log/#returns-4)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`void`\>

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/log/guest-js/index.ts#L192](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/log/guest-js/index.ts#L192)

* * *

### [trace()](https://tauri.app/reference/javascript/log/#trace-1)

[Section titled “trace()”](https://tauri.app/reference/javascript/log/#trace-1)

    function trace(message, options?): Promise<void>

Logs a message at the trace level.

#### [Parameters](https://tauri.app/reference/javascript/log/#parameters-4)

[Section titled “Parameters”](https://tauri.app/reference/javascript/log/#parameters-4)

| Parameter | Type | Description |
| --- | --- | --- |
| `message` | `string` | \# Examples `import { trace } from '@tauri-apps/plugin-log'; let pos = { x: 3.234, y: -1.223 }; trace(`Position is: x: {pos.x}, y: {pos.y}`);` |
| `options`? | [`LogOptions`](https://tauri.app/reference/javascript/log/#logoptions) | \-  |

#### [Returns](https://tauri.app/reference/javascript/log/#returns-5)

[Section titled “Returns”](https://tauri.app/reference/javascript/log/#returns-5)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`void`\>

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/log/guest-js/index.ts#L236](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/log/guest-js/index.ts#L236)

* * *

### [warn()](https://tauri.app/reference/javascript/log/#warn-1)

[Section titled “warn()”](https://tauri.app/reference/javascript/log/#warn-1)

    function warn(message, options?): Promise<void>

Logs a message at the warn level.

#### [Parameters](https://tauri.app/reference/javascript/log/#parameters-5)

[Section titled “Parameters”](https://tauri.app/reference/javascript/log/#parameters-5)

| Parameter | Type | Description |
| --- | --- | --- |
| `message` | `string` | \# Examples `import { warn } from '@tauri-apps/plugin-log'; const warn_description = "Invalid Input"; warn(`Warning! {warn\_description}!`);` |
| `options`? | [`LogOptions`](https://tauri.app/reference/javascript/log/#logoptions) | \-  |

#### [Returns](https://tauri.app/reference/javascript/log/#returns-6)

[Section titled “Returns”](https://tauri.app/reference/javascript/log/#returns-6)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`void`\>

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/log/guest-js/index.ts#L170](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/log/guest-js/index.ts#L170)

* * *

[Support on Open Collective](https://opencollective.com/tauri)
 [Sponsor on GitHub](https://github.com/sponsors/tauri-apps)

© 2026 Tauri Contributors. CC-BY / MIT

---

# @tauri-apps/plugin-stronghold | Tauri

[Skip to content](https://tauri.app/reference/javascript/stronghold/#_top)

@tauri-apps/plugin-stronghold
=============================

[Classes](https://tauri.app/reference/javascript/stronghold/#classes)

----------------------------------------------------------------------

[Section titled “Classes”](https://tauri.app/reference/javascript/stronghold/#classes)

### [Client](https://tauri.app/reference/javascript/stronghold/#client)

[Section titled “Client”](https://tauri.app/reference/javascript/stronghold/#client)

#### [Constructors](https://tauri.app/reference/javascript/stronghold/#constructors)

[Section titled “Constructors”](https://tauri.app/reference/javascript/stronghold/#constructors)

##### [new Client()](https://tauri.app/reference/javascript/stronghold/#new-client)

[Section titled “new Client()”](https://tauri.app/reference/javascript/stronghold/#new-client)

    new Client(path, name): Client

###### [Parameters](https://tauri.app/reference/javascript/stronghold/#parameters)

[Section titled “Parameters”](https://tauri.app/reference/javascript/stronghold/#parameters)

| Parameter | Type |
| --- | --- |
| `path` | `string` |
| `name` | [`ClientPath`](https://tauri.app/reference/javascript/stronghold/#clientpath) |

###### [Returns](https://tauri.app/reference/javascript/stronghold/#returns)

[Section titled “Returns”](https://tauri.app/reference/javascript/stronghold/#returns)

[`Client`](https://tauri.app/reference/javascript/stronghold/#client)

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L265](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L265)

#### [Properties](https://tauri.app/reference/javascript/stronghold/#properties)

[Section titled “Properties”](https://tauri.app/reference/javascript/stronghold/#properties)

| Property | Type | Defined in |
| --- | --- | --- |
| `name` | [`ClientPath`](https://tauri.app/reference/javascript/stronghold/#clientpath) | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L263](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L263) |
| `path` | `string` | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L262](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L262) |

#### [Methods](https://tauri.app/reference/javascript/stronghold/#methods)

[Section titled “Methods”](https://tauri.app/reference/javascript/stronghold/#methods)

##### [getStore()](https://tauri.app/reference/javascript/stronghold/#getstore)

[Section titled “getStore()”](https://tauri.app/reference/javascript/stronghold/#getstore)

    getStore(): Store

###### [Returns](https://tauri.app/reference/javascript/stronghold/#returns-1)

[Section titled “Returns”](https://tauri.app/reference/javascript/stronghold/#returns-1)

[`Store`](https://tauri.app/reference/javascript/stronghold/#store)

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L280](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L280)

##### [getVault()](https://tauri.app/reference/javascript/stronghold/#getvault)

[Section titled “getVault()”](https://tauri.app/reference/javascript/stronghold/#getvault)

    getVault(name): Vault

Get a vault by name.

###### [Parameters](https://tauri.app/reference/javascript/stronghold/#parameters-1)

[Section titled “Parameters”](https://tauri.app/reference/javascript/stronghold/#parameters-1)

| Parameter | Type | Description |
| --- | --- | --- |
| `name` | [`VaultPath`](https://tauri.app/reference/javascript/stronghold/#vaultpath) |     |

###### [Returns](https://tauri.app/reference/javascript/stronghold/#returns-2)

[Section titled “Returns”](https://tauri.app/reference/javascript/stronghold/#returns-2)

[`Vault`](https://tauri.app/reference/javascript/stronghold/#vault)

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L276](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L276)

* * *

### [Location](https://tauri.app/reference/javascript/stronghold/#location)

[Section titled “Location”](https://tauri.app/reference/javascript/stronghold/#location)

#### [Constructors](https://tauri.app/reference/javascript/stronghold/#constructors-1)

[Section titled “Constructors”](https://tauri.app/reference/javascript/stronghold/#constructors-1)

##### [new Location()](https://tauri.app/reference/javascript/stronghold/#new-location)

[Section titled “new Location()”](https://tauri.app/reference/javascript/stronghold/#new-location)

    new Location(type, payload): Location

###### [Parameters](https://tauri.app/reference/javascript/stronghold/#parameters-2)

[Section titled “Parameters”](https://tauri.app/reference/javascript/stronghold/#parameters-2)

| Parameter | Type |
| --- | --- |
| `type` | `string` |
| `payload` | [`Record`](https://www.typescriptlang.org/docs/handbook/utility-types.html#recordkeys-type)<br><`string`, `unknown`\> |

###### [Returns](https://tauri.app/reference/javascript/stronghold/#returns-3)

[Section titled “Returns”](https://tauri.app/reference/javascript/stronghold/#returns-3)

[`Location`](https://tauri.app/reference/javascript/stronghold/#location)

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L86](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L86)

#### [Properties](https://tauri.app/reference/javascript/stronghold/#properties-1)

[Section titled “Properties”](https://tauri.app/reference/javascript/stronghold/#properties-1)

| Property | Type | Defined in |
| --- | --- | --- |
| `payload` | [`Record`](https://www.typescriptlang.org/docs/handbook/utility-types.html#recordkeys-type)<br><`string`, `unknown`\> | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L84](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L84) |
| `type` | `string` | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L83](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L83) |

#### [Methods](https://tauri.app/reference/javascript/stronghold/#methods-1)

[Section titled “Methods”](https://tauri.app/reference/javascript/stronghold/#methods-1)

##### [counter()](https://tauri.app/reference/javascript/stronghold/#counter)

[Section titled “counter()”](https://tauri.app/reference/javascript/stronghold/#counter)

    static counter(vault, counter): Location

###### [Parameters](https://tauri.app/reference/javascript/stronghold/#parameters-3)

[Section titled “Parameters”](https://tauri.app/reference/javascript/stronghold/#parameters-3)

| Parameter | Type |
| --- | --- |
| `vault` | [`VaultPath`](https://tauri.app/reference/javascript/stronghold/#vaultpath) |
| `counter` | `number` |

###### [Returns](https://tauri.app/reference/javascript/stronghold/#returns-4)

[Section titled “Returns”](https://tauri.app/reference/javascript/stronghold/#returns-4)

[`Location`](https://tauri.app/reference/javascript/stronghold/#location)

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L98](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L98)

##### [generic()](https://tauri.app/reference/javascript/stronghold/#generic)

[Section titled “generic()”](https://tauri.app/reference/javascript/stronghold/#generic)

    static generic(vault, record): Location

###### [Parameters](https://tauri.app/reference/javascript/stronghold/#parameters-4)

[Section titled “Parameters”](https://tauri.app/reference/javascript/stronghold/#parameters-4)

| Parameter | Type |
| --- | --- |
| `vault` | [`VaultPath`](https://tauri.app/reference/javascript/stronghold/#vaultpath) |
| `record` | [`RecordPath`](https://tauri.app/reference/javascript/stronghold/#recordpath) |

###### [Returns](https://tauri.app/reference/javascript/stronghold/#returns-5)

[Section titled “Returns”](https://tauri.app/reference/javascript/stronghold/#returns-5)

[`Location`](https://tauri.app/reference/javascript/stronghold/#location)

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L91](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L91)

* * *

### [Store](https://tauri.app/reference/javascript/stronghold/#store)

[Section titled “Store”](https://tauri.app/reference/javascript/stronghold/#store)

#### [Constructors](https://tauri.app/reference/javascript/stronghold/#constructors-2)

[Section titled “Constructors”](https://tauri.app/reference/javascript/stronghold/#constructors-2)

##### [new Store()](https://tauri.app/reference/javascript/stronghold/#new-store)

[Section titled “new Store()”](https://tauri.app/reference/javascript/stronghold/#new-store)

    new Store(path, client): Store

###### [Parameters](https://tauri.app/reference/javascript/stronghold/#parameters-5)

[Section titled “Parameters”](https://tauri.app/reference/javascript/stronghold/#parameters-5)

| Parameter | Type |
| --- | --- |
| `path` | `string` |
| `client` | [`ClientPath`](https://tauri.app/reference/javascript/stronghold/#clientpath) |

###### [Returns](https://tauri.app/reference/javascript/stronghold/#returns-6)

[Section titled “Returns”](https://tauri.app/reference/javascript/stronghold/#returns-6)

[`Store`](https://tauri.app/reference/javascript/stronghold/#store)

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L289](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L289)

#### [Properties](https://tauri.app/reference/javascript/stronghold/#properties-2)

[Section titled “Properties”](https://tauri.app/reference/javascript/stronghold/#properties-2)

| Property | Type | Defined in |
| --- | --- | --- |
| `client` | [`ClientPath`](https://tauri.app/reference/javascript/stronghold/#clientpath) | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L287](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L287) |
| `path` | `string` | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L286](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L286) |

#### [Methods](https://tauri.app/reference/javascript/stronghold/#methods-2)

[Section titled “Methods”](https://tauri.app/reference/javascript/stronghold/#methods-2)

##### [get()](https://tauri.app/reference/javascript/stronghold/#get)

[Section titled “get()”](https://tauri.app/reference/javascript/stronghold/#get)

    get(key): Promise<null | Uint8Array>

###### [Parameters](https://tauri.app/reference/javascript/stronghold/#parameters-6)

[Section titled “Parameters”](https://tauri.app/reference/javascript/stronghold/#parameters-6)

| Parameter | Type |
| --- | --- |
| `key` | [`StoreKey`](https://tauri.app/reference/javascript/stronghold/#storekey) |

###### [Returns](https://tauri.app/reference/javascript/stronghold/#returns-7)

[Section titled “Returns”](https://tauri.app/reference/javascript/stronghold/#returns-7)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`null` | [`Uint8Array`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Uint8Array)
\>

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L294](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L294)

##### [insert()](https://tauri.app/reference/javascript/stronghold/#insert)

[Section titled “insert()”](https://tauri.app/reference/javascript/stronghold/#insert)

    insert(   key,   value,lifetime?): Promise<void>

###### [Parameters](https://tauri.app/reference/javascript/stronghold/#parameters-7)

[Section titled “Parameters”](https://tauri.app/reference/javascript/stronghold/#parameters-7)

| Parameter | Type |
| --- | --- |
| `key` | [`StoreKey`](https://tauri.app/reference/javascript/stronghold/#storekey) |
| `value` | `number`\[\] |
| `lifetime`? | [`Duration`](https://tauri.app/reference/javascript/stronghold/#duration) |

###### [Returns](https://tauri.app/reference/javascript/stronghold/#returns-8)

[Section titled “Returns”](https://tauri.app/reference/javascript/stronghold/#returns-8)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`void`\>

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L302](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L302)

##### [remove()](https://tauri.app/reference/javascript/stronghold/#remove)

[Section titled “remove()”](https://tauri.app/reference/javascript/stronghold/#remove)

    remove(key): Promise<null | Uint8Array>

###### [Parameters](https://tauri.app/reference/javascript/stronghold/#parameters-8)

[Section titled “Parameters”](https://tauri.app/reference/javascript/stronghold/#parameters-8)

| Parameter | Type |
| --- | --- |
| `key` | [`StoreKey`](https://tauri.app/reference/javascript/stronghold/#storekey) |

###### [Returns](https://tauri.app/reference/javascript/stronghold/#returns-9)

[Section titled “Returns”](https://tauri.app/reference/javascript/stronghold/#returns-9)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`null` | [`Uint8Array`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Uint8Array)
\>

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L316](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L316)

* * *

### [Stronghold](https://tauri.app/reference/javascript/stronghold/#stronghold)

[Section titled “Stronghold”](https://tauri.app/reference/javascript/stronghold/#stronghold)

A representation of an access to a stronghold.

#### [Properties](https://tauri.app/reference/javascript/stronghold/#properties-3)

[Section titled “Properties”](https://tauri.app/reference/javascript/stronghold/#properties-3)

| Property | Type | Defined in |
| --- | --- | --- |
| `path` | `string` | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L388](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L388) |

#### [Methods](https://tauri.app/reference/javascript/stronghold/#methods-3)

[Section titled “Methods”](https://tauri.app/reference/javascript/stronghold/#methods-3)

##### [createClient()](https://tauri.app/reference/javascript/stronghold/#createclient)

[Section titled “createClient()”](https://tauri.app/reference/javascript/stronghold/#createclient)

    createClient(client): Promise<Client>

###### [Parameters](https://tauri.app/reference/javascript/stronghold/#parameters-9)

[Section titled “Parameters”](https://tauri.app/reference/javascript/stronghold/#parameters-9)

| Parameter | Type |
| --- | --- |
| `client` | [`ClientPath`](https://tauri.app/reference/javascript/stronghold/#clientpath) |

###### [Returns](https://tauri.app/reference/javascript/stronghold/#returns-10)

[Section titled “Returns”](https://tauri.app/reference/javascript/stronghold/#returns-10)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<[`Client`](https://tauri.app/reference/javascript/stronghold/#client)
\>

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L428](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L428)

##### [loadClient()](https://tauri.app/reference/javascript/stronghold/#loadclient)

[Section titled “loadClient()”](https://tauri.app/reference/javascript/stronghold/#loadclient)

    loadClient(client): Promise<Client>

###### [Parameters](https://tauri.app/reference/javascript/stronghold/#parameters-10)

[Section titled “Parameters”](https://tauri.app/reference/javascript/stronghold/#parameters-10)

| Parameter | Type |
| --- | --- |
| `client` | [`ClientPath`](https://tauri.app/reference/javascript/stronghold/#clientpath) |

###### [Returns](https://tauri.app/reference/javascript/stronghold/#returns-11)

[Section titled “Returns”](https://tauri.app/reference/javascript/stronghold/#returns-11)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<[`Client`](https://tauri.app/reference/javascript/stronghold/#client)
\>

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L421](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L421)

##### [save()](https://tauri.app/reference/javascript/stronghold/#save)

[Section titled “save()”](https://tauri.app/reference/javascript/stronghold/#save)

    save(): Promise<void>

Persists the stronghold state to the snapshot.

###### [Returns](https://tauri.app/reference/javascript/stronghold/#returns-12)

[Section titled “Returns”](https://tauri.app/reference/javascript/stronghold/#returns-12)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`void`\>

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L439](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L439)

##### [unload()](https://tauri.app/reference/javascript/stronghold/#unload)

[Section titled “unload()”](https://tauri.app/reference/javascript/stronghold/#unload)

    unload(): Promise<void>

Remove this instance from the cache.

###### [Returns](https://tauri.app/reference/javascript/stronghold/#returns-13)

[Section titled “Returns”](https://tauri.app/reference/javascript/stronghold/#returns-13)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`void`\>

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L415](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L415)

##### [load()](https://tauri.app/reference/javascript/stronghold/#load)

[Section titled “load()”](https://tauri.app/reference/javascript/stronghold/#load)

    static load(path, password): Promise<Stronghold>

Load the snapshot if it exists (password must match), or start a fresh stronghold instance otherwise.

###### [Parameters](https://tauri.app/reference/javascript/stronghold/#parameters-11)

[Section titled “Parameters”](https://tauri.app/reference/javascript/stronghold/#parameters-11)

| Parameter | Type | Description |
| --- | --- | --- |
| `path` | `string` | \-  |
| `password` | `string` |     |

###### [Returns](https://tauri.app/reference/javascript/stronghold/#returns-14)

[Section titled “Returns”](https://tauri.app/reference/javascript/stronghold/#returns-14)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<[`Stronghold`](https://tauri.app/reference/javascript/stronghold/#stronghold)
\>

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L405](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L405)

* * *

### [Vault](https://tauri.app/reference/javascript/stronghold/#vault)

[Section titled “Vault”](https://tauri.app/reference/javascript/stronghold/#vault)

A key-value storage that allows create, update and delete operations. It does not allow reading the data, so one of the procedures must be used to manipulate the stored data, allowing secure storage of secrets.

#### [Extends](https://tauri.app/reference/javascript/stronghold/#extends)

[Section titled “Extends”](https://tauri.app/reference/javascript/stronghold/#extends)

*   `ProcedureExecutor`

#### [Constructors](https://tauri.app/reference/javascript/stronghold/#constructors-3)

[Section titled “Constructors”](https://tauri.app/reference/javascript/stronghold/#constructors-3)

##### [new Vault()](https://tauri.app/reference/javascript/stronghold/#new-vault)

[Section titled “new Vault()”](https://tauri.app/reference/javascript/stronghold/#new-vault)

    new Vault(   path,   client,   name): Vault

###### [Parameters](https://tauri.app/reference/javascript/stronghold/#parameters-12)

[Section titled “Parameters”](https://tauri.app/reference/javascript/stronghold/#parameters-12)

| Parameter | Type |
| --- | --- |
| `path` | `string` |
| `client` | [`ClientPath`](https://tauri.app/reference/javascript/stronghold/#clientpath) |
| `name` | [`VaultPath`](https://tauri.app/reference/javascript/stronghold/#vaultpath) |

###### [Returns](https://tauri.app/reference/javascript/stronghold/#returns-15)

[Section titled “Returns”](https://tauri.app/reference/javascript/stronghold/#returns-15)

[`Vault`](https://tauri.app/reference/javascript/stronghold/#vault)

###### [Overrides](https://tauri.app/reference/javascript/stronghold/#overrides)

[Section titled “Overrides”](https://tauri.app/reference/javascript/stronghold/#overrides)

`ProcedureExecutor.constructor`

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L340](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L340)

#### [Properties](https://tauri.app/reference/javascript/stronghold/#properties-4)

[Section titled “Properties”](https://tauri.app/reference/javascript/stronghold/#properties-4)

| Property | Type | Description | Inherited from | Defined in |
| --- | --- | --- | --- | --- |
| `client` | [`ClientPath`](https://tauri.app/reference/javascript/stronghold/#clientpath) | \-  | \-  | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L336](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L336) |
| `name` | [`VaultPath`](https://tauri.app/reference/javascript/stronghold/#vaultpath) | The vault name. | \-  | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L338](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L338) |
| `path` | `string` | The vault path. | \-  | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L335](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L335) |
| `procedureArgs` | [`Record`](https://www.typescriptlang.org/docs/handbook/utility-types.html#recordkeys-type)<br><`string`, `unknown`\> | \-  | `ProcedureExecutor.procedureArgs` | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L107](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L107) |

#### [Methods](https://tauri.app/reference/javascript/stronghold/#methods-4)

[Section titled “Methods”](https://tauri.app/reference/javascript/stronghold/#methods-4)

##### [deriveSLIP10()](https://tauri.app/reference/javascript/stronghold/#deriveslip10)

[Section titled “deriveSLIP10()”](https://tauri.app/reference/javascript/stronghold/#deriveslip10)

    deriveSLIP10(   chain,   source,   sourceLocation,outputLocation): Promise<Uint8Array>

Derive a SLIP10 private key using a seed or key.

###### [Parameters](https://tauri.app/reference/javascript/stronghold/#parameters-13)

[Section titled “Parameters”](https://tauri.app/reference/javascript/stronghold/#parameters-13)

| Parameter | Type | Description |
| --- | --- | --- |
| `chain` | `number`\[\] | The chain path. |
| `source` | `"Seed"` \| `"Key"` | The source type, either ‘Seed’ or ‘Key’. |
| `sourceLocation` | [`Location`](https://tauri.app/reference/javascript/stronghold/#location) | The source location, must be the `outputLocation` of a previous call to `generateSLIP10Seed` or `deriveSLIP10`. |
| `outputLocation` | [`Location`](https://tauri.app/reference/javascript/stronghold/#location) | Location of the record where the private key will be stored. |

###### [Returns](https://tauri.app/reference/javascript/stronghold/#returns-16)

[Section titled “Returns”](https://tauri.app/reference/javascript/stronghold/#returns-16)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<[`Uint8Array`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Uint8Array)
\>

###### [Inherited from](https://tauri.app/reference/javascript/stronghold/#inherited-from)

[Section titled “Inherited from”](https://tauri.app/reference/javascript/stronghold/#inherited-from)

`ProcedureExecutor.deriveSLIP10`

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L145](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L145)

##### [generateBIP39()](https://tauri.app/reference/javascript/stronghold/#generatebip39)

[Section titled “generateBIP39()”](https://tauri.app/reference/javascript/stronghold/#generatebip39)

    generateBIP39(outputLocation, passphrase?): Promise<Uint8Array>

Generate a BIP39 seed.

###### [Parameters](https://tauri.app/reference/javascript/stronghold/#parameters-14)

[Section titled “Parameters”](https://tauri.app/reference/javascript/stronghold/#parameters-14)

| Parameter | Type | Description |
| --- | --- | --- |
| `outputLocation` | [`Location`](https://tauri.app/reference/javascript/stronghold/#location) | The location of the record where the BIP39 seed will be stored. |
| `passphrase`? | `string` | The optional mnemonic passphrase. |

###### [Returns](https://tauri.app/reference/javascript/stronghold/#returns-17)

[Section titled “Returns”](https://tauri.app/reference/javascript/stronghold/#returns-17)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<[`Uint8Array`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Uint8Array)
\>

###### [Inherited from](https://tauri.app/reference/javascript/stronghold/#inherited-from-1)

[Section titled “Inherited from”](https://tauri.app/reference/javascript/stronghold/#inherited-from-1)

`ProcedureExecutor.generateBIP39`

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L200](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L200)

##### [generateSLIP10Seed()](https://tauri.app/reference/javascript/stronghold/#generateslip10seed)

[Section titled “generateSLIP10Seed()”](https://tauri.app/reference/javascript/stronghold/#generateslip10seed)

    generateSLIP10Seed(outputLocation, sizeBytes?): Promise<Uint8Array>

Generate a SLIP10 seed for the given location.

###### [Parameters](https://tauri.app/reference/javascript/stronghold/#parameters-15)

[Section titled “Parameters”](https://tauri.app/reference/javascript/stronghold/#parameters-15)

| Parameter | Type | Description |
| --- | --- | --- |
| `outputLocation` | [`Location`](https://tauri.app/reference/javascript/stronghold/#location) | Location of the record where the seed will be stored. |
| `sizeBytes`? | `number` | The size in bytes of the SLIP10 seed. |

###### [Returns](https://tauri.app/reference/javascript/stronghold/#returns-18)

[Section titled “Returns”](https://tauri.app/reference/javascript/stronghold/#returns-18)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<[`Uint8Array`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Uint8Array)
\>

###### [Inherited from](https://tauri.app/reference/javascript/stronghold/#inherited-from-2)

[Section titled “Inherited from”](https://tauri.app/reference/javascript/stronghold/#inherited-from-2)

`ProcedureExecutor.generateSLIP10Seed`

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L120](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L120)

##### [getEd25519PublicKey()](https://tauri.app/reference/javascript/stronghold/#geted25519publickey)

[Section titled “getEd25519PublicKey()”](https://tauri.app/reference/javascript/stronghold/#geted25519publickey)

    getEd25519PublicKey(privateKeyLocation): Promise<Uint8Array>

Gets the Ed25519 public key of a SLIP10 private key.

###### [Parameters](https://tauri.app/reference/javascript/stronghold/#parameters-16)

[Section titled “Parameters”](https://tauri.app/reference/javascript/stronghold/#parameters-16)

| Parameter | Type | Description |
| --- | --- | --- |
| `privateKeyLocation` | [`Location`](https://tauri.app/reference/javascript/stronghold/#location) | The location of the private key. Must be the `outputLocation` of a previous call to `deriveSLIP10`. |

###### [Returns](https://tauri.app/reference/javascript/stronghold/#returns-19)

[Section titled “Returns”](https://tauri.app/reference/javascript/stronghold/#returns-19)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<[`Uint8Array`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Uint8Array)
\>

A promise resolving to the public key hex string.

###### [Since](https://tauri.app/reference/javascript/stronghold/#since)

[Section titled “Since”](https://tauri.app/reference/javascript/stronghold/#since)

2.0.0

###### [Inherited from](https://tauri.app/reference/javascript/stronghold/#inherited-from-3)

[Section titled “Inherited from”](https://tauri.app/reference/javascript/stronghold/#inherited-from-3)

`ProcedureExecutor.getEd25519PublicKey`

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L223](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L223)

##### [insert()](https://tauri.app/reference/javascript/stronghold/#insert-1)

[Section titled “insert()”](https://tauri.app/reference/javascript/stronghold/#insert-1)

    insert(recordPath, secret): Promise<void>

Insert a record to this vault.

###### [Parameters](https://tauri.app/reference/javascript/stronghold/#parameters-17)

[Section titled “Parameters”](https://tauri.app/reference/javascript/stronghold/#parameters-17)

| Parameter | Type |
| --- | --- |
| `recordPath` | [`RecordPath`](https://tauri.app/reference/javascript/stronghold/#recordpath) |
| `secret` | `number`\[\] |

###### [Returns](https://tauri.app/reference/javascript/stronghold/#returns-20)

[Section titled “Returns”](https://tauri.app/reference/javascript/stronghold/#returns-20)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`void`\>

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L358](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L358)

##### [recoverBIP39()](https://tauri.app/reference/javascript/stronghold/#recoverbip39)

[Section titled “recoverBIP39()”](https://tauri.app/reference/javascript/stronghold/#recoverbip39)

    recoverBIP39(   mnemonic,   outputLocation,passphrase?): Promise<Uint8Array>

Store a BIP39 mnemonic.

###### [Parameters](https://tauri.app/reference/javascript/stronghold/#parameters-18)

[Section titled “Parameters”](https://tauri.app/reference/javascript/stronghold/#parameters-18)

| Parameter | Type | Description |
| --- | --- | --- |
| `mnemonic` | `string` | The mnemonic string. |
| `outputLocation` | [`Location`](https://tauri.app/reference/javascript/stronghold/#location) | The location of the record where the BIP39 mnemonic will be stored. |
| `passphrase`? | `string` | The optional mnemonic passphrase. |

###### [Returns](https://tauri.app/reference/javascript/stronghold/#returns-21)

[Section titled “Returns”](https://tauri.app/reference/javascript/stronghold/#returns-21)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<[`Uint8Array`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Uint8Array)
\>

###### [Inherited from](https://tauri.app/reference/javascript/stronghold/#inherited-from-4)

[Section titled “Inherited from”](https://tauri.app/reference/javascript/stronghold/#inherited-from-4)

`ProcedureExecutor.recoverBIP39`

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L175](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L175)

##### [remove()](https://tauri.app/reference/javascript/stronghold/#remove-1)

[Section titled “remove()”](https://tauri.app/reference/javascript/stronghold/#remove-1)

    remove(location): Promise<void>

Remove a record from the vault.

###### [Parameters](https://tauri.app/reference/javascript/stronghold/#parameters-19)

[Section titled “Parameters”](https://tauri.app/reference/javascript/stronghold/#parameters-19)

| Parameter | Type | Description |
| --- | --- | --- |
| `location` | [`Location`](https://tauri.app/reference/javascript/stronghold/#location) | The record location. |

###### [Returns](https://tauri.app/reference/javascript/stronghold/#returns-22)

[Section titled “Returns”](https://tauri.app/reference/javascript/stronghold/#returns-22)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`void`\>

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L374](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L374)

##### [signEd25519()](https://tauri.app/reference/javascript/stronghold/#signed25519)

[Section titled “signEd25519()”](https://tauri.app/reference/javascript/stronghold/#signed25519)

    signEd25519(privateKeyLocation, msg): Promise<Uint8Array>

Creates a Ed25519 signature from a private key.

###### [Parameters](https://tauri.app/reference/javascript/stronghold/#parameters-20)

[Section titled “Parameters”](https://tauri.app/reference/javascript/stronghold/#parameters-20)

| Parameter | Type | Description |
| --- | --- | --- |
| `privateKeyLocation` | [`Location`](https://tauri.app/reference/javascript/stronghold/#location) | The location of the record where the private key is stored. Must be the `outputLocation` of a previous call to `deriveSLIP10`. |
| `msg` | `string` | The message to sign. |

###### [Returns](https://tauri.app/reference/javascript/stronghold/#returns-23)

[Section titled “Returns”](https://tauri.app/reference/javascript/stronghold/#returns-23)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<[`Uint8Array`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Uint8Array)
\>

A promise resolving to the signature hex string.

###### [Since](https://tauri.app/reference/javascript/stronghold/#since-1)

[Section titled “Since”](https://tauri.app/reference/javascript/stronghold/#since-1)

2.0.0

###### [Inherited from](https://tauri.app/reference/javascript/stronghold/#inherited-from-5)

[Section titled “Inherited from”](https://tauri.app/reference/javascript/stronghold/#inherited-from-5)

`ProcedureExecutor.signEd25519`

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L244](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L244)

[Interfaces](https://tauri.app/reference/javascript/stronghold/#interfaces)

----------------------------------------------------------------------------

[Section titled “Interfaces”](https://tauri.app/reference/javascript/stronghold/#interfaces)

### [AddressInfo](https://tauri.app/reference/javascript/stronghold/#addressinfo)

[Section titled “AddressInfo”](https://tauri.app/reference/javascript/stronghold/#addressinfo)

#### [Properties](https://tauri.app/reference/javascript/stronghold/#properties-5)

[Section titled “Properties”](https://tauri.app/reference/javascript/stronghold/#properties-5)

| Property | Type | Defined in |
| --- | --- | --- |
| `peers` | [`Map`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Map)<br><`string`, [`PeerAddress`](https://tauri.app/reference/javascript/stronghold/#peeraddress)<br>\> | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L43](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L43) |
| `relays` | `string`\[\] | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L44](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L44) |

* * *

### [ClientAccess](https://tauri.app/reference/javascript/stronghold/#clientaccess)

[Section titled “ClientAccess”](https://tauri.app/reference/javascript/stronghold/#clientaccess)

#### [Properties](https://tauri.app/reference/javascript/stronghold/#properties-6)

[Section titled “Properties”](https://tauri.app/reference/javascript/stronghold/#properties-6)

| Property | Type | Defined in |
| --- | --- | --- |
| `cloneVaultDefault?` | `boolean` | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L52](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L52) |
| `cloneVaultExceptions?` | [`Map`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Map)<br><[`VaultPath`](https://tauri.app/reference/javascript/stronghold/#vaultpath)<br>, `boolean`\> | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L53](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L53) |
| `readStore?` | `boolean` | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L54](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L54) |
| `useVaultDefault?` | `boolean` | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L48](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L48) |
| `useVaultExceptions?` | [`Map`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Map)<br><[`VaultPath`](https://tauri.app/reference/javascript/stronghold/#vaultpath)<br>, `boolean`\> | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L49](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L49) |
| `writeStore?` | `boolean` | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L55](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L55) |
| `writeVaultDefault?` | `boolean` | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L50](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L50) |
| `writeVaultExceptions?` | [`Map`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Map)<br><[`VaultPath`](https://tauri.app/reference/javascript/stronghold/#vaultpath)<br>, `boolean`\> | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L51](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L51) |

* * *

### [ConnectionLimits](https://tauri.app/reference/javascript/stronghold/#connectionlimits)

[Section titled “ConnectionLimits”](https://tauri.app/reference/javascript/stronghold/#connectionlimits)

#### [Properties](https://tauri.app/reference/javascript/stronghold/#properties-7)

[Section titled “Properties”](https://tauri.app/reference/javascript/stronghold/#properties-7)

| Property | Type | Defined in |
| --- | --- | --- |
| `maxEstablishedIncoming?` | `number` | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L31](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L31) |
| `maxEstablishedOutgoing?` | `number` | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L32](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L32) |
| `maxEstablishedPerPeer?` | `number` | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L33](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L33) |
| `maxEstablishedTotal?` | `number` | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L34](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L34) |
| `maxPendingIncoming?` | `number` | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L29](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L29) |
| `maxPendingOutgoing?` | `number` | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L30](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L30) |

* * *

### [Duration](https://tauri.app/reference/javascript/stronghold/#duration)

[Section titled “Duration”](https://tauri.app/reference/javascript/stronghold/#duration)

A duration definition.

#### [Properties](https://tauri.app/reference/javascript/stronghold/#properties-8)

[Section titled “Properties”](https://tauri.app/reference/javascript/stronghold/#properties-8)

| Property | Type | Description | Defined in |
| --- | --- | --- | --- |
| `nanos` | `number` | The fractional part of this Duration, in nanoseconds. Must be greater or equal to 0 and smaller than 1e+9 (the max number of nanoseoncds in a second) | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L79](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L79) |
| `secs` | `number` | The number of whole seconds contained by this Duration. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L77](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L77) |

* * *

### [NetworkConfig](https://tauri.app/reference/javascript/stronghold/#networkconfig)

[Section titled “NetworkConfig”](https://tauri.app/reference/javascript/stronghold/#networkconfig)

#### [Properties](https://tauri.app/reference/javascript/stronghold/#properties-9)

[Section titled “Properties”](https://tauri.app/reference/javascript/stronghold/#properties-9)

| Property | Type | Defined in |
| --- | --- | --- |
| `addresses?` | [`AddressInfo`](https://tauri.app/reference/javascript/stronghold/#addressinfo) | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L69](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L69) |
| `connectionTimeout?` | [`Duration`](https://tauri.app/reference/javascript/stronghold/#duration) | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L65](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L65) |
| `connectionsLimit?` | [`ConnectionLimits`](https://tauri.app/reference/javascript/stronghold/#connectionlimits) | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L66](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L66) |
| `enableMdns?` | `boolean` | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L67](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L67) |
| `enableRelay?` | `boolean` | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L68](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L68) |
| `peerPermissions?` | [`Map`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Map)<br><`string`, [`Permissions`](https://tauri.app/reference/javascript/stronghold/#permissions)<br>\> | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L70](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L70) |
| `permissionsDefault?` | [`Permissions`](https://tauri.app/reference/javascript/stronghold/#permissions) | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L71](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L71) |
| `requestTimeout?` | [`Duration`](https://tauri.app/reference/javascript/stronghold/#duration) | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L64](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L64) |

* * *

### [PeerAddress](https://tauri.app/reference/javascript/stronghold/#peeraddress)

[Section titled “PeerAddress”](https://tauri.app/reference/javascript/stronghold/#peeraddress)

#### [Properties](https://tauri.app/reference/javascript/stronghold/#properties-10)

[Section titled “Properties”](https://tauri.app/reference/javascript/stronghold/#properties-10)

| Property | Type | Defined in |
| --- | --- | --- |
| `known` | `string`\[\] | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L38](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L38) |
| `use_relay_fallback` | `boolean` | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L39](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L39) |

* * *

### [Permissions](https://tauri.app/reference/javascript/stronghold/#permissions)

[Section titled “Permissions”](https://tauri.app/reference/javascript/stronghold/#permissions)

#### [Properties](https://tauri.app/reference/javascript/stronghold/#properties-11)

[Section titled “Properties”](https://tauri.app/reference/javascript/stronghold/#properties-11)

| Property | Type | Defined in |
| --- | --- | --- |
| `default?` | [`ClientAccess`](https://tauri.app/reference/javascript/stronghold/#clientaccess) | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L59](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L59) |
| `exceptions?` | [`Map`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Map)<br><[`VaultPath`](https://tauri.app/reference/javascript/stronghold/#vaultpath)<br>, [`ClientAccess`](https://tauri.app/reference/javascript/stronghold/#clientaccess)<br>\> | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L60](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L60) |

[Type Aliases](https://tauri.app/reference/javascript/stronghold/#type-aliases)

--------------------------------------------------------------------------------

[Section titled “Type Aliases”](https://tauri.app/reference/javascript/stronghold/#type-aliases)

### [ClientPath](https://tauri.app/reference/javascript/stronghold/#clientpath)

[Section titled “ClientPath”](https://tauri.app/reference/javascript/stronghold/#clientpath)

    type ClientPath: string | Iterable<number> | ArrayLike<number> | ArrayBuffer;

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L7](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L7)

* * *

### [RecordPath](https://tauri.app/reference/javascript/stronghold/#recordpath)

[Section titled “RecordPath”](https://tauri.app/reference/javascript/stronghold/#recordpath)

    type RecordPath: string | Iterable<number> | ArrayLike<number> | ArrayBuffer;

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L17](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L17)

* * *

### [StoreKey](https://tauri.app/reference/javascript/stronghold/#storekey)

[Section titled “StoreKey”](https://tauri.app/reference/javascript/stronghold/#storekey)

    type StoreKey: string | Iterable<number> | ArrayLike<number> | ArrayBuffer;

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L22](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L22)

* * *

### [VaultPath](https://tauri.app/reference/javascript/stronghold/#vaultpath)

[Section titled “VaultPath”](https://tauri.app/reference/javascript/stronghold/#vaultpath)

    type VaultPath: string | Iterable<number> | ArrayLike<number> | ArrayBuffer;

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L12](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/stronghold/guest-js/index.ts#L12)

* * *

[Support on Open Collective](https://opencollective.com/tauri)
 [Sponsor on GitHub](https://github.com/sponsors/tauri-apps)

© 2026 Tauri Contributors. CC-BY / MIT

---

# @tauri-apps/plugin-store | Tauri

[Skip to content](https://tauri.app/reference/javascript/store/#_top)

@tauri-apps/plugin-store
========================

[Classes](https://tauri.app/reference/javascript/store/#classes)

-----------------------------------------------------------------

[Section titled “Classes”](https://tauri.app/reference/javascript/store/#classes)

### [LazyStore](https://tauri.app/reference/javascript/store/#lazystore)

[Section titled “LazyStore”](https://tauri.app/reference/javascript/store/#lazystore)

A lazy loaded key-value store persisted by the backend layer.

#### [Implements](https://tauri.app/reference/javascript/store/#implements)

[Section titled “Implements”](https://tauri.app/reference/javascript/store/#implements)

*   `IStore`

#### [Constructors](https://tauri.app/reference/javascript/store/#constructors)

[Section titled “Constructors”](https://tauri.app/reference/javascript/store/#constructors)

##### [new LazyStore()](https://tauri.app/reference/javascript/store/#new-lazystore)

[Section titled “new LazyStore()”](https://tauri.app/reference/javascript/store/#new-lazystore)

    new LazyStore(path, options?): LazyStore

Note that the options are not applied if someone else already created the store

###### [Parameters](https://tauri.app/reference/javascript/store/#parameters)

[Section titled “Parameters”](https://tauri.app/reference/javascript/store/#parameters)

| Parameter | Type | Description |
| --- | --- | --- |
| `path` | `string` | Path to save the store in `app_data_dir` |
| `options`? | [`StoreOptions`](https://tauri.app/reference/javascript/store/#storeoptions) | Store configuration options |

###### [Returns](https://tauri.app/reference/javascript/store/#returns)

[Section titled “Returns”](https://tauri.app/reference/javascript/store/#returns)

[`LazyStore`](https://tauri.app/reference/javascript/store/#lazystore)

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/store/guest-js/index.ts#L104](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/store/guest-js/index.ts#L104)

#### [Methods](https://tauri.app/reference/javascript/store/#methods)

[Section titled “Methods”](https://tauri.app/reference/javascript/store/#methods)

##### [clear()](https://tauri.app/reference/javascript/store/#clear)

[Section titled “clear()”](https://tauri.app/reference/javascript/store/#clear)

    clear(): Promise<void>

Clears the store, removing all key-value pairs.

Note: To clear the storage and reset it to its `default` value, use [`reset`](https://tauri.app/reference/javascript/store/#reset)
 instead.

###### [Returns](https://tauri.app/reference/javascript/store/#returns-1)

[Section titled “Returns”](https://tauri.app/reference/javascript/store/#returns-1)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`void`\>

###### [Implementation of](https://tauri.app/reference/javascript/store/#implementation-of)

[Section titled “Implementation of”](https://tauri.app/reference/javascript/store/#implementation-of)

`IStore.clear`

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/store/guest-js/index.ts#L132](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/store/guest-js/index.ts#L132)

##### [close()](https://tauri.app/reference/javascript/store/#close)

[Section titled “close()”](https://tauri.app/reference/javascript/store/#close)

    close(): Promise<void>

Close the store and cleans up this resource from memory. **You should not call any method on this object anymore and should drop any reference to it.**

###### [Returns](https://tauri.app/reference/javascript/store/#returns-2)

[Section titled “Returns”](https://tauri.app/reference/javascript/store/#returns-2)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`void`\>

###### [Implementation of](https://tauri.app/reference/javascript/store/#implementation-of-1)

[Section titled “Implementation of”](https://tauri.app/reference/javascript/store/#implementation-of-1)

`IStore.close`

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/store/guest-js/index.ts#L177](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/store/guest-js/index.ts#L177)

##### [delete()](https://tauri.app/reference/javascript/store/#delete)

[Section titled “delete()”](https://tauri.app/reference/javascript/store/#delete)

    delete(key): Promise<boolean>

Removes a key-value pair from the store.

###### [Parameters](https://tauri.app/reference/javascript/store/#parameters-1)

[Section titled “Parameters”](https://tauri.app/reference/javascript/store/#parameters-1)

| Parameter | Type | Description |
| --- | --- | --- |
| `key` | `string` |     |

###### [Returns](https://tauri.app/reference/javascript/store/#returns-3)

[Section titled “Returns”](https://tauri.app/reference/javascript/store/#returns-3)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`boolean`\>

###### [Implementation of](https://tauri.app/reference/javascript/store/#implementation-of-2)

[Section titled “Implementation of”](https://tauri.app/reference/javascript/store/#implementation-of-2)

`IStore.delete`

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/store/guest-js/index.ts#L128](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/store/guest-js/index.ts#L128)

##### [entries()](https://tauri.app/reference/javascript/store/#entries)

[Section titled “entries()”](https://tauri.app/reference/javascript/store/#entries)

    entries<T>(): Promise<[string, T][]>

Returns a list of all entries in the store.

###### [Type Parameters](https://tauri.app/reference/javascript/store/#type-parameters)

[Section titled “Type Parameters”](https://tauri.app/reference/javascript/store/#type-parameters)

| Type Parameter |
| --- |
| `T` |

###### [Returns](https://tauri.app/reference/javascript/store/#returns-4)

[Section titled “Returns”](https://tauri.app/reference/javascript/store/#returns-4)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<\[`string`, `T`\]\[\]>

###### [Implementation of](https://tauri.app/reference/javascript/store/#implementation-of-3)

[Section titled “Implementation of”](https://tauri.app/reference/javascript/store/#implementation-of-3)

`IStore.entries`

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/store/guest-js/index.ts#L148](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/store/guest-js/index.ts#L148)

##### [get()](https://tauri.app/reference/javascript/store/#get)

[Section titled “get()”](https://tauri.app/reference/javascript/store/#get)

    get<T>(key): Promise<undefined | T>

Returns the value for the given `key` or `undefined` if the key does not exist.

###### [Type Parameters](https://tauri.app/reference/javascript/store/#type-parameters-1)

[Section titled “Type Parameters”](https://tauri.app/reference/javascript/store/#type-parameters-1)

| Type Parameter |
| --- |
| `T` |

###### [Parameters](https://tauri.app/reference/javascript/store/#parameters-2)

[Section titled “Parameters”](https://tauri.app/reference/javascript/store/#parameters-2)

| Parameter | Type | Description |
| --- | --- | --- |
| `key` | `string` |     |

###### [Returns](https://tauri.app/reference/javascript/store/#returns-5)

[Section titled “Returns”](https://tauri.app/reference/javascript/store/#returns-5)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`undefined` | `T`\>

###### [Implementation of](https://tauri.app/reference/javascript/store/#implementation-of-4)

[Section titled “Implementation of”](https://tauri.app/reference/javascript/store/#implementation-of-4)

`IStore.get`

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/store/guest-js/index.ts#L120](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/store/guest-js/index.ts#L120)

##### [has()](https://tauri.app/reference/javascript/store/#has)

[Section titled “has()”](https://tauri.app/reference/javascript/store/#has)

    has(key): Promise<boolean>

Returns `true` if the given `key` exists in the store.

###### [Parameters](https://tauri.app/reference/javascript/store/#parameters-3)

[Section titled “Parameters”](https://tauri.app/reference/javascript/store/#parameters-3)

| Parameter | Type | Description |
| --- | --- | --- |
| `key` | `string` |     |

###### [Returns](https://tauri.app/reference/javascript/store/#returns-6)

[Section titled “Returns”](https://tauri.app/reference/javascript/store/#returns-6)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`boolean`\>

###### [Implementation of](https://tauri.app/reference/javascript/store/#implementation-of-5)

[Section titled “Implementation of”](https://tauri.app/reference/javascript/store/#implementation-of-5)

`IStore.has`

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/store/guest-js/index.ts#L124](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/store/guest-js/index.ts#L124)

##### [init()](https://tauri.app/reference/javascript/store/#init)

[Section titled “init()”](https://tauri.app/reference/javascript/store/#init)

    init(): Promise<void>

Init/load the store if it’s not loaded already

###### [Returns](https://tauri.app/reference/javascript/store/#returns-7)

[Section titled “Returns”](https://tauri.app/reference/javascript/store/#returns-7)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`void`\>

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/store/guest-js/index.ts#L112](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/store/guest-js/index.ts#L112)

##### [keys()](https://tauri.app/reference/javascript/store/#keys)

[Section titled “keys()”](https://tauri.app/reference/javascript/store/#keys)

    keys(): Promise<string[]>

Returns a list of all keys in the store.

###### [Returns](https://tauri.app/reference/javascript/store/#returns-8)

[Section titled “Returns”](https://tauri.app/reference/javascript/store/#returns-8)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`string`\[\]>

###### [Implementation of](https://tauri.app/reference/javascript/store/#implementation-of-6)

[Section titled “Implementation of”](https://tauri.app/reference/javascript/store/#implementation-of-6)

`IStore.keys`

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/store/guest-js/index.ts#L140](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/store/guest-js/index.ts#L140)

##### [length()](https://tauri.app/reference/javascript/store/#length)

[Section titled “length()”](https://tauri.app/reference/javascript/store/#length)

    length(): Promise<number>

Returns the number of key-value pairs in the store.

###### [Returns](https://tauri.app/reference/javascript/store/#returns-9)

[Section titled “Returns”](https://tauri.app/reference/javascript/store/#returns-9)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`number`\>

###### [Implementation of](https://tauri.app/reference/javascript/store/#implementation-of-7)

[Section titled “Implementation of”](https://tauri.app/reference/javascript/store/#implementation-of-7)

`IStore.length`

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/store/guest-js/index.ts#L152](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/store/guest-js/index.ts#L152)

##### [onChange()](https://tauri.app/reference/javascript/store/#onchange)

[Section titled “onChange()”](https://tauri.app/reference/javascript/store/#onchange)

    onChange<T>(cb): Promise<UnlistenFn>

Listen to changes on the store.

###### [Type Parameters](https://tauri.app/reference/javascript/store/#type-parameters-2)

[Section titled “Type Parameters”](https://tauri.app/reference/javascript/store/#type-parameters-2)

| Type Parameter |
| --- |
| `T` |

###### [Parameters](https://tauri.app/reference/javascript/store/#parameters-4)

[Section titled “Parameters”](https://tauri.app/reference/javascript/store/#parameters-4)

| Parameter | Type | Description |
| --- | --- | --- |
| `cb` | (`key`, `value`) => `void` |     |

###### [Returns](https://tauri.app/reference/javascript/store/#returns-10)

[Section titled “Returns”](https://tauri.app/reference/javascript/store/#returns-10)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`UnlistenFn`\>

A promise resolving to a function to unlisten to the event.

###### [Since](https://tauri.app/reference/javascript/store/#since)

[Section titled “Since”](https://tauri.app/reference/javascript/store/#since)

2.0.0

###### [Implementation of](https://tauri.app/reference/javascript/store/#implementation-of-8)

[Section titled “Implementation of”](https://tauri.app/reference/javascript/store/#implementation-of-8)

`IStore.onChange`

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/store/guest-js/index.ts#L171](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/store/guest-js/index.ts#L171)

##### [onKeyChange()](https://tauri.app/reference/javascript/store/#onkeychange)

[Section titled “onKeyChange()”](https://tauri.app/reference/javascript/store/#onkeychange)

    onKeyChange<T>(key, cb): Promise<UnlistenFn>

Listen to changes on a store key.

###### [Type Parameters](https://tauri.app/reference/javascript/store/#type-parameters-3)

[Section titled “Type Parameters”](https://tauri.app/reference/javascript/store/#type-parameters-3)

| Type Parameter |
| --- |
| `T` |

###### [Parameters](https://tauri.app/reference/javascript/store/#parameters-5)

[Section titled “Parameters”](https://tauri.app/reference/javascript/store/#parameters-5)

| Parameter | Type | Description |
| --- | --- | --- |
| `key` | `string` |     |
| `cb` | (`value`) => `void` |     |

###### [Returns](https://tauri.app/reference/javascript/store/#returns-11)

[Section titled “Returns”](https://tauri.app/reference/javascript/store/#returns-11)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`UnlistenFn`\>

A promise resolving to a function to unlisten to the event.

###### [Since](https://tauri.app/reference/javascript/store/#since-1)

[Section titled “Since”](https://tauri.app/reference/javascript/store/#since-1)

2.0.0

###### [Implementation of](https://tauri.app/reference/javascript/store/#implementation-of-9)

[Section titled “Implementation of”](https://tauri.app/reference/javascript/store/#implementation-of-9)

`IStore.onKeyChange`

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/store/guest-js/index.ts#L164](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/store/guest-js/index.ts#L164)

##### [reload()](https://tauri.app/reference/javascript/store/#reload)

[Section titled “reload()”](https://tauri.app/reference/javascript/store/#reload)

    reload(options?): Promise<void>

Attempts to load the on-disk state at the store’s `path` into memory.

This method is useful if the on-disk state was edited by the user and you want to synchronize the changes.

Note:

*   This method loads the data and merges it with the current store, this behavior will be changed to resetting to default first and then merging with the on-disk state in v3, to fully match the store with the on-disk state, set [`ignoreDefaults`](https://tauri.app/reference/javascript/store/#reloadoptions)
     to `true`
*   This method does not emit change events.

###### [Parameters](https://tauri.app/reference/javascript/store/#parameters-6)

[Section titled “Parameters”](https://tauri.app/reference/javascript/store/#parameters-6)

| Parameter | Type |
| --- | --- |
| `options`? | [`ReloadOptions`](https://tauri.app/reference/javascript/store/#reloadoptions) |

###### [Returns](https://tauri.app/reference/javascript/store/#returns-12)

[Section titled “Returns”](https://tauri.app/reference/javascript/store/#returns-12)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`void`\>

###### [Implementation of](https://tauri.app/reference/javascript/store/#implementation-of-10)

[Section titled “Implementation of”](https://tauri.app/reference/javascript/store/#implementation-of-10)

`IStore.reload`

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/store/guest-js/index.ts#L156](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/store/guest-js/index.ts#L156)

##### [reset()](https://tauri.app/reference/javascript/store/#reset)

[Section titled “reset()”](https://tauri.app/reference/javascript/store/#reset)

    reset(): Promise<void>

Resets the store to its `default` value.

If no default value has been set, this method behaves identical to [`clear`](https://tauri.app/reference/javascript/store/#clear)
.

###### [Returns](https://tauri.app/reference/javascript/store/#returns-13)

[Section titled “Returns”](https://tauri.app/reference/javascript/store/#returns-13)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`void`\>

###### [Implementation of](https://tauri.app/reference/javascript/store/#implementation-of-11)

[Section titled “Implementation of”](https://tauri.app/reference/javascript/store/#implementation-of-11)

`IStore.reset`

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/store/guest-js/index.ts#L136](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/store/guest-js/index.ts#L136)

##### [save()](https://tauri.app/reference/javascript/store/#save)

[Section titled “save()”](https://tauri.app/reference/javascript/store/#save)

    save(): Promise<void>

Saves the store to disk at the store’s `path`.

###### [Returns](https://tauri.app/reference/javascript/store/#returns-14)

[Section titled “Returns”](https://tauri.app/reference/javascript/store/#returns-14)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`void`\>

###### [Implementation of](https://tauri.app/reference/javascript/store/#implementation-of-12)

[Section titled “Implementation of”](https://tauri.app/reference/javascript/store/#implementation-of-12)

`IStore.save`

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/store/guest-js/index.ts#L160](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/store/guest-js/index.ts#L160)

##### [set()](https://tauri.app/reference/javascript/store/#set)

[Section titled “set()”](https://tauri.app/reference/javascript/store/#set)

    set(key, value): Promise<void>

Inserts a key-value pair into the store.

###### [Parameters](https://tauri.app/reference/javascript/store/#parameters-7)

[Section titled “Parameters”](https://tauri.app/reference/javascript/store/#parameters-7)

| Parameter | Type | Description |
| --- | --- | --- |
| `key` | `string` |     |
| `value` | `unknown` |     |

###### [Returns](https://tauri.app/reference/javascript/store/#returns-15)

[Section titled “Returns”](https://tauri.app/reference/javascript/store/#returns-15)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`void`\>

###### [Implementation of](https://tauri.app/reference/javascript/store/#implementation-of-13)

[Section titled “Implementation of”](https://tauri.app/reference/javascript/store/#implementation-of-13)

`IStore.set`

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/store/guest-js/index.ts#L116](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/store/guest-js/index.ts#L116)

##### [values()](https://tauri.app/reference/javascript/store/#values)

[Section titled “values()”](https://tauri.app/reference/javascript/store/#values)

    values<T>(): Promise<T[]>

Returns a list of all values in the store.

###### [Type Parameters](https://tauri.app/reference/javascript/store/#type-parameters-4)

[Section titled “Type Parameters”](https://tauri.app/reference/javascript/store/#type-parameters-4)

| Type Parameter |
| --- |
| `T` |

###### [Returns](https://tauri.app/reference/javascript/store/#returns-16)

[Section titled “Returns”](https://tauri.app/reference/javascript/store/#returns-16)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`T`\[\]>

###### [Implementation of](https://tauri.app/reference/javascript/store/#implementation-of-14)

[Section titled “Implementation of”](https://tauri.app/reference/javascript/store/#implementation-of-14)

`IStore.values`

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/store/guest-js/index.ts#L144](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/store/guest-js/index.ts#L144)

* * *

### [Store](https://tauri.app/reference/javascript/store/#store)

[Section titled “Store”](https://tauri.app/reference/javascript/store/#store)

A key-value store persisted by the backend layer.

#### [Extends](https://tauri.app/reference/javascript/store/#extends)

[Section titled “Extends”](https://tauri.app/reference/javascript/store/#extends)

*   `Resource`

#### [Implements](https://tauri.app/reference/javascript/store/#implements-1)

[Section titled “Implements”](https://tauri.app/reference/javascript/store/#implements-1)

*   `IStore`

#### [Accessors](https://tauri.app/reference/javascript/store/#accessors)

[Section titled “Accessors”](https://tauri.app/reference/javascript/store/#accessors)

##### [rid](https://tauri.app/reference/javascript/store/#rid)

[Section titled “rid”](https://tauri.app/reference/javascript/store/#rid)

    get rid(): number

###### [Returns](https://tauri.app/reference/javascript/store/#returns-17)

[Section titled “Returns”](https://tauri.app/reference/javascript/store/#returns-17)

`number`

###### [Inherited from](https://tauri.app/reference/javascript/store/#inherited-from)

[Section titled “Inherited from”](https://tauri.app/reference/javascript/store/#inherited-from)

`Resource.rid`

**Source**: undefined

#### [Methods](https://tauri.app/reference/javascript/store/#methods-1)

[Section titled “Methods”](https://tauri.app/reference/javascript/store/#methods-1)

##### [clear()](https://tauri.app/reference/javascript/store/#clear-1)

[Section titled “clear()”](https://tauri.app/reference/javascript/store/#clear-1)

    clear(): Promise<void>

Clears the store, removing all key-value pairs.

Note: To clear the storage and reset it to its `default` value, use [`reset`](https://tauri.app/reference/javascript/store/#reset-1)
 instead.

###### [Returns](https://tauri.app/reference/javascript/store/#returns-18)

[Section titled “Returns”](https://tauri.app/reference/javascript/store/#returns-18)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`void`\>

###### [Implementation of](https://tauri.app/reference/javascript/store/#implementation-of-15)

[Section titled “Implementation of”](https://tauri.app/reference/javascript/store/#implementation-of-15)

`IStore.clear`

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/store/guest-js/index.ts#L267](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/store/guest-js/index.ts#L267)

##### [close()](https://tauri.app/reference/javascript/store/#close-1)

[Section titled “close()”](https://tauri.app/reference/javascript/store/#close-1)

    close(): Promise<void>

Destroys and cleans up this resource from memory. **You should not call any method on this object anymore and should drop any reference to it.**

###### [Returns](https://tauri.app/reference/javascript/store/#returns-19)

[Section titled “Returns”](https://tauri.app/reference/javascript/store/#returns-19)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`void`\>

###### [Implementation of](https://tauri.app/reference/javascript/store/#implementation-of-16)

[Section titled “Implementation of”](https://tauri.app/reference/javascript/store/#implementation-of-16)

`IStore.close`

###### [Inherited from](https://tauri.app/reference/javascript/store/#inherited-from-1)

[Section titled “Inherited from”](https://tauri.app/reference/javascript/store/#inherited-from-1)

`Resource.close`

**Source**: undefined

##### [delete()](https://tauri.app/reference/javascript/store/#delete-1)

[Section titled “delete()”](https://tauri.app/reference/javascript/store/#delete-1)

    delete(key): Promise<boolean>

Removes a key-value pair from the store.

###### [Parameters](https://tauri.app/reference/javascript/store/#parameters-8)

[Section titled “Parameters”](https://tauri.app/reference/javascript/store/#parameters-8)

| Parameter | Type | Description |
| --- | --- | --- |
| `key` | `string` |     |

###### [Returns](https://tauri.app/reference/javascript/store/#returns-20)

[Section titled “Returns”](https://tauri.app/reference/javascript/store/#returns-20)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`boolean`\>

###### [Implementation of](https://tauri.app/reference/javascript/store/#implementation-of-17)

[Section titled “Implementation of”](https://tauri.app/reference/javascript/store/#implementation-of-17)

`IStore.delete`

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/store/guest-js/index.ts#L260](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/store/guest-js/index.ts#L260)

##### [entries()](https://tauri.app/reference/javascript/store/#entries-1)

[Section titled “entries()”](https://tauri.app/reference/javascript/store/#entries-1)

    entries<T>(): Promise<[string, T][]>

Returns a list of all entries in the store.

###### [Type Parameters](https://tauri.app/reference/javascript/store/#type-parameters-5)

[Section titled “Type Parameters”](https://tauri.app/reference/javascript/store/#type-parameters-5)

| Type Parameter |
| --- |
| `T` |

###### [Returns](https://tauri.app/reference/javascript/store/#returns-21)

[Section titled “Returns”](https://tauri.app/reference/javascript/store/#returns-21)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<\[`string`, `T`\]\[\]>

###### [Implementation of](https://tauri.app/reference/javascript/store/#implementation-of-18)

[Section titled “Implementation of”](https://tauri.app/reference/javascript/store/#implementation-of-18)

`IStore.entries`

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/store/guest-js/index.ts#L283](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/store/guest-js/index.ts#L283)

##### [get()](https://tauri.app/reference/javascript/store/#get-1)

[Section titled “get()”](https://tauri.app/reference/javascript/store/#get-1)

    get<T>(key): Promise<undefined | T>

Returns the value for the given `key` or `undefined` if the key does not exist.

###### [Type Parameters](https://tauri.app/reference/javascript/store/#type-parameters-6)

[Section titled “Type Parameters”](https://tauri.app/reference/javascript/store/#type-parameters-6)

| Type Parameter |
| --- |
| `T` |

###### [Parameters](https://tauri.app/reference/javascript/store/#parameters-9)

[Section titled “Parameters”](https://tauri.app/reference/javascript/store/#parameters-9)

| Parameter | Type | Description |
| --- | --- | --- |
| `key` | `string` |     |

###### [Returns](https://tauri.app/reference/javascript/store/#returns-22)

[Section titled “Returns”](https://tauri.app/reference/javascript/store/#returns-22)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`undefined` | `T`\>

###### [Implementation of](https://tauri.app/reference/javascript/store/#implementation-of-19)

[Section titled “Implementation of”](https://tauri.app/reference/javascript/store/#implementation-of-19)

`IStore.get`

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/store/guest-js/index.ts#L245](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/store/guest-js/index.ts#L245)

##### [has()](https://tauri.app/reference/javascript/store/#has-1)

[Section titled “has()”](https://tauri.app/reference/javascript/store/#has-1)

    has(key): Promise<boolean>

Returns `true` if the given `key` exists in the store.

###### [Parameters](https://tauri.app/reference/javascript/store/#parameters-10)

[Section titled “Parameters”](https://tauri.app/reference/javascript/store/#parameters-10)

| Parameter | Type | Description |
| --- | --- | --- |
| `key` | `string` |     |

###### [Returns](https://tauri.app/reference/javascript/store/#returns-23)

[Section titled “Returns”](https://tauri.app/reference/javascript/store/#returns-23)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`boolean`\>

###### [Implementation of](https://tauri.app/reference/javascript/store/#implementation-of-20)

[Section titled “Implementation of”](https://tauri.app/reference/javascript/store/#implementation-of-20)

`IStore.has`

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/store/guest-js/index.ts#L253](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/store/guest-js/index.ts#L253)

##### [keys()](https://tauri.app/reference/javascript/store/#keys-1)

[Section titled “keys()”](https://tauri.app/reference/javascript/store/#keys-1)

    keys(): Promise<string[]>

Returns a list of all keys in the store.

###### [Returns](https://tauri.app/reference/javascript/store/#returns-24)

[Section titled “Returns”](https://tauri.app/reference/javascript/store/#returns-24)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`string`\[\]>

###### [Implementation of](https://tauri.app/reference/javascript/store/#implementation-of-21)

[Section titled “Implementation of”](https://tauri.app/reference/javascript/store/#implementation-of-21)

`IStore.keys`

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/store/guest-js/index.ts#L275](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/store/guest-js/index.ts#L275)

##### [length()](https://tauri.app/reference/javascript/store/#length-1)

[Section titled “length()”](https://tauri.app/reference/javascript/store/#length-1)

    length(): Promise<number>

Returns the number of key-value pairs in the store.

###### [Returns](https://tauri.app/reference/javascript/store/#returns-25)

[Section titled “Returns”](https://tauri.app/reference/javascript/store/#returns-25)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`number`\>

###### [Implementation of](https://tauri.app/reference/javascript/store/#implementation-of-22)

[Section titled “Implementation of”](https://tauri.app/reference/javascript/store/#implementation-of-22)

`IStore.length`

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/store/guest-js/index.ts#L287](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/store/guest-js/index.ts#L287)

##### [onChange()](https://tauri.app/reference/javascript/store/#onchange-1)

[Section titled “onChange()”](https://tauri.app/reference/javascript/store/#onchange-1)

    onChange<T>(cb): Promise<UnlistenFn>

Listen to changes on the store.

###### [Type Parameters](https://tauri.app/reference/javascript/store/#type-parameters-7)

[Section titled “Type Parameters”](https://tauri.app/reference/javascript/store/#type-parameters-7)

| Type Parameter |
| --- |
| `T` |

###### [Parameters](https://tauri.app/reference/javascript/store/#parameters-11)

[Section titled “Parameters”](https://tauri.app/reference/javascript/store/#parameters-11)

| Parameter | Type | Description |
| --- | --- | --- |
| `cb` | (`key`, `value`) => `void` |     |

###### [Returns](https://tauri.app/reference/javascript/store/#returns-26)

[Section titled “Returns”](https://tauri.app/reference/javascript/store/#returns-26)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`UnlistenFn`\>

A promise resolving to a function to unlisten to the event.

###### [Since](https://tauri.app/reference/javascript/store/#since-2)

[Section titled “Since”](https://tauri.app/reference/javascript/store/#since-2)

2.0.0

###### [Implementation of](https://tauri.app/reference/javascript/store/#implementation-of-23)

[Section titled “Implementation of”](https://tauri.app/reference/javascript/store/#implementation-of-23)

`IStore.onChange`

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/store/guest-js/index.ts#L310](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/store/guest-js/index.ts#L310)

##### [onKeyChange()](https://tauri.app/reference/javascript/store/#onkeychange-1)

[Section titled “onKeyChange()”](https://tauri.app/reference/javascript/store/#onkeychange-1)

    onKeyChange<T>(key, cb): Promise<UnlistenFn>

Listen to changes on a store key.

###### [Type Parameters](https://tauri.app/reference/javascript/store/#type-parameters-8)

[Section titled “Type Parameters”](https://tauri.app/reference/javascript/store/#type-parameters-8)

| Type Parameter |
| --- |
| `T` |

###### [Parameters](https://tauri.app/reference/javascript/store/#parameters-12)

[Section titled “Parameters”](https://tauri.app/reference/javascript/store/#parameters-12)

| Parameter | Type | Description |
| --- | --- | --- |
| `key` | `string` |     |
| `cb` | (`value`) => `void` |     |

###### [Returns](https://tauri.app/reference/javascript/store/#returns-27)

[Section titled “Returns”](https://tauri.app/reference/javascript/store/#returns-27)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`UnlistenFn`\>

A promise resolving to a function to unlisten to the event.

###### [Since](https://tauri.app/reference/javascript/store/#since-3)

[Section titled “Since”](https://tauri.app/reference/javascript/store/#since-3)

2.0.0

###### [Implementation of](https://tauri.app/reference/javascript/store/#implementation-of-24)

[Section titled “Implementation of”](https://tauri.app/reference/javascript/store/#implementation-of-24)

`IStore.onKeyChange`

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/store/guest-js/index.ts#L299](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/store/guest-js/index.ts#L299)

##### [reload()](https://tauri.app/reference/javascript/store/#reload-1)

[Section titled “reload()”](https://tauri.app/reference/javascript/store/#reload-1)

    reload(options?): Promise<void>

Attempts to load the on-disk state at the store’s `path` into memory.

This method is useful if the on-disk state was edited by the user and you want to synchronize the changes.

Note:

*   This method loads the data and merges it with the current store, this behavior will be changed to resetting to default first and then merging with the on-disk state in v3, to fully match the store with the on-disk state, set [`ignoreDefaults`](https://tauri.app/reference/javascript/store/#reloadoptions)
     to `true`
*   This method does not emit change events.

###### [Parameters](https://tauri.app/reference/javascript/store/#parameters-13)

[Section titled “Parameters”](https://tauri.app/reference/javascript/store/#parameters-13)

| Parameter | Type |
| --- | --- |
| `options`? | [`ReloadOptions`](https://tauri.app/reference/javascript/store/#reloadoptions) |

###### [Returns](https://tauri.app/reference/javascript/store/#returns-28)

[Section titled “Returns”](https://tauri.app/reference/javascript/store/#returns-28)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`void`\>

###### [Implementation of](https://tauri.app/reference/javascript/store/#implementation-of-25)

[Section titled “Implementation of”](https://tauri.app/reference/javascript/store/#implementation-of-25)

`IStore.reload`

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/store/guest-js/index.ts#L291](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/store/guest-js/index.ts#L291)

##### [reset()](https://tauri.app/reference/javascript/store/#reset-1)

[Section titled “reset()”](https://tauri.app/reference/javascript/store/#reset-1)

    reset(): Promise<void>

Resets the store to its `default` value.

If no default value has been set, this method behaves identical to [`clear`](https://tauri.app/reference/javascript/store/#clear-1)
.

###### [Returns](https://tauri.app/reference/javascript/store/#returns-29)

[Section titled “Returns”](https://tauri.app/reference/javascript/store/#returns-29)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`void`\>

###### [Implementation of](https://tauri.app/reference/javascript/store/#implementation-of-26)

[Section titled “Implementation of”](https://tauri.app/reference/javascript/store/#implementation-of-26)

`IStore.reset`

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/store/guest-js/index.ts#L271](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/store/guest-js/index.ts#L271)

##### [save()](https://tauri.app/reference/javascript/store/#save-1)

[Section titled “save()”](https://tauri.app/reference/javascript/store/#save-1)

    save(): Promise<void>

Saves the store to disk at the store’s `path`.

###### [Returns](https://tauri.app/reference/javascript/store/#returns-30)

[Section titled “Returns”](https://tauri.app/reference/javascript/store/#returns-30)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`void`\>

###### [Implementation of](https://tauri.app/reference/javascript/store/#implementation-of-27)

[Section titled “Implementation of”](https://tauri.app/reference/javascript/store/#implementation-of-27)

`IStore.save`

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/store/guest-js/index.ts#L295](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/store/guest-js/index.ts#L295)

##### [set()](https://tauri.app/reference/javascript/store/#set-1)

[Section titled “set()”](https://tauri.app/reference/javascript/store/#set-1)

    set(key, value): Promise<void>

Inserts a key-value pair into the store.

###### [Parameters](https://tauri.app/reference/javascript/store/#parameters-14)

[Section titled “Parameters”](https://tauri.app/reference/javascript/store/#parameters-14)

| Parameter | Type | Description |
| --- | --- | --- |
| `key` | `string` |     |
| `value` | `unknown` |     |

###### [Returns](https://tauri.app/reference/javascript/store/#returns-31)

[Section titled “Returns”](https://tauri.app/reference/javascript/store/#returns-31)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`void`\>

###### [Implementation of](https://tauri.app/reference/javascript/store/#implementation-of-28)

[Section titled “Implementation of”](https://tauri.app/reference/javascript/store/#implementation-of-28)

`IStore.set`

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/store/guest-js/index.ts#L237](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/store/guest-js/index.ts#L237)

##### [values()](https://tauri.app/reference/javascript/store/#values-1)

[Section titled “values()”](https://tauri.app/reference/javascript/store/#values-1)

    values<T>(): Promise<T[]>

Returns a list of all values in the store.

###### [Type Parameters](https://tauri.app/reference/javascript/store/#type-parameters-9)

[Section titled “Type Parameters”](https://tauri.app/reference/javascript/store/#type-parameters-9)

| Type Parameter |
| --- |
| `T` |

###### [Returns](https://tauri.app/reference/javascript/store/#returns-32)

[Section titled “Returns”](https://tauri.app/reference/javascript/store/#returns-32)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`T`\[\]>

###### [Implementation of](https://tauri.app/reference/javascript/store/#implementation-of-29)

[Section titled “Implementation of”](https://tauri.app/reference/javascript/store/#implementation-of-29)

`IStore.values`

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/store/guest-js/index.ts#L279](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/store/guest-js/index.ts#L279)

##### [get()](https://tauri.app/reference/javascript/store/#get-2)

[Section titled “get()”](https://tauri.app/reference/javascript/store/#get-2)

    static get(path): Promise<null | Store>

Gets an already loaded store.

If the store is not loaded, returns `null`. In this case you must [load](https://tauri.app/reference/javascript/store/#load)
 it.

This function is more useful when you already know the store is loaded and just need to access its instance. Prefer [Store.load](https://tauri.app/reference/javascript/store/#load)
 otherwise.

###### [Parameters](https://tauri.app/reference/javascript/store/#parameters-15)

[Section titled “Parameters”](https://tauri.app/reference/javascript/store/#parameters-15)

| Parameter | Type | Description |
| --- | --- | --- |
| `path` | `string` | Path of the store. |

###### [Returns](https://tauri.app/reference/javascript/store/#returns-33)

[Section titled “Returns”](https://tauri.app/reference/javascript/store/#returns-33)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`null` | [`Store`](https://tauri.app/reference/javascript/store/#store)
\>

###### [Example](https://tauri.app/reference/javascript/store/#example)

[Section titled “Example”](https://tauri.app/reference/javascript/store/#example)

    import { Store } from '@tauri-apps/api/store';let store = await Store.get('store.json');if (!store) {  store = await Store.load('store.json');}

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/store/guest-js/index.ts#L231](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/store/guest-js/index.ts#L231)

##### [load()](https://tauri.app/reference/javascript/store/#load)

[Section titled “load()”](https://tauri.app/reference/javascript/store/#load)

    static load(path, options?): Promise<Store>

Create a new Store or load the existing store with the path.

###### [Parameters](https://tauri.app/reference/javascript/store/#parameters-16)

[Section titled “Parameters”](https://tauri.app/reference/javascript/store/#parameters-16)

| Parameter | Type | Description |
| --- | --- | --- |
| `path` | `string` | Path to save the store in `app_data_dir` |
| `options`? | [`StoreOptions`](https://tauri.app/reference/javascript/store/#storeoptions) | Store configuration options |

###### [Returns](https://tauri.app/reference/javascript/store/#returns-34)

[Section titled “Returns”](https://tauri.app/reference/javascript/store/#returns-34)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<[`Store`](https://tauri.app/reference/javascript/store/#store)
\>

###### [Example](https://tauri.app/reference/javascript/store/#example-1)

[Section titled “Example”](https://tauri.app/reference/javascript/store/#example-1)

    import { Store } from '@tauri-apps/api/store';const store = await Store.load('store.json');

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/store/guest-js/index.ts#L204](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/store/guest-js/index.ts#L204)

[Type Aliases](https://tauri.app/reference/javascript/store/#type-aliases)

---------------------------------------------------------------------------

[Section titled “Type Aliases”](https://tauri.app/reference/javascript/store/#type-aliases)

### [ReloadOptions](https://tauri.app/reference/javascript/store/#reloadoptions)

[Section titled “ReloadOptions”](https://tauri.app/reference/javascript/store/#reloadoptions)

    type ReloadOptions: object;

Options to IStore.reload a IStore

#### [Type declaration](https://tauri.app/reference/javascript/store/#type-declaration)

[Section titled “Type declaration”](https://tauri.app/reference/javascript/store/#type-declaration)

| Name | Type | Description | Defined in |
| --- | --- | --- | --- |
| `ignoreDefaults` | `boolean` | To fully match the store with the on-disk state, ignoring defaults | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/store/guest-js/index.ts#L461](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/store/guest-js/index.ts#L461) |

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/store/guest-js/index.ts#L457](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/store/guest-js/index.ts#L457)

* * *

### [StoreOptions](https://tauri.app/reference/javascript/store/#storeoptions)

[Section titled “StoreOptions”](https://tauri.app/reference/javascript/store/#storeoptions)

    type StoreOptions: object;

Options to create a store

#### [Type declaration](https://tauri.app/reference/javascript/store/#type-declaration-1)

[Section titled “Type declaration”](https://tauri.app/reference/javascript/store/#type-declaration-1)

| Name | Type | Description | Defined in |
| --- | --- | --- | --- |
| `autoSave` | `boolean` \| `number` | Auto save on modification with debounce duration in milliseconds, it’s 100ms by default, pass in `false` to disable it | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/store/guest-js/index.ts#L28](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/store/guest-js/index.ts#L28) |
| `createNew` | `boolean` | Force create a new store with default values even if it already exists. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/store/guest-js/index.ts#L40](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/store/guest-js/index.ts#L40) |
| `defaults` | `object` | Default value of the store | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/store/guest-js/index.ts#L24](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/store/guest-js/index.ts#L24) |
| `deserializeFnName` | `string` | Name of a deserialize function registered in the rust side plugin builder | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/store/guest-js/index.ts#L36](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/store/guest-js/index.ts#L36) |
| `overrideDefaults` | `boolean` | When creating the store, override the store with the on-disk state if it exists, ignoring defaults | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/store/guest-js/index.ts#L44](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/store/guest-js/index.ts#L44) |
| `serializeFnName` | `string` | Name of a serialize function registered in the rust side plugin builder | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/store/guest-js/index.ts#L32](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/store/guest-js/index.ts#L32) |

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/store/guest-js/index.ts#L20](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/store/guest-js/index.ts#L20)

[Functions](https://tauri.app/reference/javascript/store/#functions)

---------------------------------------------------------------------

[Section titled “Functions”](https://tauri.app/reference/javascript/store/#functions)

### [getStore()](https://tauri.app/reference/javascript/store/#getstore)

[Section titled “getStore()”](https://tauri.app/reference/javascript/store/#getstore)

    function getStore(path): Promise<Store | null>

Gets an already loaded store.

If the store is not loaded, returns `null`. In this case you must [load](https://tauri.app/reference/javascript/store/#load)
 it.

This function is more useful when you already know the store is loaded and just need to access its instance. Prefer [Store.load](https://tauri.app/reference/javascript/store/#load)
 otherwise.

#### [Parameters](https://tauri.app/reference/javascript/store/#parameters-17)

[Section titled “Parameters”](https://tauri.app/reference/javascript/store/#parameters-17)

| Parameter | Type | Description |
| --- | --- | --- |
| `path` | `string` | Path of the store. |

#### [Returns](https://tauri.app/reference/javascript/store/#returns-35)

[Section titled “Returns”](https://tauri.app/reference/javascript/store/#returns-35)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<[`Store`](https://tauri.app/reference/javascript/store/#store)
 | `null`\>

#### [Example](https://tauri.app/reference/javascript/store/#example-2)

[Section titled “Example”](https://tauri.app/reference/javascript/store/#example-2)

    import { getStore } from '@tauri-apps/api/store';const store = await getStore('store.json');

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/store/guest-js/index.ts#L82](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/store/guest-js/index.ts#L82)

* * *

### [load()](https://tauri.app/reference/javascript/store/#load-1)

[Section titled “load()”](https://tauri.app/reference/javascript/store/#load-1)

    function load(path, options?): Promise<Store>

Create a new Store or load the existing store with the path.

#### [Parameters](https://tauri.app/reference/javascript/store/#parameters-18)

[Section titled “Parameters”](https://tauri.app/reference/javascript/store/#parameters-18)

| Parameter | Type | Description |
| --- | --- | --- |
| `path` | `string` | Path to save the store in `app_data_dir` |
| `options`? | [`StoreOptions`](https://tauri.app/reference/javascript/store/#storeoptions) | Store configuration options |

#### [Returns](https://tauri.app/reference/javascript/store/#returns-36)

[Section titled “Returns”](https://tauri.app/reference/javascript/store/#returns-36)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<[`Store`](https://tauri.app/reference/javascript/store/#store)
\>

#### [Example](https://tauri.app/reference/javascript/store/#example-3)

[Section titled “Example”](https://tauri.app/reference/javascript/store/#example-3)

    import { Store } from '@tauri-apps/api/store';const store = await Store.load('store.json');

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/store/guest-js/index.ts#L59](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/store/guest-js/index.ts#L59)

* * *

[Support on Open Collective](https://opencollective.com/tauri)
 [Sponsor on GitHub](https://github.com/sponsors/tauri-apps)

© 2026 Tauri Contributors. CC-BY / MIT

---

# @tauri-apps/plugin-shell | Tauri

[Skip to content](https://tauri.app/reference/javascript/shell/#_top)

@tauri-apps/plugin-shell
========================

Access the system shell. Allows you to spawn child processes and manage files and URLs using their default application.

[Security](https://tauri.app/reference/javascript/shell/#security)

-------------------------------------------------------------------

[Section titled “Security”](https://tauri.app/reference/javascript/shell/#security)

This API has a scope configuration that forces you to restrict the programs and arguments that can be used.

### [Restricting access to the](https://tauri.app/reference/javascript/shell/#restricting-access-to-the-open-api)
 [`open`](https://tauri.app/reference/javascript/shell/#open)
 API

[Section titled “Restricting access to the open API”](https://tauri.app/reference/javascript/shell/#restricting-access-to-the-open-api)

On the configuration object, `open: true` means that the [open](https://tauri.app/reference/javascript/shell/#open)
 API can be used with any URL, as the argument is validated with the `^((mailto:\w+)|(tel:\w+)|(https?://\w+)).+` regex. You can change that regex by changing the boolean value to a string, e.g. `open: ^https://github.com/`.

### [Restricting access to the](https://tauri.app/reference/javascript/shell/#restricting-access-to-the-command-apis)
 [`Command`](https://tauri.app/reference/javascript/shell/#commando)
 APIs

[Section titled “Restricting access to the Command APIs”](https://tauri.app/reference/javascript/shell/#restricting-access-to-the-command-apis)

The plugin permissions object has a `scope` field that defines an array of CLIs that can be used. Each CLI is a configuration object `{ name: string, cmd: string, sidecar?: bool, args?: boolean | Arg[] }`.

*   `name`: the unique identifier of the command, passed to the [Command.create function](https://tauri.app/reference/javascript/shell/#create)
    . If it’s a sidecar, this must be the value defined on `tauri.conf.json > bundle > externalBin`.
*   `cmd`: the program that is executed on this configuration. If it’s a sidecar, this value is ignored.
*   `sidecar`: whether the object configures a sidecar or a system program.
*   `args`: the arguments that can be passed to the program. By default no arguments are allowed.
    *   `true` means that any argument list is allowed.
    *   `false` means that no arguments are allowed.
    *   otherwise an array can be configured. Each item is either a string representing the fixed argument value or a `{ validator: string }` that defines a regex validating the argument value.

#### [Example scope configuration](https://tauri.app/reference/javascript/shell/#example-scope-configuration)

[Section titled “Example scope configuration”](https://tauri.app/reference/javascript/shell/#example-scope-configuration)

CLI: `git commit -m "the commit message"`

Capability:

    {  "permissions": [    {      "identifier": "shell:allow-execute",      "allow": [        {          "name": "run-git-commit",          "cmd": "git",          "args": ["commit", "-m", { "validator": "\\S+" }]        }      ]    }  ]}

Usage:

    import { Command } from '@tauri-apps/plugin-shell'Command.create('run-git-commit', ['commit', '-m', 'the commit message'])

Trying to execute any API with a program not configured on the scope results in a promise rejection due to denied access.

[Classes](https://tauri.app/reference/javascript/shell/#classes)

-----------------------------------------------------------------

[Section titled “Classes”](https://tauri.app/reference/javascript/shell/#classes)

### [Child](https://tauri.app/reference/javascript/shell/#child)

[Section titled “Child”](https://tauri.app/reference/javascript/shell/#child)

#### [Since](https://tauri.app/reference/javascript/shell/#since)

[Section titled “Since”](https://tauri.app/reference/javascript/shell/#since)

2.0.0

#### [Constructors](https://tauri.app/reference/javascript/shell/#constructors)

[Section titled “Constructors”](https://tauri.app/reference/javascript/shell/#constructors)

##### [new Child()](https://tauri.app/reference/javascript/shell/#new-child)

[Section titled “new Child()”](https://tauri.app/reference/javascript/shell/#new-child)

    new Child(pid): Child

###### [Parameters](https://tauri.app/reference/javascript/shell/#parameters)

[Section titled “Parameters”](https://tauri.app/reference/javascript/shell/#parameters)

| Parameter | Type |
| --- | --- |
| `pid` | `number` |

###### [Returns](https://tauri.app/reference/javascript/shell/#returns)

[Section titled “Returns”](https://tauri.app/reference/javascript/shell/#returns)

[`Child`](https://tauri.app/reference/javascript/shell/#child)

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/shell/guest-js/index.ts#L301](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/shell/guest-js/index.ts#L301)

#### [Properties](https://tauri.app/reference/javascript/shell/#properties)

[Section titled “Properties”](https://tauri.app/reference/javascript/shell/#properties)

| Property | Type | Description | Defined in |
| --- | --- | --- | --- |
| `pid` | `number` | The child process `pid`. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/shell/guest-js/index.ts#L299](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/shell/guest-js/index.ts#L299) |

#### [Methods](https://tauri.app/reference/javascript/shell/#methods)

[Section titled “Methods”](https://tauri.app/reference/javascript/shell/#methods)

##### [kill()](https://tauri.app/reference/javascript/shell/#kill)

[Section titled “kill()”](https://tauri.app/reference/javascript/shell/#kill)

    kill(): Promise<void>

Kills the child process.

###### [Returns](https://tauri.app/reference/javascript/shell/#returns-1)

[Section titled “Returns”](https://tauri.app/reference/javascript/shell/#returns-1)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`void`\>

A promise indicating the success or failure of the operation.

###### [Since](https://tauri.app/reference/javascript/shell/#since-1)

[Section titled “Since”](https://tauri.app/reference/javascript/shell/#since-1)

2.0.0

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/shell/guest-js/index.ts#L336](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/shell/guest-js/index.ts#L336)

##### [write()](https://tauri.app/reference/javascript/shell/#write)

[Section titled “write()”](https://tauri.app/reference/javascript/shell/#write)

    write(data): Promise<void>

Writes `data` to the `stdin`.

###### [Parameters](https://tauri.app/reference/javascript/shell/#parameters-1)

[Section titled “Parameters”](https://tauri.app/reference/javascript/shell/#parameters-1)

| Parameter | Type | Description |
| --- | --- | --- |
| `data` | [`IOPayload`](https://tauri.app/reference/javascript/shell/#iopayload)<br> \| `number`\[\] | The message to write, either a string or a byte array. |

###### [Returns](https://tauri.app/reference/javascript/shell/#returns-2)

[Section titled “Returns”](https://tauri.app/reference/javascript/shell/#returns-2)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`void`\>

A promise indicating the success or failure of the operation.

###### [Example](https://tauri.app/reference/javascript/shell/#example)

[Section titled “Example”](https://tauri.app/reference/javascript/shell/#example)

    import { Command } from '@tauri-apps/plugin-shell';const command = Command.create('node');const child = await command.spawn();await child.write('message');await child.write([0, 1, 2, 3, 4, 5]);

###### [Since](https://tauri.app/reference/javascript/shell/#since-2)

[Section titled “Since”](https://tauri.app/reference/javascript/shell/#since-2)

2.0.0

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/shell/guest-js/index.ts#L322](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/shell/guest-js/index.ts#L322)

* * *

### [Command<O>](https://tauri.app/reference/javascript/shell/#commando)

[Section titled “Command<O>”](https://tauri.app/reference/javascript/shell/#commando)

The entry point for spawning child processes. It emits the `close` and `error` events.

#### [Example](https://tauri.app/reference/javascript/shell/#example-1)

[Section titled “Example”](https://tauri.app/reference/javascript/shell/#example-1)

    import { Command } from '@tauri-apps/plugin-shell';const command = Command.create('node');command.on('close', data => {  console.log(`command finished with code ${data.code} and signal ${data.signal}`)});command.on('error', error => console.error(`command error: "${error}"`));command.stdout.on('data', line => console.log(`command stdout: "${line}"`));command.stderr.on('data', line => console.log(`command stderr: "${line}"`));
    const child = await command.spawn();console.log('pid:', child.pid);

#### [Since](https://tauri.app/reference/javascript/shell/#since-3)

[Section titled “Since”](https://tauri.app/reference/javascript/shell/#since-3)

2.0.0

#### [Extends](https://tauri.app/reference/javascript/shell/#extends)

[Section titled “Extends”](https://tauri.app/reference/javascript/shell/#extends)

*   [`EventEmitter`](https://tauri.app/reference/javascript/shell/#eventemittere)
    <[`CommandEvents`](https://tauri.app/reference/javascript/shell/#commandevents)
    \>

#### [Type Parameters](https://tauri.app/reference/javascript/shell/#type-parameters)

[Section titled “Type Parameters”](https://tauri.app/reference/javascript/shell/#type-parameters)

| Type Parameter |
| --- |
| `O` _extends_ [`IOPayload`](https://tauri.app/reference/javascript/shell/#iopayload) |

#### [Properties](https://tauri.app/reference/javascript/shell/#properties-1)

[Section titled “Properties”](https://tauri.app/reference/javascript/shell/#properties-1)

| Property | Modifier | Type | Description | Defined in |
| --- | --- | --- | --- | --- |
| `stderr` | `readonly` | [`EventEmitter`](https://tauri.app/reference/javascript/shell/#eventemittere)<br><[`OutputEvents`](https://tauri.app/reference/javascript/shell/#outputeventso)<br><`O`\>> | Event emitter for the `stderr`. Emits the `data` event. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/shell/guest-js/index.ts#L384](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/shell/guest-js/index.ts#L384) |
| `stdout` | `readonly` | [`EventEmitter`](https://tauri.app/reference/javascript/shell/#eventemittere)<br><[`OutputEvents`](https://tauri.app/reference/javascript/shell/#outputeventso)<br><`O`\>> | Event emitter for the `stdout`. Emits the `data` event. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/shell/guest-js/index.ts#L382](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/shell/guest-js/index.ts#L382) |

#### [Methods](https://tauri.app/reference/javascript/shell/#methods-1)

[Section titled “Methods”](https://tauri.app/reference/javascript/shell/#methods-1)

##### [addListener()](https://tauri.app/reference/javascript/shell/#addlistener)

[Section titled “addListener()”](https://tauri.app/reference/javascript/shell/#addlistener)

    addListener<N>(eventName, listener): this

Alias for `emitter.on(eventName, listener)`.

###### [Type Parameters](https://tauri.app/reference/javascript/shell/#type-parameters-1)

[Section titled “Type Parameters”](https://tauri.app/reference/javascript/shell/#type-parameters-1)

| Type Parameter |
| --- |
| `N` _extends_ keyof [`CommandEvents`](https://tauri.app/reference/javascript/shell/#commandevents) |

###### [Parameters](https://tauri.app/reference/javascript/shell/#parameters-2)

[Section titled “Parameters”](https://tauri.app/reference/javascript/shell/#parameters-2)

| Parameter | Type |
| --- | --- |
| `eventName` | `N` |
| `listener` | (`arg`) => `void` |

###### [Returns](https://tauri.app/reference/javascript/shell/#returns-3)

[Section titled “Returns”](https://tauri.app/reference/javascript/shell/#returns-3)

`this`

###### [Since](https://tauri.app/reference/javascript/shell/#since-4)

[Section titled “Since”](https://tauri.app/reference/javascript/shell/#since-4)

2.0.0

###### [Inherited from](https://tauri.app/reference/javascript/shell/#inherited-from)

[Section titled “Inherited from”](https://tauri.app/reference/javascript/shell/#inherited-from)

[`EventEmitter`](https://tauri.app/reference/javascript/shell/#eventemittere)
.[`addListener`](https://tauri.app/reference/javascript/shell/#addlistener-1)

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/shell/guest-js/index.ts#L118](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/shell/guest-js/index.ts#L118)

##### [execute()](https://tauri.app/reference/javascript/shell/#execute)

[Section titled “execute()”](https://tauri.app/reference/javascript/shell/#execute)

    execute(): Promise<ChildProcess<O>>

Executes the command as a child process, waiting for it to finish and collecting all of its output.

###### [Returns](https://tauri.app/reference/javascript/shell/#returns-4)

[Section titled “Returns”](https://tauri.app/reference/javascript/shell/#returns-4)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<[`ChildProcess`](https://tauri.app/reference/javascript/shell/#childprocesso)
<`O`\>>

A promise resolving to the child process output.

###### [Example](https://tauri.app/reference/javascript/shell/#example-2)

[Section titled “Example”](https://tauri.app/reference/javascript/shell/#example-2)

    import { Command } from '@tauri-apps/plugin-shell';const output = await Command.create('echo', 'message').execute();assert(output.code === 0);assert(output.signal === null);assert(output.stdout === 'message');assert(output.stderr === '');

###### [Since](https://tauri.app/reference/javascript/shell/#since-5)

[Section titled “Since”](https://tauri.app/reference/javascript/shell/#since-5)

2.0.0

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/shell/guest-js/index.ts#L530](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/shell/guest-js/index.ts#L530)

##### [listenerCount()](https://tauri.app/reference/javascript/shell/#listenercount)

[Section titled “listenerCount()”](https://tauri.app/reference/javascript/shell/#listenercount)

    listenerCount<N>(eventName): number

Returns the number of listeners listening to the event named `eventName`.

###### [Type Parameters](https://tauri.app/reference/javascript/shell/#type-parameters-2)

[Section titled “Type Parameters”](https://tauri.app/reference/javascript/shell/#type-parameters-2)

| Type Parameter |
| --- |
| `N` _extends_ keyof [`CommandEvents`](https://tauri.app/reference/javascript/shell/#commandevents) |

###### [Parameters](https://tauri.app/reference/javascript/shell/#parameters-3)

[Section titled “Parameters”](https://tauri.app/reference/javascript/shell/#parameters-3)

| Parameter | Type |
| --- | --- |
| `eventName` | `N` |

###### [Returns](https://tauri.app/reference/javascript/shell/#returns-5)

[Section titled “Returns”](https://tauri.app/reference/javascript/shell/#returns-5)

`number`

###### [Since](https://tauri.app/reference/javascript/shell/#since-6)

[Section titled “Since”](https://tauri.app/reference/javascript/shell/#since-6)

2.0.0

###### [Inherited from](https://tauri.app/reference/javascript/shell/#inherited-from-1)

[Section titled “Inherited from”](https://tauri.app/reference/javascript/shell/#inherited-from-1)

[`EventEmitter`](https://tauri.app/reference/javascript/shell/#eventemittere)
.[`listenerCount`](https://tauri.app/reference/javascript/shell/#listenercount-1)

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/shell/guest-js/index.ts#L241](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/shell/guest-js/index.ts#L241)

##### [off()](https://tauri.app/reference/javascript/shell/#off)

[Section titled “off()”](https://tauri.app/reference/javascript/shell/#off)

    off<N>(eventName, listener): this

Removes the all specified listener from the listener array for the event eventName Returns a reference to the `EventEmitter`, so that calls can be chained.

###### [Type Parameters](https://tauri.app/reference/javascript/shell/#type-parameters-3)

[Section titled “Type Parameters”](https://tauri.app/reference/javascript/shell/#type-parameters-3)

| Type Parameter |
| --- |
| `N` _extends_ keyof [`CommandEvents`](https://tauri.app/reference/javascript/shell/#commandevents) |

###### [Parameters](https://tauri.app/reference/javascript/shell/#parameters-4)

[Section titled “Parameters”](https://tauri.app/reference/javascript/shell/#parameters-4)

| Parameter | Type |
| --- | --- |
| `eventName` | `N` |
| `listener` | (`arg`) => `void` |

###### [Returns](https://tauri.app/reference/javascript/shell/#returns-6)

[Section titled “Returns”](https://tauri.app/reference/javascript/shell/#returns-6)

`this`

###### [Since](https://tauri.app/reference/javascript/shell/#since-7)

[Section titled “Since”](https://tauri.app/reference/javascript/shell/#since-7)

2.0.0

###### [Inherited from](https://tauri.app/reference/javascript/shell/#inherited-from-2)

[Section titled “Inherited from”](https://tauri.app/reference/javascript/shell/#inherited-from-2)

[`EventEmitter`](https://tauri.app/reference/javascript/shell/#eventemittere)
.[`off`](https://tauri.app/reference/javascript/shell/#off-1)

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/shell/guest-js/index.ts#L186](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/shell/guest-js/index.ts#L186)

##### [on()](https://tauri.app/reference/javascript/shell/#on)

[Section titled “on()”](https://tauri.app/reference/javascript/shell/#on)

    on<N>(eventName, listener): this

Adds the `listener` function to the end of the listeners array for the event named `eventName`. No checks are made to see if the `listener` has already been added. Multiple calls passing the same combination of `eventName`and `listener` will result in the `listener` being added, and called, multiple times.

Returns a reference to the `EventEmitter`, so that calls can be chained.

###### [Type Parameters](https://tauri.app/reference/javascript/shell/#type-parameters-4)

[Section titled “Type Parameters”](https://tauri.app/reference/javascript/shell/#type-parameters-4)

| Type Parameter |
| --- |
| `N` _extends_ keyof [`CommandEvents`](https://tauri.app/reference/javascript/shell/#commandevents) |

###### [Parameters](https://tauri.app/reference/javascript/shell/#parameters-5)

[Section titled “Parameters”](https://tauri.app/reference/javascript/shell/#parameters-5)

| Parameter | Type |
| --- | --- |
| `eventName` | `N` |
| `listener` | (`arg`) => `void` |

###### [Returns](https://tauri.app/reference/javascript/shell/#returns-7)

[Section titled “Returns”](https://tauri.app/reference/javascript/shell/#returns-7)

`this`

###### [Since](https://tauri.app/reference/javascript/shell/#since-8)

[Section titled “Since”](https://tauri.app/reference/javascript/shell/#since-8)

2.0.0

###### [Inherited from](https://tauri.app/reference/javascript/shell/#inherited-from-3)

[Section titled “Inherited from”](https://tauri.app/reference/javascript/shell/#inherited-from-3)

[`EventEmitter`](https://tauri.app/reference/javascript/shell/#eventemittere)
.[`on`](https://tauri.app/reference/javascript/shell/#on-1)

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/shell/guest-js/index.ts#L147](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/shell/guest-js/index.ts#L147)

##### [once()](https://tauri.app/reference/javascript/shell/#once)

[Section titled “once()”](https://tauri.app/reference/javascript/shell/#once)

    once<N>(eventName, listener): this

Adds a **one-time**`listener` function for the event named `eventName`. The next time `eventName` is triggered, this listener is removed and then invoked.

Returns a reference to the `EventEmitter`, so that calls can be chained.

###### [Type Parameters](https://tauri.app/reference/javascript/shell/#type-parameters-5)

[Section titled “Type Parameters”](https://tauri.app/reference/javascript/shell/#type-parameters-5)

| Type Parameter |
| --- |
| `N` _extends_ keyof [`CommandEvents`](https://tauri.app/reference/javascript/shell/#commandevents) |

###### [Parameters](https://tauri.app/reference/javascript/shell/#parameters-6)

[Section titled “Parameters”](https://tauri.app/reference/javascript/shell/#parameters-6)

| Parameter | Type |
| --- | --- |
| `eventName` | `N` |
| `listener` | (`arg`) => `void` |

###### [Returns](https://tauri.app/reference/javascript/shell/#returns-8)

[Section titled “Returns”](https://tauri.app/reference/javascript/shell/#returns-8)

`this`

###### [Since](https://tauri.app/reference/javascript/shell/#since-9)

[Section titled “Since”](https://tauri.app/reference/javascript/shell/#since-9)

2.0.0

###### [Inherited from](https://tauri.app/reference/javascript/shell/#inherited-from-4)

[Section titled “Inherited from”](https://tauri.app/reference/javascript/shell/#inherited-from-4)

[`EventEmitter`](https://tauri.app/reference/javascript/shell/#eventemittere)
.[`once`](https://tauri.app/reference/javascript/shell/#once-1)

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/shell/guest-js/index.ts#L169](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/shell/guest-js/index.ts#L169)

##### [prependListener()](https://tauri.app/reference/javascript/shell/#prependlistener)

[Section titled “prependListener()”](https://tauri.app/reference/javascript/shell/#prependlistener)

    prependListener<N>(eventName, listener): this

Adds the `listener` function to the _beginning_ of the listeners array for the event named `eventName`. No checks are made to see if the `listener` has already been added. Multiple calls passing the same combination of `eventName`and `listener` will result in the `listener` being added, and called, multiple times.

Returns a reference to the `EventEmitter`, so that calls can be chained.

###### [Type Parameters](https://tauri.app/reference/javascript/shell/#type-parameters-6)

[Section titled “Type Parameters”](https://tauri.app/reference/javascript/shell/#type-parameters-6)

| Type Parameter |
| --- |
| `N` _extends_ keyof [`CommandEvents`](https://tauri.app/reference/javascript/shell/#commandevents) |

###### [Parameters](https://tauri.app/reference/javascript/shell/#parameters-7)

[Section titled “Parameters”](https://tauri.app/reference/javascript/shell/#parameters-7)

| Parameter | Type |
| --- | --- |
| `eventName` | `N` |
| `listener` | (`arg`) => `void` |

###### [Returns](https://tauri.app/reference/javascript/shell/#returns-9)

[Section titled “Returns”](https://tauri.app/reference/javascript/shell/#returns-9)

`this`

###### [Since](https://tauri.app/reference/javascript/shell/#since-10)

[Section titled “Since”](https://tauri.app/reference/javascript/shell/#since-10)

2.0.0

###### [Inherited from](https://tauri.app/reference/javascript/shell/#inherited-from-5)

[Section titled “Inherited from”](https://tauri.app/reference/javascript/shell/#inherited-from-5)

[`EventEmitter`](https://tauri.app/reference/javascript/shell/#eventemittere)
.[`prependListener`](https://tauri.app/reference/javascript/shell/#prependlistener-1)

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/shell/guest-js/index.ts#L258](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/shell/guest-js/index.ts#L258)

##### [prependOnceListener()](https://tauri.app/reference/javascript/shell/#prependoncelistener)

[Section titled “prependOnceListener()”](https://tauri.app/reference/javascript/shell/#prependoncelistener)

    prependOnceListener<N>(eventName, listener): this

Adds a **one-time**`listener` function for the event named `eventName` to the\_beginning\_ of the listeners array. The next time `eventName` is triggered, this listener is removed, and then invoked.

Returns a reference to the `EventEmitter`, so that calls can be chained.

###### [Type Parameters](https://tauri.app/reference/javascript/shell/#type-parameters-7)

[Section titled “Type Parameters”](https://tauri.app/reference/javascript/shell/#type-parameters-7)

| Type Parameter |
| --- |
| `N` _extends_ keyof [`CommandEvents`](https://tauri.app/reference/javascript/shell/#commandevents) |

###### [Parameters](https://tauri.app/reference/javascript/shell/#parameters-8)

[Section titled “Parameters”](https://tauri.app/reference/javascript/shell/#parameters-8)

| Parameter | Type |
| --- | --- |
| `eventName` | `N` |
| `listener` | (`arg`) => `void` |

###### [Returns](https://tauri.app/reference/javascript/shell/#returns-10)

[Section titled “Returns”](https://tauri.app/reference/javascript/shell/#returns-10)

`this`

###### [Since](https://tauri.app/reference/javascript/shell/#since-11)

[Section titled “Since”](https://tauri.app/reference/javascript/shell/#since-11)

2.0.0

###### [Inherited from](https://tauri.app/reference/javascript/shell/#inherited-from-6)

[Section titled “Inherited from”](https://tauri.app/reference/javascript/shell/#inherited-from-6)

[`EventEmitter`](https://tauri.app/reference/javascript/shell/#eventemittere)
.[`prependOnceListener`](https://tauri.app/reference/javascript/shell/#prependoncelistener-1)

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/shell/guest-js/index.ts#L280](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/shell/guest-js/index.ts#L280)

##### [removeAllListeners()](https://tauri.app/reference/javascript/shell/#removealllisteners)

[Section titled “removeAllListeners()”](https://tauri.app/reference/javascript/shell/#removealllisteners)

    removeAllListeners<N>(event?): this

Removes all listeners, or those of the specified eventName.

Returns a reference to the `EventEmitter`, so that calls can be chained.

###### [Type Parameters](https://tauri.app/reference/javascript/shell/#type-parameters-8)

[Section titled “Type Parameters”](https://tauri.app/reference/javascript/shell/#type-parameters-8)

| Type Parameter |
| --- |
| `N` _extends_ keyof [`CommandEvents`](https://tauri.app/reference/javascript/shell/#commandevents) |

###### [Parameters](https://tauri.app/reference/javascript/shell/#parameters-9)

[Section titled “Parameters”](https://tauri.app/reference/javascript/shell/#parameters-9)

| Parameter | Type |
| --- | --- |
| `event`? | `N` |

###### [Returns](https://tauri.app/reference/javascript/shell/#returns-11)

[Section titled “Returns”](https://tauri.app/reference/javascript/shell/#returns-11)

`this`

###### [Since](https://tauri.app/reference/javascript/shell/#since-12)

[Section titled “Since”](https://tauri.app/reference/javascript/shell/#since-12)

2.0.0

###### [Inherited from](https://tauri.app/reference/javascript/shell/#inherited-from-7)

[Section titled “Inherited from”](https://tauri.app/reference/javascript/shell/#inherited-from-7)

[`EventEmitter`](https://tauri.app/reference/javascript/shell/#eventemittere)
.[`removeAllListeners`](https://tauri.app/reference/javascript/shell/#removealllisteners-1)

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/shell/guest-js/index.ts#L206](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/shell/guest-js/index.ts#L206)

##### [removeListener()](https://tauri.app/reference/javascript/shell/#removelistener)

[Section titled “removeListener()”](https://tauri.app/reference/javascript/shell/#removelistener)

    removeListener<N>(eventName, listener): this

Alias for `emitter.off(eventName, listener)`.

###### [Type Parameters](https://tauri.app/reference/javascript/shell/#type-parameters-9)

[Section titled “Type Parameters”](https://tauri.app/reference/javascript/shell/#type-parameters-9)

| Type Parameter |
| --- |
| `N` _extends_ keyof [`CommandEvents`](https://tauri.app/reference/javascript/shell/#commandevents) |

###### [Parameters](https://tauri.app/reference/javascript/shell/#parameters-10)

[Section titled “Parameters”](https://tauri.app/reference/javascript/shell/#parameters-10)

| Parameter | Type |
| --- | --- |
| `eventName` | `N` |
| `listener` | (`arg`) => `void` |

###### [Returns](https://tauri.app/reference/javascript/shell/#returns-12)

[Section titled “Returns”](https://tauri.app/reference/javascript/shell/#returns-12)

`this`

###### [Since](https://tauri.app/reference/javascript/shell/#since-13)

[Section titled “Since”](https://tauri.app/reference/javascript/shell/#since-13)

2.0.0

###### [Inherited from](https://tauri.app/reference/javascript/shell/#inherited-from-8)

[Section titled “Inherited from”](https://tauri.app/reference/javascript/shell/#inherited-from-8)

[`EventEmitter`](https://tauri.app/reference/javascript/shell/#eventemittere)
.[`removeListener`](https://tauri.app/reference/javascript/shell/#removelistener-1)

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/shell/guest-js/index.ts#L130](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/shell/guest-js/index.ts#L130)

##### [spawn()](https://tauri.app/reference/javascript/shell/#spawn)

[Section titled “spawn()”](https://tauri.app/reference/javascript/shell/#spawn)

    spawn(): Promise<Child>

Executes the command as a child process, returning a handle to it.

###### [Returns](https://tauri.app/reference/javascript/shell/#returns-13)

[Section titled “Returns”](https://tauri.app/reference/javascript/shell/#returns-13)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<[`Child`](https://tauri.app/reference/javascript/shell/#child)
\>

A promise resolving to the child process handle.

###### [Since](https://tauri.app/reference/javascript/shell/#since-14)

[Section titled “Since”](https://tauri.app/reference/javascript/shell/#since-14)

2.0.0

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/shell/guest-js/index.ts#L479](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/shell/guest-js/index.ts#L479)

##### [create()](https://tauri.app/reference/javascript/shell/#create)

[Section titled “create()”](https://tauri.app/reference/javascript/shell/#create)

Creates a command to execute the given program.

###### [Example](https://tauri.app/reference/javascript/shell/#example-3)

[Section titled “Example”](https://tauri.app/reference/javascript/shell/#example-3)

    import { Command } from '@tauri-apps/plugin-shell';const command = Command.create('my-app', ['run', 'tauri']);const output = await command.execute();

###### [Param](https://tauri.app/reference/javascript/shell/#param)

[Section titled “Param”](https://tauri.app/reference/javascript/shell/#param)

The program to execute. It must be configured in your project’s capabilities.

###### [create(program, args)](https://tauri.app/reference/javascript/shell/#createprogram-args)

[Section titled “create(program, args)”](https://tauri.app/reference/javascript/shell/#createprogram-args)

    static create(program, args?): Command<string>

Creates a command to execute the given program.

###### [Parameters](https://tauri.app/reference/javascript/shell/#parameters-11)

[Section titled “Parameters”](https://tauri.app/reference/javascript/shell/#parameters-11)

| Parameter | Type |
| --- | --- |
| `program` | `string` |
| `args`? | `string` \| `string`\[\] |

###### [Returns](https://tauri.app/reference/javascript/shell/#returns-14)

[Section titled “Returns”](https://tauri.app/reference/javascript/shell/#returns-14)

[`Command`](https://tauri.app/reference/javascript/shell/#commando)
<`string`\>

###### [Example](https://tauri.app/reference/javascript/shell/#example-4)

[Section titled “Example”](https://tauri.app/reference/javascript/shell/#example-4)

    import { Command } from '@tauri-apps/plugin-shell';const command = Command.create('my-app', ['run', 'tauri']);const output = await command.execute();

###### [Param](https://tauri.app/reference/javascript/shell/#param-1)

[Section titled “Param”](https://tauri.app/reference/javascript/shell/#param-1)

The program to execute. It must be configured in your project’s capabilities.

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/shell/guest-js/index.ts#L406](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/shell/guest-js/index.ts#L406)

###### [create(program, args, options)](https://tauri.app/reference/javascript/shell/#createprogram-args-options)

[Section titled “create(program, args, options)”](https://tauri.app/reference/javascript/shell/#createprogram-args-options)

    static create(   program,   args?,options?): Command<Uint8Array>

Creates a command to execute the given program.

###### [Parameters](https://tauri.app/reference/javascript/shell/#parameters-12)

[Section titled “Parameters”](https://tauri.app/reference/javascript/shell/#parameters-12)

| Parameter | Type |
| --- | --- |
| `program` | `string` |
| `args`? | `string` \| `string`\[\] |
| `options`? | [`SpawnOptions`](https://tauri.app/reference/javascript/shell/#spawnoptions)<br> & `object` |

###### [Returns](https://tauri.app/reference/javascript/shell/#returns-15)

[Section titled “Returns”](https://tauri.app/reference/javascript/shell/#returns-15)

[`Command`](https://tauri.app/reference/javascript/shell/#commando)
<[`Uint8Array`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Uint8Array)
\>

###### [Example](https://tauri.app/reference/javascript/shell/#example-5)

[Section titled “Example”](https://tauri.app/reference/javascript/shell/#example-5)

    import { Command } from '@tauri-apps/plugin-shell';const command = Command.create('my-app', ['run', 'tauri']);const output = await command.execute();

###### [Param](https://tauri.app/reference/javascript/shell/#param-2)

[Section titled “Param”](https://tauri.app/reference/javascript/shell/#param-2)

The program to execute. It must be configured in your project’s capabilities.

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/shell/guest-js/index.ts#L407](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/shell/guest-js/index.ts#L407)

###### [create(program, args, options)](https://tauri.app/reference/javascript/shell/#createprogram-args-options-1)

[Section titled “create(program, args, options)”](https://tauri.app/reference/javascript/shell/#createprogram-args-options-1)

    static create(   program,   args?,options?): Command<string>

Creates a command to execute the given program.

###### [Parameters](https://tauri.app/reference/javascript/shell/#parameters-13)

[Section titled “Parameters”](https://tauri.app/reference/javascript/shell/#parameters-13)

| Parameter | Type |
| --- | --- |
| `program` | `string` |
| `args`? | `string` \| `string`\[\] |
| `options`? | [`SpawnOptions`](https://tauri.app/reference/javascript/shell/#spawnoptions) |

###### [Returns](https://tauri.app/reference/javascript/shell/#returns-16)

[Section titled “Returns”](https://tauri.app/reference/javascript/shell/#returns-16)

[`Command`](https://tauri.app/reference/javascript/shell/#commando)
<`string`\>

###### [Example](https://tauri.app/reference/javascript/shell/#example-6)

[Section titled “Example”](https://tauri.app/reference/javascript/shell/#example-6)

    import { Command } from '@tauri-apps/plugin-shell';const command = Command.create('my-app', ['run', 'tauri']);const output = await command.execute();

###### [Param](https://tauri.app/reference/javascript/shell/#param-3)

[Section titled “Param”](https://tauri.app/reference/javascript/shell/#param-3)

The program to execute. It must be configured in your project’s capabilities.

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/shell/guest-js/index.ts#L412](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/shell/guest-js/index.ts#L412)

##### [sidecar()](https://tauri.app/reference/javascript/shell/#sidecar)

[Section titled “sidecar()”](https://tauri.app/reference/javascript/shell/#sidecar)

Creates a command to execute the given sidecar program.

###### [Example](https://tauri.app/reference/javascript/shell/#example-7)

[Section titled “Example”](https://tauri.app/reference/javascript/shell/#example-7)

    import { Command } from '@tauri-apps/plugin-shell';const command = Command.sidecar('my-sidecar');const output = await command.execute();

###### [Param](https://tauri.app/reference/javascript/shell/#param-4)

[Section titled “Param”](https://tauri.app/reference/javascript/shell/#param-4)

The program to execute. It must be configured in your project’s capabilities.

###### [sidecar(program, args)](https://tauri.app/reference/javascript/shell/#sidecarprogram-args)

[Section titled “sidecar(program, args)”](https://tauri.app/reference/javascript/shell/#sidecarprogram-args)

    static sidecar(program, args?): Command<string>

Creates a command to execute the given sidecar program.

###### [Parameters](https://tauri.app/reference/javascript/shell/#parameters-14)

[Section titled “Parameters”](https://tauri.app/reference/javascript/shell/#parameters-14)

| Parameter | Type |
| --- | --- |
| `program` | `string` |
| `args`? | `string` \| `string`\[\] |

###### [Returns](https://tauri.app/reference/javascript/shell/#returns-17)

[Section titled “Returns”](https://tauri.app/reference/javascript/shell/#returns-17)

[`Command`](https://tauri.app/reference/javascript/shell/#commando)
<`string`\>

###### [Example](https://tauri.app/reference/javascript/shell/#example-8)

[Section titled “Example”](https://tauri.app/reference/javascript/shell/#example-8)

    import { Command } from '@tauri-apps/plugin-shell';const command = Command.sidecar('my-sidecar');const output = await command.execute();

###### [Param](https://tauri.app/reference/javascript/shell/#param-5)

[Section titled “Param”](https://tauri.app/reference/javascript/shell/#param-5)

The program to execute. It must be configured in your project’s capabilities.

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/shell/guest-js/index.ts#L438](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/shell/guest-js/index.ts#L438)

###### [sidecar(program, args, options)](https://tauri.app/reference/javascript/shell/#sidecarprogram-args-options)

[Section titled “sidecar(program, args, options)”](https://tauri.app/reference/javascript/shell/#sidecarprogram-args-options)

    static sidecar(   program,   args?,options?): Command<Uint8Array>

Creates a command to execute the given sidecar program.

###### [Parameters](https://tauri.app/reference/javascript/shell/#parameters-15)

[Section titled “Parameters”](https://tauri.app/reference/javascript/shell/#parameters-15)

| Parameter | Type |
| --- | --- |
| `program` | `string` |
| `args`? | `string` \| `string`\[\] |
| `options`? | [`SpawnOptions`](https://tauri.app/reference/javascript/shell/#spawnoptions)<br> & `object` |

###### [Returns](https://tauri.app/reference/javascript/shell/#returns-18)

[Section titled “Returns”](https://tauri.app/reference/javascript/shell/#returns-18)

[`Command`](https://tauri.app/reference/javascript/shell/#commando)
<[`Uint8Array`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Uint8Array)
\>

###### [Example](https://tauri.app/reference/javascript/shell/#example-9)

[Section titled “Example”](https://tauri.app/reference/javascript/shell/#example-9)

    import { Command } from '@tauri-apps/plugin-shell';const command = Command.sidecar('my-sidecar');const output = await command.execute();

###### [Param](https://tauri.app/reference/javascript/shell/#param-6)

[Section titled “Param”](https://tauri.app/reference/javascript/shell/#param-6)

The program to execute. It must be configured in your project’s capabilities.

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/shell/guest-js/index.ts#L439](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/shell/guest-js/index.ts#L439)

###### [sidecar(program, args, options)](https://tauri.app/reference/javascript/shell/#sidecarprogram-args-options-1)

[Section titled “sidecar(program, args, options)”](https://tauri.app/reference/javascript/shell/#sidecarprogram-args-options-1)

    static sidecar(   program,   args?,options?): Command<string>

Creates a command to execute the given sidecar program.

###### [Parameters](https://tauri.app/reference/javascript/shell/#parameters-16)

[Section titled “Parameters”](https://tauri.app/reference/javascript/shell/#parameters-16)

| Parameter | Type |
| --- | --- |
| `program` | `string` |
| `args`? | `string` \| `string`\[\] |
| `options`? | [`SpawnOptions`](https://tauri.app/reference/javascript/shell/#spawnoptions) |

###### [Returns](https://tauri.app/reference/javascript/shell/#returns-19)

[Section titled “Returns”](https://tauri.app/reference/javascript/shell/#returns-19)

[`Command`](https://tauri.app/reference/javascript/shell/#commando)
<`string`\>

###### [Example](https://tauri.app/reference/javascript/shell/#example-10)

[Section titled “Example”](https://tauri.app/reference/javascript/shell/#example-10)

    import { Command } from '@tauri-apps/plugin-shell';const command = Command.sidecar('my-sidecar');const output = await command.execute();

###### [Param](https://tauri.app/reference/javascript/shell/#param-7)

[Section titled “Param”](https://tauri.app/reference/javascript/shell/#param-7)

The program to execute. It must be configured in your project’s capabilities.

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/shell/guest-js/index.ts#L444](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/shell/guest-js/index.ts#L444)

* * *

### [EventEmitter<E>](https://tauri.app/reference/javascript/shell/#eventemittere)

[Section titled “EventEmitter<E>”](https://tauri.app/reference/javascript/shell/#eventemittere)

#### [Since](https://tauri.app/reference/javascript/shell/#since-15)

[Section titled “Since”](https://tauri.app/reference/javascript/shell/#since-15)

2.0.0

#### [Extended by](https://tauri.app/reference/javascript/shell/#extended-by)

[Section titled “Extended by”](https://tauri.app/reference/javascript/shell/#extended-by)

*   [`Command`](https://tauri.app/reference/javascript/shell/#commando)
    

#### [Type Parameters](https://tauri.app/reference/javascript/shell/#type-parameters-10)

[Section titled “Type Parameters”](https://tauri.app/reference/javascript/shell/#type-parameters-10)

| Type Parameter |
| --- |
| `E` _extends_ [`Record`](https://www.typescriptlang.org/docs/handbook/utility-types.html#recordkeys-type)<br><`string`, `any`\> |

#### [Constructors](https://tauri.app/reference/javascript/shell/#constructors-1)

[Section titled “Constructors”](https://tauri.app/reference/javascript/shell/#constructors-1)

##### [new EventEmitter()](https://tauri.app/reference/javascript/shell/#new-eventemitter)

[Section titled “new EventEmitter()”](https://tauri.app/reference/javascript/shell/#new-eventemitter)

    new EventEmitter<E>(): EventEmitter<E>

###### [Returns](https://tauri.app/reference/javascript/shell/#returns-20)

[Section titled “Returns”](https://tauri.app/reference/javascript/shell/#returns-20)

[`EventEmitter`](https://tauri.app/reference/javascript/shell/#eventemittere)
<`E`\>

#### [Methods](https://tauri.app/reference/javascript/shell/#methods-2)

[Section titled “Methods”](https://tauri.app/reference/javascript/shell/#methods-2)

##### [addListener()](https://tauri.app/reference/javascript/shell/#addlistener-1)

[Section titled “addListener()”](https://tauri.app/reference/javascript/shell/#addlistener-1)

    addListener<N>(eventName, listener): this

Alias for `emitter.on(eventName, listener)`.

###### [Type Parameters](https://tauri.app/reference/javascript/shell/#type-parameters-11)

[Section titled “Type Parameters”](https://tauri.app/reference/javascript/shell/#type-parameters-11)

| Type Parameter |
| --- |
| `N` _extends_ `string` \| `number` \| `symbol` |

###### [Parameters](https://tauri.app/reference/javascript/shell/#parameters-17)

[Section titled “Parameters”](https://tauri.app/reference/javascript/shell/#parameters-17)

| Parameter | Type |
| --- | --- |
| `eventName` | `N` |
| `listener` | (`arg`) => `void` |

###### [Returns](https://tauri.app/reference/javascript/shell/#returns-21)

[Section titled “Returns”](https://tauri.app/reference/javascript/shell/#returns-21)

`this`

###### [Since](https://tauri.app/reference/javascript/shell/#since-16)

[Section titled “Since”](https://tauri.app/reference/javascript/shell/#since-16)

2.0.0

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/shell/guest-js/index.ts#L118](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/shell/guest-js/index.ts#L118)

##### [listenerCount()](https://tauri.app/reference/javascript/shell/#listenercount-1)

[Section titled “listenerCount()”](https://tauri.app/reference/javascript/shell/#listenercount-1)

    listenerCount<N>(eventName): number

Returns the number of listeners listening to the event named `eventName`.

###### [Type Parameters](https://tauri.app/reference/javascript/shell/#type-parameters-12)

[Section titled “Type Parameters”](https://tauri.app/reference/javascript/shell/#type-parameters-12)

| Type Parameter |
| --- |
| `N` _extends_ `string` \| `number` \| `symbol` |

###### [Parameters](https://tauri.app/reference/javascript/shell/#parameters-18)

[Section titled “Parameters”](https://tauri.app/reference/javascript/shell/#parameters-18)

| Parameter | Type |
| --- | --- |
| `eventName` | `N` |

###### [Returns](https://tauri.app/reference/javascript/shell/#returns-22)

[Section titled “Returns”](https://tauri.app/reference/javascript/shell/#returns-22)

`number`

###### [Since](https://tauri.app/reference/javascript/shell/#since-17)

[Section titled “Since”](https://tauri.app/reference/javascript/shell/#since-17)

2.0.0

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/shell/guest-js/index.ts#L241](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/shell/guest-js/index.ts#L241)

##### [off()](https://tauri.app/reference/javascript/shell/#off-1)

[Section titled “off()”](https://tauri.app/reference/javascript/shell/#off-1)

    off<N>(eventName, listener): this

Removes the all specified listener from the listener array for the event eventName Returns a reference to the `EventEmitter`, so that calls can be chained.

###### [Type Parameters](https://tauri.app/reference/javascript/shell/#type-parameters-13)

[Section titled “Type Parameters”](https://tauri.app/reference/javascript/shell/#type-parameters-13)

| Type Parameter |
| --- |
| `N` _extends_ `string` \| `number` \| `symbol` |

###### [Parameters](https://tauri.app/reference/javascript/shell/#parameters-19)

[Section titled “Parameters”](https://tauri.app/reference/javascript/shell/#parameters-19)

| Parameter | Type |
| --- | --- |
| `eventName` | `N` |
| `listener` | (`arg`) => `void` |

###### [Returns](https://tauri.app/reference/javascript/shell/#returns-23)

[Section titled “Returns”](https://tauri.app/reference/javascript/shell/#returns-23)

`this`

###### [Since](https://tauri.app/reference/javascript/shell/#since-18)

[Section titled “Since”](https://tauri.app/reference/javascript/shell/#since-18)

2.0.0

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/shell/guest-js/index.ts#L186](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/shell/guest-js/index.ts#L186)

##### [on()](https://tauri.app/reference/javascript/shell/#on-1)

[Section titled “on()”](https://tauri.app/reference/javascript/shell/#on-1)

    on<N>(eventName, listener): this

Adds the `listener` function to the end of the listeners array for the event named `eventName`. No checks are made to see if the `listener` has already been added. Multiple calls passing the same combination of `eventName`and `listener` will result in the `listener` being added, and called, multiple times.

Returns a reference to the `EventEmitter`, so that calls can be chained.

###### [Type Parameters](https://tauri.app/reference/javascript/shell/#type-parameters-14)

[Section titled “Type Parameters”](https://tauri.app/reference/javascript/shell/#type-parameters-14)

| Type Parameter |
| --- |
| `N` _extends_ `string` \| `number` \| `symbol` |

###### [Parameters](https://tauri.app/reference/javascript/shell/#parameters-20)

[Section titled “Parameters”](https://tauri.app/reference/javascript/shell/#parameters-20)

| Parameter | Type |
| --- | --- |
| `eventName` | `N` |
| `listener` | (`arg`) => `void` |

###### [Returns](https://tauri.app/reference/javascript/shell/#returns-24)

[Section titled “Returns”](https://tauri.app/reference/javascript/shell/#returns-24)

`this`

###### [Since](https://tauri.app/reference/javascript/shell/#since-19)

[Section titled “Since”](https://tauri.app/reference/javascript/shell/#since-19)

2.0.0

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/shell/guest-js/index.ts#L147](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/shell/guest-js/index.ts#L147)

##### [once()](https://tauri.app/reference/javascript/shell/#once-1)

[Section titled “once()”](https://tauri.app/reference/javascript/shell/#once-1)

    once<N>(eventName, listener): this

Adds a **one-time**`listener` function for the event named `eventName`. The next time `eventName` is triggered, this listener is removed and then invoked.

Returns a reference to the `EventEmitter`, so that calls can be chained.

###### [Type Parameters](https://tauri.app/reference/javascript/shell/#type-parameters-15)

[Section titled “Type Parameters”](https://tauri.app/reference/javascript/shell/#type-parameters-15)

| Type Parameter |
| --- |
| `N` _extends_ `string` \| `number` \| `symbol` |

###### [Parameters](https://tauri.app/reference/javascript/shell/#parameters-21)

[Section titled “Parameters”](https://tauri.app/reference/javascript/shell/#parameters-21)

| Parameter | Type |
| --- | --- |
| `eventName` | `N` |
| `listener` | (`arg`) => `void` |

###### [Returns](https://tauri.app/reference/javascript/shell/#returns-25)

[Section titled “Returns”](https://tauri.app/reference/javascript/shell/#returns-25)

`this`

###### [Since](https://tauri.app/reference/javascript/shell/#since-20)

[Section titled “Since”](https://tauri.app/reference/javascript/shell/#since-20)

2.0.0

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/shell/guest-js/index.ts#L169](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/shell/guest-js/index.ts#L169)

##### [prependListener()](https://tauri.app/reference/javascript/shell/#prependlistener-1)

[Section titled “prependListener()”](https://tauri.app/reference/javascript/shell/#prependlistener-1)

    prependListener<N>(eventName, listener): this

Adds the `listener` function to the _beginning_ of the listeners array for the event named `eventName`. No checks are made to see if the `listener` has already been added. Multiple calls passing the same combination of `eventName`and `listener` will result in the `listener` being added, and called, multiple times.

Returns a reference to the `EventEmitter`, so that calls can be chained.

###### [Type Parameters](https://tauri.app/reference/javascript/shell/#type-parameters-16)

[Section titled “Type Parameters”](https://tauri.app/reference/javascript/shell/#type-parameters-16)

| Type Parameter |
| --- |
| `N` _extends_ `string` \| `number` \| `symbol` |

###### [Parameters](https://tauri.app/reference/javascript/shell/#parameters-22)

[Section titled “Parameters”](https://tauri.app/reference/javascript/shell/#parameters-22)

| Parameter | Type |
| --- | --- |
| `eventName` | `N` |
| `listener` | (`arg`) => `void` |

###### [Returns](https://tauri.app/reference/javascript/shell/#returns-26)

[Section titled “Returns”](https://tauri.app/reference/javascript/shell/#returns-26)

`this`

###### [Since](https://tauri.app/reference/javascript/shell/#since-21)

[Section titled “Since”](https://tauri.app/reference/javascript/shell/#since-21)

2.0.0

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/shell/guest-js/index.ts#L258](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/shell/guest-js/index.ts#L258)

##### [prependOnceListener()](https://tauri.app/reference/javascript/shell/#prependoncelistener-1)

[Section titled “prependOnceListener()”](https://tauri.app/reference/javascript/shell/#prependoncelistener-1)

    prependOnceListener<N>(eventName, listener): this

Adds a **one-time**`listener` function for the event named `eventName` to the\_beginning\_ of the listeners array. The next time `eventName` is triggered, this listener is removed, and then invoked.

Returns a reference to the `EventEmitter`, so that calls can be chained.

###### [Type Parameters](https://tauri.app/reference/javascript/shell/#type-parameters-17)

[Section titled “Type Parameters”](https://tauri.app/reference/javascript/shell/#type-parameters-17)

| Type Parameter |
| --- |
| `N` _extends_ `string` \| `number` \| `symbol` |

###### [Parameters](https://tauri.app/reference/javascript/shell/#parameters-23)

[Section titled “Parameters”](https://tauri.app/reference/javascript/shell/#parameters-23)

| Parameter | Type |
| --- | --- |
| `eventName` | `N` |
| `listener` | (`arg`) => `void` |

###### [Returns](https://tauri.app/reference/javascript/shell/#returns-27)

[Section titled “Returns”](https://tauri.app/reference/javascript/shell/#returns-27)

`this`

###### [Since](https://tauri.app/reference/javascript/shell/#since-22)

[Section titled “Since”](https://tauri.app/reference/javascript/shell/#since-22)

2.0.0

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/shell/guest-js/index.ts#L280](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/shell/guest-js/index.ts#L280)

##### [removeAllListeners()](https://tauri.app/reference/javascript/shell/#removealllisteners-1)

[Section titled “removeAllListeners()”](https://tauri.app/reference/javascript/shell/#removealllisteners-1)

    removeAllListeners<N>(event?): this

Removes all listeners, or those of the specified eventName.

Returns a reference to the `EventEmitter`, so that calls can be chained.

###### [Type Parameters](https://tauri.app/reference/javascript/shell/#type-parameters-18)

[Section titled “Type Parameters”](https://tauri.app/reference/javascript/shell/#type-parameters-18)

| Type Parameter |
| --- |
| `N` _extends_ `string` \| `number` \| `symbol` |

###### [Parameters](https://tauri.app/reference/javascript/shell/#parameters-24)

[Section titled “Parameters”](https://tauri.app/reference/javascript/shell/#parameters-24)

| Parameter | Type |
| --- | --- |
| `event`? | `N` |

###### [Returns](https://tauri.app/reference/javascript/shell/#returns-28)

[Section titled “Returns”](https://tauri.app/reference/javascript/shell/#returns-28)

`this`

###### [Since](https://tauri.app/reference/javascript/shell/#since-23)

[Section titled “Since”](https://tauri.app/reference/javascript/shell/#since-23)

2.0.0

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/shell/guest-js/index.ts#L206](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/shell/guest-js/index.ts#L206)

##### [removeListener()](https://tauri.app/reference/javascript/shell/#removelistener-1)

[Section titled “removeListener()”](https://tauri.app/reference/javascript/shell/#removelistener-1)

    removeListener<N>(eventName, listener): this

Alias for `emitter.off(eventName, listener)`.

###### [Type Parameters](https://tauri.app/reference/javascript/shell/#type-parameters-19)

[Section titled “Type Parameters”](https://tauri.app/reference/javascript/shell/#type-parameters-19)

| Type Parameter |
| --- |
| `N` _extends_ `string` \| `number` \| `symbol` |

###### [Parameters](https://tauri.app/reference/javascript/shell/#parameters-25)

[Section titled “Parameters”](https://tauri.app/reference/javascript/shell/#parameters-25)

| Parameter | Type |
| --- | --- |
| `eventName` | `N` |
| `listener` | (`arg`) => `void` |

###### [Returns](https://tauri.app/reference/javascript/shell/#returns-29)

[Section titled “Returns”](https://tauri.app/reference/javascript/shell/#returns-29)

`this`

###### [Since](https://tauri.app/reference/javascript/shell/#since-24)

[Section titled “Since”](https://tauri.app/reference/javascript/shell/#since-24)

2.0.0

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/shell/guest-js/index.ts#L130](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/shell/guest-js/index.ts#L130)

[Interfaces](https://tauri.app/reference/javascript/shell/#interfaces)

-----------------------------------------------------------------------

[Section titled “Interfaces”](https://tauri.app/reference/javascript/shell/#interfaces)

### [ChildProcess<O>](https://tauri.app/reference/javascript/shell/#childprocesso)

[Section titled “ChildProcess<O>”](https://tauri.app/reference/javascript/shell/#childprocesso)

#### [Since](https://tauri.app/reference/javascript/shell/#since-25)

[Section titled “Since”](https://tauri.app/reference/javascript/shell/#since-25)

2.0.0

#### [Type Parameters](https://tauri.app/reference/javascript/shell/#type-parameters-20)

[Section titled “Type Parameters”](https://tauri.app/reference/javascript/shell/#type-parameters-20)

| Type Parameter |
| --- |
| `O` _extends_ [`IOPayload`](https://tauri.app/reference/javascript/shell/#iopayload) |

#### [Properties](https://tauri.app/reference/javascript/shell/#properties-2)

[Section titled “Properties”](https://tauri.app/reference/javascript/shell/#properties-2)

| Property | Type | Description | Defined in |
| --- | --- | --- | --- |
| `code` | `null` \| `number` | Exit code of the process. `null` if the process was terminated by a signal on Unix. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/shell/guest-js/index.ts#L94](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/shell/guest-js/index.ts#L94) |
| `signal` | `null` \| `number` | If the process was terminated by a signal, represents that signal. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/shell/guest-js/index.ts#L96](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/shell/guest-js/index.ts#L96) |
| `stderr` | `O` | The data that the process wrote to `stderr`. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/shell/guest-js/index.ts#L100](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/shell/guest-js/index.ts#L100) |
| `stdout` | `O` | The data that the process wrote to `stdout`. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/shell/guest-js/index.ts#L98](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/shell/guest-js/index.ts#L98) |

* * *

### [CommandEvents](https://tauri.app/reference/javascript/shell/#commandevents)

[Section titled “CommandEvents”](https://tauri.app/reference/javascript/shell/#commandevents)

#### [Properties](https://tauri.app/reference/javascript/shell/#properties-3)

[Section titled “Properties”](https://tauri.app/reference/javascript/shell/#properties-3)

| Property | Type | Defined in |
| --- | --- | --- |
| `close` | [`TerminatedPayload`](https://tauri.app/reference/javascript/shell/#terminatedpayload) | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/shell/guest-js/index.ts#L345](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/shell/guest-js/index.ts#L345) |
| `error` | `string` | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/shell/guest-js/index.ts#L346](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/shell/guest-js/index.ts#L346) |

* * *

### [OutputEvents<O>](https://tauri.app/reference/javascript/shell/#outputeventso)

[Section titled “OutputEvents<O>”](https://tauri.app/reference/javascript/shell/#outputeventso)

#### [Type Parameters](https://tauri.app/reference/javascript/shell/#type-parameters-21)

[Section titled “Type Parameters”](https://tauri.app/reference/javascript/shell/#type-parameters-21)

| Type Parameter |
| --- |
| `O` _extends_ [`IOPayload`](https://tauri.app/reference/javascript/shell/#iopayload) |

#### [Properties](https://tauri.app/reference/javascript/shell/#properties-4)

[Section titled “Properties”](https://tauri.app/reference/javascript/shell/#properties-4)

| Property | Type | Defined in |
| --- | --- | --- |
| `data` | `O` | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/shell/guest-js/index.ts#L350](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/shell/guest-js/index.ts#L350) |

* * *

### [SpawnOptions](https://tauri.app/reference/javascript/shell/#spawnoptions)

[Section titled “SpawnOptions”](https://tauri.app/reference/javascript/shell/#spawnoptions)

#### [Since](https://tauri.app/reference/javascript/shell/#since-26)

[Section titled “Since”](https://tauri.app/reference/javascript/shell/#since-26)

2.0.0

#### [Properties](https://tauri.app/reference/javascript/shell/#properties-5)

[Section titled “Properties”](https://tauri.app/reference/javascript/shell/#properties-5)

| Property | Type | Description | Defined in |
| --- | --- | --- | --- |
| `cwd?` | `string` | Current working directory. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/shell/guest-js/index.ts#L73](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/shell/guest-js/index.ts#L73) |
| `encoding?` | `string` | Character encoding for stdout/stderr **Since** 2.0.0 | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/shell/guest-js/index.ts#L81](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/shell/guest-js/index.ts#L81) |
| `env?` | [`Record`](https://www.typescriptlang.org/docs/handbook/utility-types.html#recordkeys-type)<br><`string`, `string`\> | Environment variables. set to `null` to clear the process env. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/shell/guest-js/index.ts#L75](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/shell/guest-js/index.ts#L75) |

* * *

### [TerminatedPayload](https://tauri.app/reference/javascript/shell/#terminatedpayload)

[Section titled “TerminatedPayload”](https://tauri.app/reference/javascript/shell/#terminatedpayload)

Payload for the `Terminated` command event.

#### [Properties](https://tauri.app/reference/javascript/shell/#properties-6)

[Section titled “Properties”](https://tauri.app/reference/javascript/shell/#properties-6)

| Property | Type | Description | Defined in |
| --- | --- | --- | --- |
| `code` | `null` \| `number` | Exit code of the process. `null` if the process was terminated by a signal on Unix. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/shell/guest-js/index.ts#L560](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/shell/guest-js/index.ts#L560) |
| `signal` | `null` \| `number` | If the process was terminated by a signal, represents that signal. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/shell/guest-js/index.ts#L562](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/shell/guest-js/index.ts#L562) |

[Type Aliases](https://tauri.app/reference/javascript/shell/#type-aliases)

---------------------------------------------------------------------------

[Section titled “Type Aliases”](https://tauri.app/reference/javascript/shell/#type-aliases)

### [IOPayload](https://tauri.app/reference/javascript/shell/#iopayload)

[Section titled “IOPayload”](https://tauri.app/reference/javascript/shell/#iopayload)

    type IOPayload: string | Uint8Array;

Event payload type

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/shell/guest-js/index.ts#L566](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/shell/guest-js/index.ts#L566)

[Functions](https://tauri.app/reference/javascript/shell/#functions)

---------------------------------------------------------------------

[Section titled “Functions”](https://tauri.app/reference/javascript/shell/#functions)

### [open()](https://tauri.app/reference/javascript/shell/#open)

[Section titled “open()”](https://tauri.app/reference/javascript/shell/#open)

    function open(path, openWith?): Promise<void>

Opens a path or URL with the system’s default app, or the one specified with `openWith`.

The `openWith` value must be one of `firefox`, `google chrome`, `chromium` `safari`, `open`, `start`, `xdg-open`, `gio`, `gnome-open`, `kde-open` or `wslview`.

#### [Parameters](https://tauri.app/reference/javascript/shell/#parameters-26)

[Section titled “Parameters”](https://tauri.app/reference/javascript/shell/#parameters-26)

| Parameter | Type | Description |
| --- | --- | --- |
| `path` | `string` | The path or URL to open. This value is matched against the string regex defined on `tauri.conf.json > plugins > shell > open`, which defaults to \`^((mailto:\\w+) |
| `openWith`? | `string` | The app to open the file or URL with. Defaults to the system default application for the specified path type. |

#### [Returns](https://tauri.app/reference/javascript/shell/#returns-30)

[Section titled “Returns”](https://tauri.app/reference/javascript/shell/#returns-30)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`void`\>

#### [Example](https://tauri.app/reference/javascript/shell/#example-11)

[Section titled “Example”](https://tauri.app/reference/javascript/shell/#example-11)

    import { open } from '@tauri-apps/plugin-shell';// opens the given URL on the default browser:await open('https://github.com/tauri-apps/tauri');// opens the given URL using `firefox`:await open('https://github.com/tauri-apps/tauri', 'firefox');// opens a file using the default program:await open('/path/to/file');

#### [Since](https://tauri.app/reference/javascript/shell/#since-27)

[Section titled “Since”](https://tauri.app/reference/javascript/shell/#since-27)

2.0.0

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/shell/guest-js/index.ts#L601](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/shell/guest-js/index.ts#L601)

* * *

[Support on Open Collective](https://opencollective.com/tauri)
 [Sponsor on GitHub](https://github.com/sponsors/tauri-apps)

© 2026 Tauri Contributors. CC-BY / MIT

---

# @tauri-apps/plugin-notification | Tauri

[Skip to content](https://tauri.app/reference/javascript/notification/#_top)

@tauri-apps/plugin-notification
===============================

Send toast notifications (brief auto-expiring OS window element) to your user. Can also be used with the Notification Web API.

[Enumerations](https://tauri.app/reference/javascript/notification/#enumerations)

----------------------------------------------------------------------------------

[Section titled “Enumerations”](https://tauri.app/reference/javascript/notification/#enumerations)

### [Importance](https://tauri.app/reference/javascript/notification/#importance)

[Section titled “Importance”](https://tauri.app/reference/javascript/notification/#importance)

#### [Enumeration Members](https://tauri.app/reference/javascript/notification/#enumeration-members)

[Section titled “Enumeration Members”](https://tauri.app/reference/javascript/notification/#enumeration-members)

##### [Default](https://tauri.app/reference/javascript/notification/#default)

[Section titled “Default”](https://tauri.app/reference/javascript/notification/#default)

    Default: 3;

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L293](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L293)

##### [High](https://tauri.app/reference/javascript/notification/#high)

[Section titled “High”](https://tauri.app/reference/javascript/notification/#high)

    High: 4;

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L294](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L294)

##### [Low](https://tauri.app/reference/javascript/notification/#low)

[Section titled “Low”](https://tauri.app/reference/javascript/notification/#low)

    Low: 2;

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L292](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L292)

##### [Min](https://tauri.app/reference/javascript/notification/#min)

[Section titled “Min”](https://tauri.app/reference/javascript/notification/#min)

    Min: 1;

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L291](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L291)

##### [None](https://tauri.app/reference/javascript/notification/#none)

[Section titled “None”](https://tauri.app/reference/javascript/notification/#none)

    None: 0;

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L290](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L290)

* * *

### [ScheduleEvery](https://tauri.app/reference/javascript/notification/#scheduleevery)

[Section titled “ScheduleEvery”](https://tauri.app/reference/javascript/notification/#scheduleevery)

#### [Enumeration Members](https://tauri.app/reference/javascript/notification/#enumeration-members-1)

[Section titled “Enumeration Members”](https://tauri.app/reference/javascript/notification/#enumeration-members-1)

##### [Day](https://tauri.app/reference/javascript/notification/#day)

[Section titled “Day”](https://tauri.app/reference/javascript/notification/#day)

    Day: "day";

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L165](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L165)

##### [Hour](https://tauri.app/reference/javascript/notification/#hour)

[Section titled “Hour”](https://tauri.app/reference/javascript/notification/#hour)

    Hour: "hour";

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L166](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L166)

##### [Minute](https://tauri.app/reference/javascript/notification/#minute)

[Section titled “Minute”](https://tauri.app/reference/javascript/notification/#minute)

    Minute: "minute";

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L167](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L167)

##### [Month](https://tauri.app/reference/javascript/notification/#month)

[Section titled “Month”](https://tauri.app/reference/javascript/notification/#month)

    Month: "month";

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L162](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L162)

##### [Second](https://tauri.app/reference/javascript/notification/#second)

[Section titled “Second”](https://tauri.app/reference/javascript/notification/#second)

    Second: "second";

Not supported on iOS.

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L171](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L171)

##### [TwoWeeks](https://tauri.app/reference/javascript/notification/#twoweeks)

[Section titled “TwoWeeks”](https://tauri.app/reference/javascript/notification/#twoweeks)

    TwoWeeks: "twoWeeks";

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L163](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L163)

##### [Week](https://tauri.app/reference/javascript/notification/#week)

[Section titled “Week”](https://tauri.app/reference/javascript/notification/#week)

    Week: "week";

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L164](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L164)

##### [Year](https://tauri.app/reference/javascript/notification/#year)

[Section titled “Year”](https://tauri.app/reference/javascript/notification/#year)

    Year: "year";

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L161](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L161)

* * *

### [Visibility](https://tauri.app/reference/javascript/notification/#visibility)

[Section titled “Visibility”](https://tauri.app/reference/javascript/notification/#visibility)

#### [Enumeration Members](https://tauri.app/reference/javascript/notification/#enumeration-members-2)

[Section titled “Enumeration Members”](https://tauri.app/reference/javascript/notification/#enumeration-members-2)

##### [Private](https://tauri.app/reference/javascript/notification/#private)

[Section titled “Private”](https://tauri.app/reference/javascript/notification/#private)

    Private: 0;

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L299](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L299)

##### [Public](https://tauri.app/reference/javascript/notification/#public)

[Section titled “Public”](https://tauri.app/reference/javascript/notification/#public)

    Public: 1;

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L300](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L300)

##### [Secret](https://tauri.app/reference/javascript/notification/#secret)

[Section titled “Secret”](https://tauri.app/reference/javascript/notification/#secret)

    Secret: -1;

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L298](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L298)

[Classes](https://tauri.app/reference/javascript/notification/#classes)

------------------------------------------------------------------------

[Section titled “Classes”](https://tauri.app/reference/javascript/notification/#classes)

### [Schedule](https://tauri.app/reference/javascript/notification/#schedule)

[Section titled “Schedule”](https://tauri.app/reference/javascript/notification/#schedule)

#### [Constructors](https://tauri.app/reference/javascript/notification/#constructors)

[Section titled “Constructors”](https://tauri.app/reference/javascript/notification/#constructors)

##### [new Schedule()](https://tauri.app/reference/javascript/notification/#new-schedule)

[Section titled “new Schedule()”](https://tauri.app/reference/javascript/notification/#new-schedule)

    new Schedule(): Schedule

###### [Returns](https://tauri.app/reference/javascript/notification/#returns)

[Section titled “Returns”](https://tauri.app/reference/javascript/notification/#returns)

[`Schedule`](https://tauri.app/reference/javascript/notification/#schedule)

#### [Properties](https://tauri.app/reference/javascript/notification/#properties)

[Section titled “Properties”](https://tauri.app/reference/javascript/notification/#properties)

| Property | Type | Defined in |
| --- | --- | --- |
| `at` | `undefined` \| `object` | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L175](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L175) |
| `every` | `undefined` \| `object` | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L190](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L190) |
| `interval` | `undefined` \| `object` | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L183](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L183) |

#### [Methods](https://tauri.app/reference/javascript/notification/#methods)

[Section titled “Methods”](https://tauri.app/reference/javascript/notification/#methods)

##### [at()](https://tauri.app/reference/javascript/notification/#at)

[Section titled “at()”](https://tauri.app/reference/javascript/notification/#at)

    static at(   date,   repeating,   allowWhileIdle): Schedule

###### [Parameters](https://tauri.app/reference/javascript/notification/#parameters)

[Section titled “Parameters”](https://tauri.app/reference/javascript/notification/#parameters)

| Parameter | Type | Default value |
| --- | --- | --- |
| `date` | [`Date`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Date) | `undefined` |
| `repeating` | `boolean` | `false` |
| `allowWhileIdle` | `boolean` | `false` |

###### [Returns](https://tauri.app/reference/javascript/notification/#returns-1)

[Section titled “Returns”](https://tauri.app/reference/javascript/notification/#returns-1)

[`Schedule`](https://tauri.app/reference/javascript/notification/#schedule)

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L198](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L198)

##### [every()](https://tauri.app/reference/javascript/notification/#every)

[Section titled “every()”](https://tauri.app/reference/javascript/notification/#every)

    static every(   kind,   count,   allowWhileIdle): Schedule

###### [Parameters](https://tauri.app/reference/javascript/notification/#parameters-1)

[Section titled “Parameters”](https://tauri.app/reference/javascript/notification/#parameters-1)

| Parameter | Type | Default value |
| --- | --- | --- |
| `kind` | [`ScheduleEvery`](https://tauri.app/reference/javascript/notification/#scheduleevery) | `undefined` |
| `count` | `number` | `undefined` |
| `allowWhileIdle` | `boolean` | `false` |

###### [Returns](https://tauri.app/reference/javascript/notification/#returns-2)

[Section titled “Returns”](https://tauri.app/reference/javascript/notification/#returns-2)

[`Schedule`](https://tauri.app/reference/javascript/notification/#schedule)

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L217](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L217)

##### [interval()](https://tauri.app/reference/javascript/notification/#interval)

[Section titled “interval()”](https://tauri.app/reference/javascript/notification/#interval)

    static interval(interval, allowWhileIdle): Schedule

###### [Parameters](https://tauri.app/reference/javascript/notification/#parameters-2)

[Section titled “Parameters”](https://tauri.app/reference/javascript/notification/#parameters-2)

| Parameter | Type | Default value |
| --- | --- | --- |
| `interval` | [`ScheduleInterval`](https://tauri.app/reference/javascript/notification/#scheduleinterval) | `undefined` |
| `allowWhileIdle` | `boolean` | `false` |

###### [Returns](https://tauri.app/reference/javascript/notification/#returns-3)

[Section titled “Returns”](https://tauri.app/reference/javascript/notification/#returns-3)

[`Schedule`](https://tauri.app/reference/javascript/notification/#schedule)

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L206](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L206)

[Interfaces](https://tauri.app/reference/javascript/notification/#interfaces)

------------------------------------------------------------------------------

[Section titled “Interfaces”](https://tauri.app/reference/javascript/notification/#interfaces)

### [Action](https://tauri.app/reference/javascript/notification/#action)

[Section titled “Action”](https://tauri.app/reference/javascript/notification/#action)

#### [Properties](https://tauri.app/reference/javascript/notification/#properties-1)

[Section titled “Properties”](https://tauri.app/reference/javascript/notification/#properties-1)

| Property | Type | Defined in |
| --- | --- | --- |
| `destructive?` | `boolean` | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L245](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L245) |
| `foreground?` | `boolean` | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L244](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L244) |
| `id` | `string` | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L241](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L241) |
| `input?` | `boolean` | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L246](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L246) |
| `inputButtonTitle?` | `string` | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L247](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L247) |
| `inputPlaceholder?` | `string` | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L248](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L248) |
| `requiresAuthentication?` | `boolean` | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L243](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L243) |
| `title` | `string` | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L242](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L242) |

* * *

### [ActionType](https://tauri.app/reference/javascript/notification/#actiontype)

[Section titled “ActionType”](https://tauri.app/reference/javascript/notification/#actiontype)

#### [Properties](https://tauri.app/reference/javascript/notification/#properties-2)

[Section titled “Properties”](https://tauri.app/reference/javascript/notification/#properties-2)

| Property | Type | Description | Defined in |
| --- | --- | --- | --- |
| `actions` | [`Action`](https://tauri.app/reference/javascript/notification/#action)<br>\[\] | The list of associated actions | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L259](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L259) |
| `allowInCarPlay?` | `boolean` | \-  | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L262](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L262) |
| `customDismissAction?` | `boolean` | \-  | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L261](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L261) |
| `hiddenPreviewsBodyPlaceholder?` | `string` | \-  | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L260](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L260) |
| `hiddenPreviewsShowSubtitle?` | `boolean` | \-  | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L264](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L264) |
| `hiddenPreviewsShowTitle?` | `boolean` | \-  | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L263](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L263) |
| `id` | `string` | The identifier of this action type | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L255](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L255) |

* * *

### [ActiveNotification](https://tauri.app/reference/javascript/notification/#activenotification)

[Section titled “ActiveNotification”](https://tauri.app/reference/javascript/notification/#activenotification)

#### [Properties](https://tauri.app/reference/javascript/notification/#properties-3)

[Section titled “Properties”](https://tauri.app/reference/javascript/notification/#properties-3)

| Property | Type | Defined in |
| --- | --- | --- |
| `actionTypeId?` | `string` | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L284](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L284) |
| `attachments` | [`Attachment`](https://tauri.app/reference/javascript/notification/#attachment)<br>\[\] | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L283](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L283) |
| `body?` | `string` | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L278](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L278) |
| `data` | [`Record`](https://www.typescriptlang.org/docs/handbook/utility-types.html#recordkeys-type)<br><`string`, `string`\> | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L281](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L281) |
| `extra` | [`Record`](https://www.typescriptlang.org/docs/handbook/utility-types.html#recordkeys-type)<br><`string`, `unknown`\> | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L282](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L282) |
| `group?` | `string` | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L279](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L279) |
| `groupSummary` | `boolean` | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L280](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L280) |
| `id` | `number` | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L275](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L275) |
| `schedule?` | [`Schedule`](https://tauri.app/reference/javascript/notification/#schedule) | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L285](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L285) |
| `sound?` | `string` | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L286](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L286) |
| `tag?` | `string` | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L276](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L276) |
| `title?` | `string` | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L277](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L277) |

* * *

### [Attachment](https://tauri.app/reference/javascript/notification/#attachment)

[Section titled “Attachment”](https://tauri.app/reference/javascript/notification/#attachment)

Attachment of a notification.

#### [Properties](https://tauri.app/reference/javascript/notification/#properties-4)

[Section titled “Properties”](https://tauri.app/reference/javascript/notification/#properties-4)

| Property | Type | Description | Defined in |
| --- | --- | --- | --- |
| `id` | `string` | Attachment identifier. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L235](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L235) |
| `url` | `string` | Attachment URL. Accepts the `asset` and `file` protocols. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L237](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L237) |

* * *

### [Channel](https://tauri.app/reference/javascript/notification/#channel)

[Section titled “Channel”](https://tauri.app/reference/javascript/notification/#channel)

#### [Properties](https://tauri.app/reference/javascript/notification/#properties-5)

[Section titled “Properties”](https://tauri.app/reference/javascript/notification/#properties-5)

| Property | Type | Defined in |
| --- | --- | --- |
| `description?` | `string` | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L306](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L306) |
| `id` | `string` | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L304](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L304) |
| `importance?` | [`Importance`](https://tauri.app/reference/javascript/notification/#importance) | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L311](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L311) |
| `lightColor?` | `string` | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L309](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L309) |
| `lights?` | `boolean` | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L308](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L308) |
| `name` | `string` | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L305](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L305) |
| `sound?` | `string` | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L307](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L307) |
| `vibration?` | `boolean` | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L310](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L310) |
| `visibility?` | [`Visibility`](https://tauri.app/reference/javascript/notification/#visibility) | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L312](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L312) |

* * *

### [Options](https://tauri.app/reference/javascript/notification/#options)

[Section titled “Options”](https://tauri.app/reference/javascript/notification/#options)

Options to send a notification.

#### [Since](https://tauri.app/reference/javascript/notification/#since)

[Section titled “Since”](https://tauri.app/reference/javascript/notification/#since)

2.0.0

#### [Properties](https://tauri.app/reference/javascript/notification/#properties-6)

[Section titled “Properties”](https://tauri.app/reference/javascript/notification/#properties-6)

| Property | Type | Description | Defined in |
| --- | --- | --- | --- |
| `actionTypeId?` | `string` | Defines an action type for this notification. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L62](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L62) |
| `attachments?` | [`Attachment`](https://tauri.app/reference/javascript/notification/#attachment)<br>\[\] | Notification attachments. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L110](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L110) |
| `autoCancel?` | `boolean` | Automatically cancel the notification when the user clicks on it. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L126](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L126) |
| `body?` | `string` | Optional notification body. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L44](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L44) |
| `channelId?` | `string` | Identifier of the [Channel](https://tauri.app/reference/javascript/notification/#channel)<br> that deliveres this notification. If the channel does not exist, the notification won’t fire. Make sure the channel exists with listChannels and [createChannel](https://tauri.app/reference/javascript/notification/#createchannel)<br>. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L36](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L36) |
| `extra?` | [`Record`](https://www.typescriptlang.org/docs/handbook/utility-types.html#recordkeys-type)<br><`string`, `unknown`\> | Extra payload to store in the notification. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L114](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L114) |
| `group?` | `string` | Identifier used to group multiple notifications. [https://developer.apple.com/documentation/usernotifications/unmutablenotificationcontent/1649872-threadidentifier](https://developer.apple.com/documentation/usernotifications/unmutablenotificationcontent/1649872-threadidentifier) | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L68](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L68) |
| `groupSummary?` | `boolean` | Instructs the system that this notification is the summary of a group on Android. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L72](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L72) |
| `icon?` | `string` | Notification icon. On Android the icon must be placed in the app’s `res/drawable` folder. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L96](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L96) |
| `iconColor?` | `string` | Icon color on Android. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L106](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L106) |
| `id?` | `number` | The notification identifier to reference this object later. Must be a 32-bit integer. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L29](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L29) |
| `inboxLines?` | `string`\[\] | List of lines to add to the notification. Changes the notification style to inbox. Cannot be used with `largeBody`. Only supports up to 5 lines. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L90](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L90) |
| `largeBody?` | `string` | Multiline text. Changes the notification style to big text. Cannot be used with `inboxLines`. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L54](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L54) |
| `largeIcon?` | `string` | Notification large icon (Android). The icon must be placed in the app’s `res/drawable` folder. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L102](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L102) |
| `number?` | `number` | Sets the number of items this notification represents on Android. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L138](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L138) |
| `ongoing?` | `boolean` | If true, the notification cannot be dismissed by the user on Android. An application service must manage the dismissal of the notification. It is typically used to indicate a background task that is pending (e.g. a file download) or the user is engaged with (e.g. playing music). | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L122](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L122) |
| `schedule?` | [`Schedule`](https://tauri.app/reference/javascript/notification/#schedule) | Schedule this notification to fire on a later time or a fixed interval. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L48](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L48) |
| `silent?` | `boolean` | Changes the notification presentation to be silent on iOS (no badge, no sound, not listed). | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L130](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L130) |
| `sound?` | `string` | The sound resource name or file path for the notification. Platform specific behavior: - On macOS: use system sounds (e.g., “Ping”, “Blow”) or sound files in the app bundle - On Linux: use XDG theme sounds (e.g., “message-new-instant”) or file paths - On Windows: use file paths to sound files (.wav format) - On Mobile: use resource names | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L82](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L82) |
| `summary?` | `string` | Detail text for the notification with `largeBody`, `inboxLines` or `groupSummary`. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L58](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L58) |
| `title` | `string` | Notification title. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L40](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L40) |
| `visibility?` | [`Visibility`](https://tauri.app/reference/javascript/notification/#visibility) | Notification visibility. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L134](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L134) |

* * *

### [PendingNotification](https://tauri.app/reference/javascript/notification/#pendingnotification)

[Section titled “PendingNotification”](https://tauri.app/reference/javascript/notification/#pendingnotification)

#### [Properties](https://tauri.app/reference/javascript/notification/#properties-7)

[Section titled “Properties”](https://tauri.app/reference/javascript/notification/#properties-7)

| Property | Type | Defined in |
| --- | --- | --- |
| `body?` | `string` | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L270](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L270) |
| `id` | `number` | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L268](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L268) |
| `schedule` | [`Schedule`](https://tauri.app/reference/javascript/notification/#schedule) | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L271](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L271) |
| `title?` | `string` | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L269](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L269) |

* * *

### [ScheduleInterval](https://tauri.app/reference/javascript/notification/#scheduleinterval)

[Section titled “ScheduleInterval”](https://tauri.app/reference/javascript/notification/#scheduleinterval)

#### [Properties](https://tauri.app/reference/javascript/notification/#properties-8)

[Section titled “Properties”](https://tauri.app/reference/javascript/notification/#properties-8)

| Property | Type | Description | Defined in |
| --- | --- | --- | --- |
| `day?` | `number` | \-  | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L144](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L144) |
| `hour?` | `number` | \-  | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L155](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L155) |
| `minute?` | `number` | \-  | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L156](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L156) |
| `month?` | `number` | \-  | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L143](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L143) |
| `second?` | `number` | \-  | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L157](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L157) |
| `weekday?` | `number` | 1 - Sunday 2 - Monday 3 - Tuesday 4 - Wednesday 5 - Thursday 6 - Friday 7 - Saturday | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L154](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L154) |
| `year?` | `number` | \-  | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L142](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L142) |

[Type Aliases](https://tauri.app/reference/javascript/notification/#type-aliases)

----------------------------------------------------------------------------------

[Section titled “Type Aliases”](https://tauri.app/reference/javascript/notification/#type-aliases)

### [PermissionState](https://tauri.app/reference/javascript/notification/#permissionstate)

[Section titled “PermissionState”](https://tauri.app/reference/javascript/notification/#permissionstate)

    type PermissionState: "granted" | "denied" | "prompt" | "prompt-with-rationale";

**Source**: undefined

[Functions](https://tauri.app/reference/javascript/notification/#functions)

----------------------------------------------------------------------------

[Section titled “Functions”](https://tauri.app/reference/javascript/notification/#functions)

### [active()](https://tauri.app/reference/javascript/notification/#active)

[Section titled “active()”](https://tauri.app/reference/javascript/notification/#active)

    function active(): Promise<ActiveNotification[]>

Retrieves the list of active notifications.

#### [Returns](https://tauri.app/reference/javascript/notification/#returns-4)

[Section titled “Returns”](https://tauri.app/reference/javascript/notification/#returns-4)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<[`ActiveNotification`](https://tauri.app/reference/javascript/notification/#activenotification)
\[\]>

A promise resolving to the list of active notifications.

#### [Example](https://tauri.app/reference/javascript/notification/#example)

[Section titled “Example”](https://tauri.app/reference/javascript/notification/#example)

    import { active } from '@tauri-apps/plugin-notification';const activeNotifications = await active();

#### [Since](https://tauri.app/reference/javascript/notification/#since-1)

[Section titled “Since”](https://tauri.app/reference/javascript/notification/#since-1)

2.0.0

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L465](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L465)

* * *

### [cancel()](https://tauri.app/reference/javascript/notification/#cancel)

[Section titled “cancel()”](https://tauri.app/reference/javascript/notification/#cancel)

    function cancel(notifications): Promise<void>

Cancels the pending notifications with the given list of identifiers.

#### [Parameters](https://tauri.app/reference/javascript/notification/#parameters-3)

[Section titled “Parameters”](https://tauri.app/reference/javascript/notification/#parameters-3)

| Parameter | Type |
| --- | --- |
| `notifications` | `number`\[\] |

#### [Returns](https://tauri.app/reference/javascript/notification/#returns-5)

[Section titled “Returns”](https://tauri.app/reference/javascript/notification/#returns-5)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`void`\>

A promise indicating the success or failure of the operation.

#### [Example](https://tauri.app/reference/javascript/notification/#example-1)

[Section titled “Example”](https://tauri.app/reference/javascript/notification/#example-1)

    import { cancel } from '@tauri-apps/plugin-notification';await cancel([-34234, 23432, 4311]);

#### [Since](https://tauri.app/reference/javascript/notification/#since-2)

[Section titled “Since”](https://tauri.app/reference/javascript/notification/#since-2)

2.0.0

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L431](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L431)

* * *

### [cancelAll()](https://tauri.app/reference/javascript/notification/#cancelall)

[Section titled “cancelAll()”](https://tauri.app/reference/javascript/notification/#cancelall)

    function cancelAll(): Promise<void>

Cancels all pending notifications.

#### [Returns](https://tauri.app/reference/javascript/notification/#returns-6)

[Section titled “Returns”](https://tauri.app/reference/javascript/notification/#returns-6)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`void`\>

A promise indicating the success or failure of the operation.

#### [Example](https://tauri.app/reference/javascript/notification/#example-2)

[Section titled “Example”](https://tauri.app/reference/javascript/notification/#example-2)

    import { cancelAll } from '@tauri-apps/plugin-notification';await cancelAll();

#### [Since](https://tauri.app/reference/javascript/notification/#since-3)

[Section titled “Since”](https://tauri.app/reference/javascript/notification/#since-3)

2.0.0

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L448](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L448)

* * *

### [channels()](https://tauri.app/reference/javascript/notification/#channels)

[Section titled “channels()”](https://tauri.app/reference/javascript/notification/#channels)

    function channels(): Promise<Channel[]>

Retrieves the list of notification channels.

#### [Returns](https://tauri.app/reference/javascript/notification/#returns-7)

[Section titled “Returns”](https://tauri.app/reference/javascript/notification/#returns-7)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<[`Channel`](https://tauri.app/reference/javascript/notification/#channel)
\[\]>

A promise resolving to the list of notification channels.

#### [Example](https://tauri.app/reference/javascript/notification/#example-3)

[Section titled “Example”](https://tauri.app/reference/javascript/notification/#example-3)

    import { channels } from '@tauri-apps/plugin-notification';const notificationChannels = await channels();

#### [Since](https://tauri.app/reference/javascript/notification/#since-4)

[Section titled “Since”](https://tauri.app/reference/javascript/notification/#since-4)

2.0.0

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L559](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L559)

* * *

### [createChannel()](https://tauri.app/reference/javascript/notification/#createchannel)

[Section titled “createChannel()”](https://tauri.app/reference/javascript/notification/#createchannel)

    function createChannel(channel): Promise<void>

Creates a notification channel.

#### [Parameters](https://tauri.app/reference/javascript/notification/#parameters-4)

[Section titled “Parameters”](https://tauri.app/reference/javascript/notification/#parameters-4)

| Parameter | Type |
| --- | --- |
| `channel` | [`Channel`](https://tauri.app/reference/javascript/notification/#channel) |

#### [Returns](https://tauri.app/reference/javascript/notification/#returns-8)

[Section titled “Returns”](https://tauri.app/reference/javascript/notification/#returns-8)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`void`\>

A promise indicating the success or failure of the operation.

#### [Example](https://tauri.app/reference/javascript/notification/#example-4)

[Section titled “Example”](https://tauri.app/reference/javascript/notification/#example-4)

    import { createChannel, Importance, Visibility } from '@tauri-apps/plugin-notification';await createChannel({  id: 'new-messages',  name: 'New Messages',  lights: true,  vibration: true,  importance: Importance.Default,  visibility: Visibility.Private});

#### [Since](https://tauri.app/reference/javascript/notification/#since-5)

[Section titled “Since”](https://tauri.app/reference/javascript/notification/#since-5)

2.0.0

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L525](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L525)

* * *

### [isPermissionGranted()](https://tauri.app/reference/javascript/notification/#ispermissiongranted)

[Section titled “isPermissionGranted()”](https://tauri.app/reference/javascript/notification/#ispermissiongranted)

    function isPermissionGranted(): Promise<boolean>

Checks if the permission to send notifications is granted.

#### [Returns](https://tauri.app/reference/javascript/notification/#returns-9)

[Section titled “Returns”](https://tauri.app/reference/javascript/notification/#returns-9)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`boolean`\>

#### [Example](https://tauri.app/reference/javascript/notification/#example-5)

[Section titled “Example”](https://tauri.app/reference/javascript/notification/#example-5)

    import { isPermissionGranted } from '@tauri-apps/plugin-notification';const permissionGranted = await isPermissionGranted();

#### [Since](https://tauri.app/reference/javascript/notification/#since-6)

[Section titled “Since”](https://tauri.app/reference/javascript/notification/#since-6)

2.0.0

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L325](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L325)

* * *

### [onAction()](https://tauri.app/reference/javascript/notification/#onaction)

[Section titled “onAction()”](https://tauri.app/reference/javascript/notification/#onaction)

    function onAction(cb): Promise<PluginListener>

#### [Parameters](https://tauri.app/reference/javascript/notification/#parameters-5)

[Section titled “Parameters”](https://tauri.app/reference/javascript/notification/#parameters-5)

| Parameter | Type |
| --- | --- |
| `cb` | (`notification`) => `void` |

#### [Returns](https://tauri.app/reference/javascript/notification/#returns-10)

[Section titled “Returns”](https://tauri.app/reference/javascript/notification/#returns-10)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`PluginListener`\>

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L569](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L569)

* * *

### [onNotificationReceived()](https://tauri.app/reference/javascript/notification/#onnotificationreceived)

[Section titled “onNotificationReceived()”](https://tauri.app/reference/javascript/notification/#onnotificationreceived)

    function onNotificationReceived(cb): Promise<PluginListener>

#### [Parameters](https://tauri.app/reference/javascript/notification/#parameters-6)

[Section titled “Parameters”](https://tauri.app/reference/javascript/notification/#parameters-6)

| Parameter | Type |
| --- | --- |
| `cb` | (`notification`) => `void` |

#### [Returns](https://tauri.app/reference/javascript/notification/#returns-11)

[Section titled “Returns”](https://tauri.app/reference/javascript/notification/#returns-11)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`PluginListener`\>

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L563](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L563)

* * *

### [pending()](https://tauri.app/reference/javascript/notification/#pending)

[Section titled “pending()”](https://tauri.app/reference/javascript/notification/#pending)

    function pending(): Promise<PendingNotification[]>

Retrieves the list of pending notifications.

#### [Returns](https://tauri.app/reference/javascript/notification/#returns-12)

[Section titled “Returns”](https://tauri.app/reference/javascript/notification/#returns-12)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<[`PendingNotification`](https://tauri.app/reference/javascript/notification/#pendingnotification)
\[\]>

A promise resolving to the list of pending notifications.

#### [Example](https://tauri.app/reference/javascript/notification/#example-6)

[Section titled “Example”](https://tauri.app/reference/javascript/notification/#example-6)

    import { pending } from '@tauri-apps/plugin-notification';const pendingNotifications = await pending();

#### [Since](https://tauri.app/reference/javascript/notification/#since-7)

[Section titled “Since”](https://tauri.app/reference/javascript/notification/#since-7)

2.0.0

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L414](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L414)

* * *

### [registerActionTypes()](https://tauri.app/reference/javascript/notification/#registeractiontypes)

[Section titled “registerActionTypes()”](https://tauri.app/reference/javascript/notification/#registeractiontypes)

    function registerActionTypes(types): Promise<void>

Register actions that are performed when the user clicks on the notification.

#### [Parameters](https://tauri.app/reference/javascript/notification/#parameters-7)

[Section titled “Parameters”](https://tauri.app/reference/javascript/notification/#parameters-7)

| Parameter | Type |
| --- | --- |
| `types` | [`ActionType`](https://tauri.app/reference/javascript/notification/#actiontype)<br>\[\] |

#### [Returns](https://tauri.app/reference/javascript/notification/#returns-13)

[Section titled “Returns”](https://tauri.app/reference/javascript/notification/#returns-13)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`void`\>

A promise indicating the success or failure of the operation.

#### [Example](https://tauri.app/reference/javascript/notification/#example-7)

[Section titled “Example”](https://tauri.app/reference/javascript/notification/#example-7)

    import { registerActionTypes } from '@tauri-apps/plugin-notification';await registerActionTypes([{  id: 'tauri',  actions: [{    id: 'my-action',    title: 'Settings'  }]}])

#### [Since](https://tauri.app/reference/javascript/notification/#since-8)

[Section titled “Since”](https://tauri.app/reference/javascript/notification/#since-8)

2.0.0

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L397](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L397)

* * *

### [removeActive()](https://tauri.app/reference/javascript/notification/#removeactive)

[Section titled “removeActive()”](https://tauri.app/reference/javascript/notification/#removeactive)

    function removeActive(notifications): Promise<void>

Removes the active notifications with the given list of identifiers.

#### [Parameters](https://tauri.app/reference/javascript/notification/#parameters-8)

[Section titled “Parameters”](https://tauri.app/reference/javascript/notification/#parameters-8)

| Parameter | Type |
| --- | --- |
| `notifications` | `object`\[\] |

#### [Returns](https://tauri.app/reference/javascript/notification/#returns-14)

[Section titled “Returns”](https://tauri.app/reference/javascript/notification/#returns-14)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`void`\>

A promise indicating the success or failure of the operation.

#### [Example](https://tauri.app/reference/javascript/notification/#example-8)

[Section titled “Example”](https://tauri.app/reference/javascript/notification/#example-8)

    import { cancel } from '@tauri-apps/plugin-notification';await cancel([-34234, 23432, 4311])

#### [Since](https://tauri.app/reference/javascript/notification/#since-9)

[Section titled “Since”](https://tauri.app/reference/javascript/notification/#since-9)

2.0.0

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L482](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L482)

* * *

### [removeAllActive()](https://tauri.app/reference/javascript/notification/#removeallactive)

[Section titled “removeAllActive()”](https://tauri.app/reference/javascript/notification/#removeallactive)

    function removeAllActive(): Promise<void>

Removes all active notifications.

#### [Returns](https://tauri.app/reference/javascript/notification/#returns-15)

[Section titled “Returns”](https://tauri.app/reference/javascript/notification/#returns-15)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`void`\>

A promise indicating the success or failure of the operation.

#### [Example](https://tauri.app/reference/javascript/notification/#example-9)

[Section titled “Example”](https://tauri.app/reference/javascript/notification/#example-9)

    import { removeAllActive } from '@tauri-apps/plugin-notification';await removeAllActive()

#### [Since](https://tauri.app/reference/javascript/notification/#since-10)

[Section titled “Since”](https://tauri.app/reference/javascript/notification/#since-10)

2.0.0

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L501](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L501)

* * *

### [removeChannel()](https://tauri.app/reference/javascript/notification/#removechannel)

[Section titled “removeChannel()”](https://tauri.app/reference/javascript/notification/#removechannel)

    function removeChannel(id): Promise<void>

Removes the channel with the given identifier.

#### [Parameters](https://tauri.app/reference/javascript/notification/#parameters-9)

[Section titled “Parameters”](https://tauri.app/reference/javascript/notification/#parameters-9)

| Parameter | Type |
| --- | --- |
| `id` | `string` |

#### [Returns](https://tauri.app/reference/javascript/notification/#returns-16)

[Section titled “Returns”](https://tauri.app/reference/javascript/notification/#returns-16)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`void`\>

A promise indicating the success or failure of the operation.

#### [Example](https://tauri.app/reference/javascript/notification/#example-10)

[Section titled “Example”](https://tauri.app/reference/javascript/notification/#example-10)

    import { removeChannel } from '@tauri-apps/plugin-notification';await removeChannel();

#### [Since](https://tauri.app/reference/javascript/notification/#since-11)

[Section titled “Since”](https://tauri.app/reference/javascript/notification/#since-11)

2.0.0

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L542](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L542)

* * *

### [requestPermission()](https://tauri.app/reference/javascript/notification/#requestpermission)

[Section titled “requestPermission()”](https://tauri.app/reference/javascript/notification/#requestpermission)

    function requestPermission(): Promise<NotificationPermission>

Requests the permission to send notifications.

#### [Returns](https://tauri.app/reference/javascript/notification/#returns-17)

[Section titled “Returns”](https://tauri.app/reference/javascript/notification/#returns-17)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`NotificationPermission`\>

A promise resolving to whether the user granted the permission or not.

#### [Example](https://tauri.app/reference/javascript/notification/#example-11)

[Section titled “Example”](https://tauri.app/reference/javascript/notification/#example-11)

    import { isPermissionGranted, requestPermission } from '@tauri-apps/plugin-notification';let permissionGranted = await isPermissionGranted();if (!permissionGranted) {  const permission = await requestPermission();  permissionGranted = permission === 'granted';}

#### [Since](https://tauri.app/reference/javascript/notification/#since-12)

[Section titled “Since”](https://tauri.app/reference/javascript/notification/#since-12)

2.0.0

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L348](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L348)

* * *

### [sendNotification()](https://tauri.app/reference/javascript/notification/#sendnotification)

[Section titled “sendNotification()”](https://tauri.app/reference/javascript/notification/#sendnotification)

    function sendNotification(options): void

Sends a notification to the user.

#### [Parameters](https://tauri.app/reference/javascript/notification/#parameters-10)

[Section titled “Parameters”](https://tauri.app/reference/javascript/notification/#parameters-10)

| Parameter | Type |
| --- | --- |
| `options` | `string` \| [`Options`](https://tauri.app/reference/javascript/notification/#options) |

#### [Returns](https://tauri.app/reference/javascript/notification/#returns-18)

[Section titled “Returns”](https://tauri.app/reference/javascript/notification/#returns-18)

`void`

#### [Example](https://tauri.app/reference/javascript/notification/#example-12)

[Section titled “Example”](https://tauri.app/reference/javascript/notification/#example-12)

    import { isPermissionGranted, requestPermission, sendNotification } from '@tauri-apps/plugin-notification';let permissionGranted = await isPermissionGranted();if (!permissionGranted) {  const permission = await requestPermission();  permissionGranted = permission === 'granted';}if (permissionGranted) {  sendNotification('Tauri is awesome!');  sendNotification({ title: 'TAURI', body: 'Tauri is awesome!' });}

#### [Since](https://tauri.app/reference/javascript/notification/#since-13)

[Section titled “Since”](https://tauri.app/reference/javascript/notification/#since-13)

2.0.0

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L370](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/notification/guest-js/index.ts#L370)

* * *

[Support on Open Collective](https://opencollective.com/tauri)
 [Sponsor on GitHub](https://github.com/sponsors/tauri-apps)

© 2026 Tauri Contributors. CC-BY / MIT

---

# path | Tauri

[Skip to content](https://tauri.app/reference/javascript/api/namespacepath/#_top)

path
====

The path module provides utilities for working with file and directory paths.

This package is also accessible with `window.__TAURI__.path` when [`app.withGlobalTauri`](https://v2.tauri.app/reference/config/#withglobaltauri)
 in `tauri.conf.json` is set to `true`.

It is recommended to allowlist only the APIs you use for optimal bundle size and security.

[Enumerations](https://tauri.app/reference/javascript/api/namespacepath/#enumerations)

---------------------------------------------------------------------------------------

[Section titled “Enumerations”](https://tauri.app/reference/javascript/api/namespacepath/#enumerations)

### [BaseDirectory](https://tauri.app/reference/javascript/api/namespacepath/#basedirectory)

[Section titled “BaseDirectory”](https://tauri.app/reference/javascript/api/namespacepath/#basedirectory)

#### [Since](https://tauri.app/reference/javascript/api/namespacepath/#since)

[Section titled “Since”](https://tauri.app/reference/javascript/api/namespacepath/#since)

2.0.0

#### [Enumeration Members](https://tauri.app/reference/javascript/api/namespacepath/#enumeration-members)

[Section titled “Enumeration Members”](https://tauri.app/reference/javascript/api/namespacepath/#enumeration-members)

##### [AppCache](https://tauri.app/reference/javascript/api/namespacepath/#appcache)

[Section titled “AppCache”](https://tauri.app/reference/javascript/api/namespacepath/#appcache)

    AppCache: 16;

###### [See](https://tauri.app/reference/javascript/api/namespacepath/#see)

[Section titled “See”](https://tauri.app/reference/javascript/api/namespacepath/#see)

[appCacheDir](https://tauri.app/reference/javascript/api/namespacepath/#appcachedir)
 for more information.

**Source**: [https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/path.ts#L83](https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/path.ts#L83)

##### [AppConfig](https://tauri.app/reference/javascript/api/namespacepath/#appconfig)

[Section titled “AppConfig”](https://tauri.app/reference/javascript/api/namespacepath/#appconfig)

    AppConfig: 13;

###### [See](https://tauri.app/reference/javascript/api/namespacepath/#see-1)

[Section titled “See”](https://tauri.app/reference/javascript/api/namespacepath/#see-1)

[appConfigDir](https://tauri.app/reference/javascript/api/namespacepath/#appconfigdir)
 for more information.

**Source**: [https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/path.ts#L71](https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/path.ts#L71)

##### [AppData](https://tauri.app/reference/javascript/api/namespacepath/#appdata)

[Section titled “AppData”](https://tauri.app/reference/javascript/api/namespacepath/#appdata)

    AppData: 14;

###### [See](https://tauri.app/reference/javascript/api/namespacepath/#see-2)

[Section titled “See”](https://tauri.app/reference/javascript/api/namespacepath/#see-2)

[appDataDir](https://tauri.app/reference/javascript/api/namespacepath/#appdatadir)
 for more information.

**Source**: [https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/path.ts#L75](https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/path.ts#L75)

##### [AppLocalData](https://tauri.app/reference/javascript/api/namespacepath/#applocaldata)

[Section titled “AppLocalData”](https://tauri.app/reference/javascript/api/namespacepath/#applocaldata)

    AppLocalData: 15;

###### [See](https://tauri.app/reference/javascript/api/namespacepath/#see-3)

[Section titled “See”](https://tauri.app/reference/javascript/api/namespacepath/#see-3)

[appLocalDataDir](https://tauri.app/reference/javascript/api/namespacepath/#applocaldatadir)
 for more information.

**Source**: [https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/path.ts#L79](https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/path.ts#L79)

##### [AppLog](https://tauri.app/reference/javascript/api/namespacepath/#applog)

[Section titled “AppLog”](https://tauri.app/reference/javascript/api/namespacepath/#applog)

    AppLog: 17;

###### [See](https://tauri.app/reference/javascript/api/namespacepath/#see-4)

[Section titled “See”](https://tauri.app/reference/javascript/api/namespacepath/#see-4)

[appLogDir](https://tauri.app/reference/javascript/api/namespacepath/#applogdir)
 for more information.

**Source**: [https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/path.ts#L87](https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/path.ts#L87)

##### [Audio](https://tauri.app/reference/javascript/api/namespacepath/#audio)

[Section titled “Audio”](https://tauri.app/reference/javascript/api/namespacepath/#audio)

    Audio: 1;

###### [See](https://tauri.app/reference/javascript/api/namespacepath/#see-5)

[Section titled “See”](https://tauri.app/reference/javascript/api/namespacepath/#see-5)

[audioDir](https://tauri.app/reference/javascript/api/namespacepath/#audiodir)
 for more information.

**Source**: [https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/path.ts#L23](https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/path.ts#L23)

##### [Cache](https://tauri.app/reference/javascript/api/namespacepath/#cache)

[Section titled “Cache”](https://tauri.app/reference/javascript/api/namespacepath/#cache)

    Cache: 2;

###### [See](https://tauri.app/reference/javascript/api/namespacepath/#see-6)

[Section titled “See”](https://tauri.app/reference/javascript/api/namespacepath/#see-6)

[cacheDir](https://tauri.app/reference/javascript/api/namespacepath/#cachedir)
 for more information.

**Source**: [https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/path.ts#L27](https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/path.ts#L27)

##### [Config](https://tauri.app/reference/javascript/api/namespacepath/#config)

[Section titled “Config”](https://tauri.app/reference/javascript/api/namespacepath/#config)

    Config: 3;

###### [See](https://tauri.app/reference/javascript/api/namespacepath/#see-7)

[Section titled “See”](https://tauri.app/reference/javascript/api/namespacepath/#see-7)

[configDir](https://tauri.app/reference/javascript/api/namespacepath/#configdir)
 for more information.

**Source**: [https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/path.ts#L31](https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/path.ts#L31)

##### [Data](https://tauri.app/reference/javascript/api/namespacepath/#data)

[Section titled “Data”](https://tauri.app/reference/javascript/api/namespacepath/#data)

    Data: 4;

###### [See](https://tauri.app/reference/javascript/api/namespacepath/#see-8)

[Section titled “See”](https://tauri.app/reference/javascript/api/namespacepath/#see-8)

[dataDir](https://tauri.app/reference/javascript/api/namespacepath/#datadir)
 for more information.

**Source**: [https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/path.ts#L35](https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/path.ts#L35)

##### [Desktop](https://tauri.app/reference/javascript/api/namespacepath/#desktop)

[Section titled “Desktop”](https://tauri.app/reference/javascript/api/namespacepath/#desktop)

    Desktop: 18;

###### [See](https://tauri.app/reference/javascript/api/namespacepath/#see-9)

[Section titled “See”](https://tauri.app/reference/javascript/api/namespacepath/#see-9)

[desktopDir](https://tauri.app/reference/javascript/api/namespacepath/#desktopdir)
 for more information.

**Source**: [https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/path.ts#L91](https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/path.ts#L91)

##### [Document](https://tauri.app/reference/javascript/api/namespacepath/#document)

[Section titled “Document”](https://tauri.app/reference/javascript/api/namespacepath/#document)

    Document: 6;

###### [See](https://tauri.app/reference/javascript/api/namespacepath/#see-10)

[Section titled “See”](https://tauri.app/reference/javascript/api/namespacepath/#see-10)

[documentDir](https://tauri.app/reference/javascript/api/namespacepath/#documentdir)
 for more information.

**Source**: [https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/path.ts#L43](https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/path.ts#L43)

##### [Download](https://tauri.app/reference/javascript/api/namespacepath/#download)

[Section titled “Download”](https://tauri.app/reference/javascript/api/namespacepath/#download)

    Download: 7;

###### [See](https://tauri.app/reference/javascript/api/namespacepath/#see-11)

[Section titled “See”](https://tauri.app/reference/javascript/api/namespacepath/#see-11)

[downloadDir](https://tauri.app/reference/javascript/api/namespacepath/#downloaddir)
 for more information.

**Source**: [https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/path.ts#L47](https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/path.ts#L47)

##### [Executable](https://tauri.app/reference/javascript/api/namespacepath/#executable)

[Section titled “Executable”](https://tauri.app/reference/javascript/api/namespacepath/#executable)

    Executable: 19;

###### [See](https://tauri.app/reference/javascript/api/namespacepath/#see-12)

[Section titled “See”](https://tauri.app/reference/javascript/api/namespacepath/#see-12)

[executableDir](https://tauri.app/reference/javascript/api/namespacepath/#executabledir)
 for more information.

**Source**: [https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/path.ts#L95](https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/path.ts#L95)

##### [Font](https://tauri.app/reference/javascript/api/namespacepath/#font)

[Section titled “Font”](https://tauri.app/reference/javascript/api/namespacepath/#font)

    Font: 20;

###### [See](https://tauri.app/reference/javascript/api/namespacepath/#see-13)

[Section titled “See”](https://tauri.app/reference/javascript/api/namespacepath/#see-13)

[fontDir](https://tauri.app/reference/javascript/api/namespacepath/#fontdir)
 for more information.

**Source**: [https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/path.ts#L99](https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/path.ts#L99)

##### [Home](https://tauri.app/reference/javascript/api/namespacepath/#home)

[Section titled “Home”](https://tauri.app/reference/javascript/api/namespacepath/#home)

    Home: 21;

###### [See](https://tauri.app/reference/javascript/api/namespacepath/#see-14)

[Section titled “See”](https://tauri.app/reference/javascript/api/namespacepath/#see-14)

[homeDir](https://tauri.app/reference/javascript/api/namespacepath/#homedir)
 for more information.

**Source**: [https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/path.ts#L103](https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/path.ts#L103)

##### [LocalData](https://tauri.app/reference/javascript/api/namespacepath/#localdata)

[Section titled “LocalData”](https://tauri.app/reference/javascript/api/namespacepath/#localdata)

    LocalData: 5;

###### [See](https://tauri.app/reference/javascript/api/namespacepath/#see-15)

[Section titled “See”](https://tauri.app/reference/javascript/api/namespacepath/#see-15)

[localDataDir](https://tauri.app/reference/javascript/api/namespacepath/#localdatadir)
 for more information.

**Source**: [https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/path.ts#L39](https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/path.ts#L39)

##### [Picture](https://tauri.app/reference/javascript/api/namespacepath/#picture)

[Section titled “Picture”](https://tauri.app/reference/javascript/api/namespacepath/#picture)

    Picture: 8;

###### [See](https://tauri.app/reference/javascript/api/namespacepath/#see-16)

[Section titled “See”](https://tauri.app/reference/javascript/api/namespacepath/#see-16)

[pictureDir](https://tauri.app/reference/javascript/api/namespacepath/#picturedir)
 for more information.

**Source**: [https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/path.ts#L51](https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/path.ts#L51)

##### [Public](https://tauri.app/reference/javascript/api/namespacepath/#public)

[Section titled “Public”](https://tauri.app/reference/javascript/api/namespacepath/#public)

    Public: 9;

###### [See](https://tauri.app/reference/javascript/api/namespacepath/#see-17)

[Section titled “See”](https://tauri.app/reference/javascript/api/namespacepath/#see-17)

[publicDir](https://tauri.app/reference/javascript/api/namespacepath/#publicdir)
 for more information.

**Source**: [https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/path.ts#L55](https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/path.ts#L55)

##### [Resource](https://tauri.app/reference/javascript/api/namespacepath/#resource)

[Section titled “Resource”](https://tauri.app/reference/javascript/api/namespacepath/#resource)

    Resource: 11;

###### [See](https://tauri.app/reference/javascript/api/namespacepath/#see-18)

[Section titled “See”](https://tauri.app/reference/javascript/api/namespacepath/#see-18)

[resourceDir](https://tauri.app/reference/javascript/api/namespacepath/#resourcedir)
 for more information.

**Source**: [https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/path.ts#L63](https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/path.ts#L63)

##### [Runtime](https://tauri.app/reference/javascript/api/namespacepath/#runtime)

[Section titled “Runtime”](https://tauri.app/reference/javascript/api/namespacepath/#runtime)

    Runtime: 22;

###### [See](https://tauri.app/reference/javascript/api/namespacepath/#see-19)

[Section titled “See”](https://tauri.app/reference/javascript/api/namespacepath/#see-19)

[runtimeDir](https://tauri.app/reference/javascript/api/namespacepath/#runtimedir)
 for more information.

**Source**: [https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/path.ts#L107](https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/path.ts#L107)

##### [Temp](https://tauri.app/reference/javascript/api/namespacepath/#temp)

[Section titled “Temp”](https://tauri.app/reference/javascript/api/namespacepath/#temp)

    Temp: 12;

###### [See](https://tauri.app/reference/javascript/api/namespacepath/#see-20)

[Section titled “See”](https://tauri.app/reference/javascript/api/namespacepath/#see-20)

[tempDir](https://tauri.app/reference/javascript/api/namespacepath/#tempdir)
 for more information.

**Source**: [https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/path.ts#L67](https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/path.ts#L67)

##### [Template](https://tauri.app/reference/javascript/api/namespacepath/#template)

[Section titled “Template”](https://tauri.app/reference/javascript/api/namespacepath/#template)

    Template: 23;

###### [See](https://tauri.app/reference/javascript/api/namespacepath/#see-21)

[Section titled “See”](https://tauri.app/reference/javascript/api/namespacepath/#see-21)

[templateDir](https://tauri.app/reference/javascript/api/namespacepath/#templatedir)
 for more information.

**Source**: [https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/path.ts#L111](https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/path.ts#L111)

##### [Video](https://tauri.app/reference/javascript/api/namespacepath/#video)

[Section titled “Video”](https://tauri.app/reference/javascript/api/namespacepath/#video)

    Video: 10;

###### [See](https://tauri.app/reference/javascript/api/namespacepath/#see-22)

[Section titled “See”](https://tauri.app/reference/javascript/api/namespacepath/#see-22)

[videoDir](https://tauri.app/reference/javascript/api/namespacepath/#videodir)
 for more information.

**Source**: [https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/path.ts#L59](https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/path.ts#L59)

[Functions](https://tauri.app/reference/javascript/api/namespacepath/#functions)

---------------------------------------------------------------------------------

[Section titled “Functions”](https://tauri.app/reference/javascript/api/namespacepath/#functions)

### [appCacheDir()](https://tauri.app/reference/javascript/api/namespacepath/#appcachedir)

[Section titled “appCacheDir()”](https://tauri.app/reference/javascript/api/namespacepath/#appcachedir)

    function appCacheDir(): Promise<string>

Returns the path to the suggested directory for your app’s cache files. Resolves to `${cacheDir}/${bundleIdentifier}`, where `bundleIdentifier` is the [`identifier`](https://v2.tauri.app/reference/config/#identifier)
 value configured in `tauri.conf.json`.

#### [Returns](https://tauri.app/reference/javascript/api/namespacepath/#returns)

[Section titled “Returns”](https://tauri.app/reference/javascript/api/namespacepath/#returns)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`string`\>

#### [Example](https://tauri.app/reference/javascript/api/namespacepath/#example)

[Section titled “Example”](https://tauri.app/reference/javascript/api/namespacepath/#example)

    import { appCacheDir } from '@tauri-apps/api/path';const appCacheDirPath = await appCacheDir();

#### [Since](https://tauri.app/reference/javascript/api/namespacepath/#since-1)

[Section titled “Since”](https://tauri.app/reference/javascript/api/namespacepath/#since-1)

1.2.0

**Source**: [https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/path.ts#L176](https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/path.ts#L176)

* * *

### [appConfigDir()](https://tauri.app/reference/javascript/api/namespacepath/#appconfigdir)

[Section titled “appConfigDir()”](https://tauri.app/reference/javascript/api/namespacepath/#appconfigdir)

    function appConfigDir(): Promise<string>

Returns the path to the suggested directory for your app’s config files. Resolves to `${configDir}/${bundleIdentifier}`, where `bundleIdentifier` is the [`identifier`](https://v2.tauri.app/reference/config/#identifier)
 value configured in `tauri.conf.json`.

#### [Returns](https://tauri.app/reference/javascript/api/namespacepath/#returns-1)

[Section titled “Returns”](https://tauri.app/reference/javascript/api/namespacepath/#returns-1)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`string`\>

#### [Example](https://tauri.app/reference/javascript/api/namespacepath/#example-1)

[Section titled “Example”](https://tauri.app/reference/javascript/api/namespacepath/#example-1)

    import { appConfigDir } from '@tauri-apps/api/path';const appConfigDirPath = await appConfigDir();

#### [Since](https://tauri.app/reference/javascript/api/namespacepath/#since-2)

[Section titled “Since”](https://tauri.app/reference/javascript/api/namespacepath/#since-2)

1.2.0

**Source**: [https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/path.ts#L125](https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/path.ts#L125)

* * *

### [appDataDir()](https://tauri.app/reference/javascript/api/namespacepath/#appdatadir)

[Section titled “appDataDir()”](https://tauri.app/reference/javascript/api/namespacepath/#appdatadir)

    function appDataDir(): Promise<string>

Returns the path to the suggested directory for your app’s data files. Resolves to `${dataDir}/${bundleIdentifier}`, where `bundleIdentifier` is the [`identifier`](https://v2.tauri.app/reference/config/#identifier)
 value configured in `tauri.conf.json`.

#### [Returns](https://tauri.app/reference/javascript/api/namespacepath/#returns-2)

[Section titled “Returns”](https://tauri.app/reference/javascript/api/namespacepath/#returns-2)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`string`\>

#### [Example](https://tauri.app/reference/javascript/api/namespacepath/#example-2)

[Section titled “Example”](https://tauri.app/reference/javascript/api/namespacepath/#example-2)

    import { appDataDir } from '@tauri-apps/api/path';const appDataDirPath = await appDataDir();

#### [Since](https://tauri.app/reference/javascript/api/namespacepath/#since-3)

[Section titled “Since”](https://tauri.app/reference/javascript/api/namespacepath/#since-3)

1.2.0

**Source**: [https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/path.ts#L142](https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/path.ts#L142)

* * *

### [appLocalDataDir()](https://tauri.app/reference/javascript/api/namespacepath/#applocaldatadir)

[Section titled “appLocalDataDir()”](https://tauri.app/reference/javascript/api/namespacepath/#applocaldatadir)

    function appLocalDataDir(): Promise<string>

Returns the path to the suggested directory for your app’s local data files. Resolves to `${localDataDir}/${bundleIdentifier}`, where `bundleIdentifier` is the [`identifier`](https://v2.tauri.app/reference/config/#identifier)
 value configured in `tauri.conf.json`.

#### [Returns](https://tauri.app/reference/javascript/api/namespacepath/#returns-3)

[Section titled “Returns”](https://tauri.app/reference/javascript/api/namespacepath/#returns-3)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`string`\>

#### [Example](https://tauri.app/reference/javascript/api/namespacepath/#example-3)

[Section titled “Example”](https://tauri.app/reference/javascript/api/namespacepath/#example-3)

    import { appLocalDataDir } from '@tauri-apps/api/path';const appLocalDataDirPath = await appLocalDataDir();

#### [Since](https://tauri.app/reference/javascript/api/namespacepath/#since-4)

[Section titled “Since”](https://tauri.app/reference/javascript/api/namespacepath/#since-4)

1.2.0

**Source**: [https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/path.ts#L159](https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/path.ts#L159)

* * *

### [appLogDir()](https://tauri.app/reference/javascript/api/namespacepath/#applogdir)

[Section titled “appLogDir()”](https://tauri.app/reference/javascript/api/namespacepath/#applogdir)

    function appLogDir(): Promise<string>

Returns the path to the suggested directory for your app’s log files.

Platform-specific

*   **Linux:** Resolves to `${configDir}/${bundleIdentifier}/logs`.
*   **macOS:** Resolves to `${homeDir}/Library/Logs/{bundleIdentifier}`
*   **Windows:** Resolves to `${configDir}/${bundleIdentifier}/logs`.

#### [Returns](https://tauri.app/reference/javascript/api/namespacepath/#returns-4)

[Section titled “Returns”](https://tauri.app/reference/javascript/api/namespacepath/#returns-4)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`string`\>

#### [Example](https://tauri.app/reference/javascript/api/namespacepath/#example-4)

[Section titled “Example”](https://tauri.app/reference/javascript/api/namespacepath/#example-4)

    import { appLogDir } from '@tauri-apps/api/path';const appLogDirPath = await appLogDir();

#### [Since](https://tauri.app/reference/javascript/api/namespacepath/#since-5)

[Section titled “Since”](https://tauri.app/reference/javascript/api/namespacepath/#since-5)

1.2.0

**Source**: [https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/path.ts#L604](https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/path.ts#L604)

* * *

### [audioDir()](https://tauri.app/reference/javascript/api/namespacepath/#audiodir)

[Section titled “audioDir()”](https://tauri.app/reference/javascript/api/namespacepath/#audiodir)

    function audioDir(): Promise<string>

Returns the path to the user’s audio directory.

Platform-specific

*   **Linux:** Resolves to [`xdg-user-dirs`](https://www.freedesktop.org/wiki/Software/xdg-user-dirs/)
    ’ `XDG_MUSIC_DIR`.
*   **macOS:** Resolves to `$HOME/Music`.
*   **Windows:** Resolves to `{FOLDERID_Music}`.

#### [Returns](https://tauri.app/reference/javascript/api/namespacepath/#returns-5)

[Section titled “Returns”](https://tauri.app/reference/javascript/api/namespacepath/#returns-5)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`string`\>

#### [Example](https://tauri.app/reference/javascript/api/namespacepath/#example-5)

[Section titled “Example”](https://tauri.app/reference/javascript/api/namespacepath/#example-5)

    import { audioDir } from '@tauri-apps/api/path';const audioDirPath = await audioDir();

#### [Since](https://tauri.app/reference/javascript/api/namespacepath/#since-6)

[Section titled “Since”](https://tauri.app/reference/javascript/api/namespacepath/#since-6)

1.0.0

**Source**: [https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/path.ts#L198](https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/path.ts#L198)

* * *

### [basename()](https://tauri.app/reference/javascript/api/namespacepath/#basename)

[Section titled “basename()”](https://tauri.app/reference/javascript/api/namespacepath/#basename)

    function basename(path, ext?): Promise<string>

Returns the last portion of a `path`. Trailing directory separators are ignored.

#### [Parameters](https://tauri.app/reference/javascript/api/namespacepath/#parameters)

[Section titled “Parameters”](https://tauri.app/reference/javascript/api/namespacepath/#parameters)

| Parameter | Type | Description |
| --- | --- | --- |
| `path` | `string` | \-  |
| `ext`? | `string` | An optional file extension to be removed from the returned path. |

#### [Returns](https://tauri.app/reference/javascript/api/namespacepath/#returns-6)

[Section titled “Returns”](https://tauri.app/reference/javascript/api/namespacepath/#returns-6)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`string`\>

#### [Example](https://tauri.app/reference/javascript/api/namespacepath/#example-6)

[Section titled “Example”](https://tauri.app/reference/javascript/api/namespacepath/#example-6)

    import { basename } from '@tauri-apps/api/path';const base = await basename('path/to/app.conf');assert(base === 'app.conf');

#### [Since](https://tauri.app/reference/javascript/api/namespacepath/#since-7)

[Section titled “Since”](https://tauri.app/reference/javascript/api/namespacepath/#since-7)

1.0.0

**Source**: [https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/path.ts#L734](https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/path.ts#L734)

* * *

### [cacheDir()](https://tauri.app/reference/javascript/api/namespacepath/#cachedir)

[Section titled “cacheDir()”](https://tauri.app/reference/javascript/api/namespacepath/#cachedir)

    function cacheDir(): Promise<string>

Returns the path to the user’s cache directory.

Platform-specific

*   **Linux:** Resolves to `$XDG_CACHE_HOME` or `$HOME/.cache`.
*   **macOS:** Resolves to `$HOME/Library/Caches`.
*   **Windows:** Resolves to `{FOLDERID_LocalAppData}`.

#### [Returns](https://tauri.app/reference/javascript/api/namespacepath/#returns-7)

[Section titled “Returns”](https://tauri.app/reference/javascript/api/namespacepath/#returns-7)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`string`\>

#### [Example](https://tauri.app/reference/javascript/api/namespacepath/#example-7)

[Section titled “Example”](https://tauri.app/reference/javascript/api/namespacepath/#example-7)

    import { cacheDir } from '@tauri-apps/api/path';const cacheDirPath = await cacheDir();

#### [Since](https://tauri.app/reference/javascript/api/namespacepath/#since-8)

[Section titled “Since”](https://tauri.app/reference/javascript/api/namespacepath/#since-8)

1.0.0

**Source**: [https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/path.ts#L220](https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/path.ts#L220)

* * *

### [configDir()](https://tauri.app/reference/javascript/api/namespacepath/#configdir)

[Section titled “configDir()”](https://tauri.app/reference/javascript/api/namespacepath/#configdir)

    function configDir(): Promise<string>

Returns the path to the user’s config directory.

Platform-specific

*   **Linux:** Resolves to `$XDG_CONFIG_HOME` or `$HOME/.config`.
*   **macOS:** Resolves to `$HOME/Library/Application Support`.
*   **Windows:** Resolves to `{FOLDERID_RoamingAppData}`.

#### [Returns](https://tauri.app/reference/javascript/api/namespacepath/#returns-8)

[Section titled “Returns”](https://tauri.app/reference/javascript/api/namespacepath/#returns-8)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`string`\>

#### [Example](https://tauri.app/reference/javascript/api/namespacepath/#example-8)

[Section titled “Example”](https://tauri.app/reference/javascript/api/namespacepath/#example-8)

    import { configDir } from '@tauri-apps/api/path';const configDirPath = await configDir();

#### [Since](https://tauri.app/reference/javascript/api/namespacepath/#since-9)

[Section titled “Since”](https://tauri.app/reference/javascript/api/namespacepath/#since-9)

1.0.0

**Source**: [https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/path.ts#L242](https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/path.ts#L242)

* * *

### [dataDir()](https://tauri.app/reference/javascript/api/namespacepath/#datadir)

[Section titled “dataDir()”](https://tauri.app/reference/javascript/api/namespacepath/#datadir)

    function dataDir(): Promise<string>

Returns the path to the user’s data directory.

Platform-specific

*   **Linux:** Resolves to `$XDG_DATA_HOME` or `$HOME/.local/share`.
*   **macOS:** Resolves to `$HOME/Library/Application Support`.
*   **Windows:** Resolves to `{FOLDERID_RoamingAppData}`.

#### [Returns](https://tauri.app/reference/javascript/api/namespacepath/#returns-9)

[Section titled “Returns”](https://tauri.app/reference/javascript/api/namespacepath/#returns-9)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`string`\>

#### [Example](https://tauri.app/reference/javascript/api/namespacepath/#example-9)

[Section titled “Example”](https://tauri.app/reference/javascript/api/namespacepath/#example-9)

    import { dataDir } from '@tauri-apps/api/path';const dataDirPath = await dataDir();

#### [Since](https://tauri.app/reference/javascript/api/namespacepath/#since-10)

[Section titled “Since”](https://tauri.app/reference/javascript/api/namespacepath/#since-10)

1.0.0

**Source**: [https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/path.ts#L264](https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/path.ts#L264)

* * *

### [delimiter()](https://tauri.app/reference/javascript/api/namespacepath/#delimiter)

[Section titled “delimiter()”](https://tauri.app/reference/javascript/api/namespacepath/#delimiter)

    function delimiter(): string

Returns the platform-specific path segment delimiter:

*   `;` on Windows
*   `:` on POSIX

#### [Returns](https://tauri.app/reference/javascript/api/namespacepath/#returns-10)

[Section titled “Returns”](https://tauri.app/reference/javascript/api/namespacepath/#returns-10)

`string`

#### [Since](https://tauri.app/reference/javascript/api/namespacepath/#since-11)

[Section titled “Since”](https://tauri.app/reference/javascript/api/namespacepath/#since-11)

2.0.0

**Source**: [https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/path.ts#L644](https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/path.ts#L644)

* * *

### [desktopDir()](https://tauri.app/reference/javascript/api/namespacepath/#desktopdir)

[Section titled “desktopDir()”](https://tauri.app/reference/javascript/api/namespacepath/#desktopdir)

    function desktopDir(): Promise<string>

Returns the path to the user’s desktop directory.

Platform-specific

*   **Linux:** Resolves to [`xdg-user-dirs`](https://www.freedesktop.org/wiki/Software/xdg-user-dirs/)
    ’ `XDG_DESKTOP_DIR`.
*   **macOS:** Resolves to `$HOME/Desktop`.
*   **Windows:** Resolves to `{FOLDERID_Desktop}`.

#### [Returns](https://tauri.app/reference/javascript/api/namespacepath/#returns-11)

[Section titled “Returns”](https://tauri.app/reference/javascript/api/namespacepath/#returns-11)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`string`\>

#### [Example](https://tauri.app/reference/javascript/api/namespacepath/#example-10)

[Section titled “Example”](https://tauri.app/reference/javascript/api/namespacepath/#example-10)

    import { desktopDir } from '@tauri-apps/api/path';const desktopPath = await desktopDir();

#### [Since](https://tauri.app/reference/javascript/api/namespacepath/#since-12)

[Section titled “Since”](https://tauri.app/reference/javascript/api/namespacepath/#since-12)

1.0.0

**Source**: [https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/path.ts#L286](https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/path.ts#L286)

* * *

### [dirname()](https://tauri.app/reference/javascript/api/namespacepath/#dirname)

[Section titled “dirname()”](https://tauri.app/reference/javascript/api/namespacepath/#dirname)

    function dirname(path): Promise<string>

Returns the parent directory of a given `path`. Trailing directory separators are ignored.

#### [Parameters](https://tauri.app/reference/javascript/api/namespacepath/#parameters-1)

[Section titled “Parameters”](https://tauri.app/reference/javascript/api/namespacepath/#parameters-1)

| Parameter | Type |
| --- | --- |
| `path` | `string` |

#### [Returns](https://tauri.app/reference/javascript/api/namespacepath/#returns-12)

[Section titled “Returns”](https://tauri.app/reference/javascript/api/namespacepath/#returns-12)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`string`\>

#### [Example](https://tauri.app/reference/javascript/api/namespacepath/#example-11)

[Section titled “Example”](https://tauri.app/reference/javascript/api/namespacepath/#example-11)

    import { dirname } from '@tauri-apps/api/path';const dir = await dirname('/path/to/somedir/');assert(dir === '/path/to');

#### [Since](https://tauri.app/reference/javascript/api/namespacepath/#since-13)

[Section titled “Since”](https://tauri.app/reference/javascript/api/namespacepath/#since-13)

1.0.0

**Source**: [https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/path.ts#L703](https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/path.ts#L703)

* * *

### [documentDir()](https://tauri.app/reference/javascript/api/namespacepath/#documentdir)

[Section titled “documentDir()”](https://tauri.app/reference/javascript/api/namespacepath/#documentdir)

    function documentDir(): Promise<string>

Returns the path to the user’s document directory.

#### [Returns](https://tauri.app/reference/javascript/api/namespacepath/#returns-13)

[Section titled “Returns”](https://tauri.app/reference/javascript/api/namespacepath/#returns-13)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`string`\>

#### [Example](https://tauri.app/reference/javascript/api/namespacepath/#example-12)

[Section titled “Example”](https://tauri.app/reference/javascript/api/namespacepath/#example-12)

    import { documentDir } from '@tauri-apps/api/path';const documentDirPath = await documentDir();

Platform-specific

*   **Linux:** Resolves to [`xdg-user-dirs`](https://www.freedesktop.org/wiki/Software/xdg-user-dirs/)
    ’ `XDG_DOCUMENTS_DIR`.
*   **macOS:** Resolves to `$HOME/Documents`.
*   **Windows:** Resolves to `{FOLDERID_Documents}`.

#### [Since](https://tauri.app/reference/javascript/api/namespacepath/#since-14)

[Section titled “Since”](https://tauri.app/reference/javascript/api/namespacepath/#since-14)

1.0.0

**Source**: [https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/path.ts#L308](https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/path.ts#L308)

* * *

### [downloadDir()](https://tauri.app/reference/javascript/api/namespacepath/#downloaddir)

[Section titled “downloadDir()”](https://tauri.app/reference/javascript/api/namespacepath/#downloaddir)

    function downloadDir(): Promise<string>

Returns the path to the user’s download directory.

Platform-specific

*   **Linux**: Resolves to [`xdg-user-dirs`](https://www.freedesktop.org/wiki/Software/xdg-user-dirs/)
    ’ `XDG_DOWNLOAD_DIR`.
*   **macOS**: Resolves to `$HOME/Downloads`.
*   **Windows**: Resolves to `{FOLDERID_Downloads}`.

#### [Returns](https://tauri.app/reference/javascript/api/namespacepath/#returns-14)

[Section titled “Returns”](https://tauri.app/reference/javascript/api/namespacepath/#returns-14)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`string`\>

#### [Example](https://tauri.app/reference/javascript/api/namespacepath/#example-13)

[Section titled “Example”](https://tauri.app/reference/javascript/api/namespacepath/#example-13)

    import { downloadDir } from '@tauri-apps/api/path';const downloadDirPath = await downloadDir();

#### [Since](https://tauri.app/reference/javascript/api/namespacepath/#since-15)

[Section titled “Since”](https://tauri.app/reference/javascript/api/namespacepath/#since-15)

1.0.0

**Source**: [https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/path.ts#L330](https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/path.ts#L330)

* * *

### [executableDir()](https://tauri.app/reference/javascript/api/namespacepath/#executabledir)

[Section titled “executableDir()”](https://tauri.app/reference/javascript/api/namespacepath/#executabledir)

    function executableDir(): Promise<string>

Returns the path to the user’s executable directory.

Platform-specific

*   **Linux:** Resolves to `$XDG_BIN_HOME/../bin` or `$XDG_DATA_HOME/../bin` or `$HOME/.local/bin`.
*   **macOS:** Not supported.
*   **Windows:** Not supported.

#### [Returns](https://tauri.app/reference/javascript/api/namespacepath/#returns-15)

[Section titled “Returns”](https://tauri.app/reference/javascript/api/namespacepath/#returns-15)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`string`\>

#### [Example](https://tauri.app/reference/javascript/api/namespacepath/#example-14)

[Section titled “Example”](https://tauri.app/reference/javascript/api/namespacepath/#example-14)

    import { executableDir } from '@tauri-apps/api/path';const executableDirPath = await executableDir();

#### [Since](https://tauri.app/reference/javascript/api/namespacepath/#since-16)

[Section titled “Since”](https://tauri.app/reference/javascript/api/namespacepath/#since-16)

1.0.0

**Source**: [https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/path.ts#L352](https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/path.ts#L352)

* * *

### [extname()](https://tauri.app/reference/javascript/api/namespacepath/#extname)

[Section titled “extname()”](https://tauri.app/reference/javascript/api/namespacepath/#extname)

    function extname(path): Promise<string>

Returns the extension of the `path`.

#### [Parameters](https://tauri.app/reference/javascript/api/namespacepath/#parameters-2)

[Section titled “Parameters”](https://tauri.app/reference/javascript/api/namespacepath/#parameters-2)

| Parameter | Type |
| --- | --- |
| `path` | `string` |

#### [Returns](https://tauri.app/reference/javascript/api/namespacepath/#returns-16)

[Section titled “Returns”](https://tauri.app/reference/javascript/api/namespacepath/#returns-16)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`string`\>

#### [Example](https://tauri.app/reference/javascript/api/namespacepath/#example-15)

[Section titled “Example”](https://tauri.app/reference/javascript/api/namespacepath/#example-15)

    import { extname } from '@tauri-apps/api/path';const ext = await extname('/path/to/file.html');assert(ext === 'html');

#### [Since](https://tauri.app/reference/javascript/api/namespacepath/#since-17)

[Section titled “Since”](https://tauri.app/reference/javascript/api/namespacepath/#since-17)

1.0.0

**Source**: [https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/path.ts#L718](https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/path.ts#L718)

* * *

### [fontDir()](https://tauri.app/reference/javascript/api/namespacepath/#fontdir)

[Section titled “fontDir()”](https://tauri.app/reference/javascript/api/namespacepath/#fontdir)

    function fontDir(): Promise<string>

Returns the path to the user’s font directory.

Platform-specific

*   **Linux:** Resolves to `$XDG_DATA_HOME/fonts` or `$HOME/.local/share/fonts`.
*   **macOS:** Resolves to `$HOME/Library/Fonts`.
*   **Windows:** Not supported.

#### [Returns](https://tauri.app/reference/javascript/api/namespacepath/#returns-17)

[Section titled “Returns”](https://tauri.app/reference/javascript/api/namespacepath/#returns-17)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`string`\>

#### [Example](https://tauri.app/reference/javascript/api/namespacepath/#example-16)

[Section titled “Example”](https://tauri.app/reference/javascript/api/namespacepath/#example-16)

    import { fontDir } from '@tauri-apps/api/path';const fontDirPath = await fontDir();

#### [Since](https://tauri.app/reference/javascript/api/namespacepath/#since-18)

[Section titled “Since”](https://tauri.app/reference/javascript/api/namespacepath/#since-18)

1.0.0

**Source**: [https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/path.ts#L374](https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/path.ts#L374)

* * *

### [homeDir()](https://tauri.app/reference/javascript/api/namespacepath/#homedir)

[Section titled “homeDir()”](https://tauri.app/reference/javascript/api/namespacepath/#homedir)

    function homeDir(): Promise<string>

Returns the path to the user’s home directory.

Platform-specific

*   **Linux:** Resolves to `$HOME`.
*   **macOS:** Resolves to `$HOME`.
*   **Windows:** Resolves to `{FOLDERID_Profile}`.

#### [Returns](https://tauri.app/reference/javascript/api/namespacepath/#returns-18)

[Section titled “Returns”](https://tauri.app/reference/javascript/api/namespacepath/#returns-18)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`string`\>

#### [Example](https://tauri.app/reference/javascript/api/namespacepath/#example-17)

[Section titled “Example”](https://tauri.app/reference/javascript/api/namespacepath/#example-17)

    import { homeDir } from '@tauri-apps/api/path';const homeDirPath = await homeDir();

#### [Since](https://tauri.app/reference/javascript/api/namespacepath/#since-19)

[Section titled “Since”](https://tauri.app/reference/javascript/api/namespacepath/#since-19)

1.0.0

**Source**: [https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/path.ts#L396](https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/path.ts#L396)

* * *

### [isAbsolute()](https://tauri.app/reference/javascript/api/namespacepath/#isabsolute)

[Section titled “isAbsolute()”](https://tauri.app/reference/javascript/api/namespacepath/#isabsolute)

    function isAbsolute(path): Promise<boolean>

Returns whether the path is absolute or not.

#### [Parameters](https://tauri.app/reference/javascript/api/namespacepath/#parameters-3)

[Section titled “Parameters”](https://tauri.app/reference/javascript/api/namespacepath/#parameters-3)

| Parameter | Type |
| --- | --- |
| `path` | `string` |

#### [Returns](https://tauri.app/reference/javascript/api/namespacepath/#returns-19)

[Section titled “Returns”](https://tauri.app/reference/javascript/api/namespacepath/#returns-19)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`boolean`\>

#### [Example](https://tauri.app/reference/javascript/api/namespacepath/#example-18)

[Section titled “Example”](https://tauri.app/reference/javascript/api/namespacepath/#example-18)

    import { isAbsolute } from '@tauri-apps/api/path';assert(await isAbsolute('/home/tauri'));

#### [Since](https://tauri.app/reference/javascript/api/namespacepath/#since-20)

[Section titled “Since”](https://tauri.app/reference/javascript/api/namespacepath/#since-20)

1.0.0

**Source**: [https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/path.ts#L748](https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/path.ts#L748)

* * *

### [join()](https://tauri.app/reference/javascript/api/namespacepath/#join)

[Section titled “join()”](https://tauri.app/reference/javascript/api/namespacepath/#join)

    function join(...paths): Promise<string>

Joins all given `path` segments together using the platform-specific separator as a delimiter, then normalizes the resulting path.

#### [Parameters](https://tauri.app/reference/javascript/api/namespacepath/#parameters-4)

[Section titled “Parameters”](https://tauri.app/reference/javascript/api/namespacepath/#parameters-4)

| Parameter | Type |
| --- | --- |
| …`paths` | `string`\[\] |

#### [Returns](https://tauri.app/reference/javascript/api/namespacepath/#returns-20)

[Section titled “Returns”](https://tauri.app/reference/javascript/api/namespacepath/#returns-20)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`string`\>

#### [Example](https://tauri.app/reference/javascript/api/namespacepath/#example-19)

[Section titled “Example”](https://tauri.app/reference/javascript/api/namespacepath/#example-19)

    import { join, appDataDir } from '@tauri-apps/api/path';const appDataDirPath = await appDataDir();const path = await join(appDataDirPath, 'users', 'tauri', 'avatar.png');

#### [Since](https://tauri.app/reference/javascript/api/namespacepath/#since-21)

[Section titled “Since”](https://tauri.app/reference/javascript/api/namespacepath/#since-21)

1.0.0

**Source**: [https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/path.ts#L688](https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/path.ts#L688)

* * *

### [localDataDir()](https://tauri.app/reference/javascript/api/namespacepath/#localdatadir)

[Section titled “localDataDir()”](https://tauri.app/reference/javascript/api/namespacepath/#localdatadir)

    function localDataDir(): Promise<string>

Returns the path to the user’s local data directory.

Platform-specific

*   **Linux:** Resolves to `$XDG_DATA_HOME` or `$HOME/.local/share`.
*   **macOS:** Resolves to `$HOME/Library/Application Support`.
*   **Windows:** Resolves to `{FOLDERID_LocalAppData}`.

#### [Returns](https://tauri.app/reference/javascript/api/namespacepath/#returns-21)

[Section titled “Returns”](https://tauri.app/reference/javascript/api/namespacepath/#returns-21)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`string`\>

#### [Example](https://tauri.app/reference/javascript/api/namespacepath/#example-20)

[Section titled “Example”](https://tauri.app/reference/javascript/api/namespacepath/#example-20)

    import { localDataDir } from '@tauri-apps/api/path';const localDataDirPath = await localDataDir();

#### [Since](https://tauri.app/reference/javascript/api/namespacepath/#since-22)

[Section titled “Since”](https://tauri.app/reference/javascript/api/namespacepath/#since-22)

1.0.0

**Source**: [https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/path.ts#L418](https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/path.ts#L418)

* * *

### [normalize()](https://tauri.app/reference/javascript/api/namespacepath/#normalize)

[Section titled “normalize()”](https://tauri.app/reference/javascript/api/namespacepath/#normalize)

    function normalize(path): Promise<string>

Normalizes the given `path`, resolving `'..'` and `'.'` segments and resolve symbolic links.

#### [Parameters](https://tauri.app/reference/javascript/api/namespacepath/#parameters-5)

[Section titled “Parameters”](https://tauri.app/reference/javascript/api/namespacepath/#parameters-5)

| Parameter | Type |
| --- | --- |
| `path` | `string` |

#### [Returns](https://tauri.app/reference/javascript/api/namespacepath/#returns-22)

[Section titled “Returns”](https://tauri.app/reference/javascript/api/namespacepath/#returns-22)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`string`\>

#### [Example](https://tauri.app/reference/javascript/api/namespacepath/#example-21)

[Section titled “Example”](https://tauri.app/reference/javascript/api/namespacepath/#example-21)

    import { normalize, appDataDir } from '@tauri-apps/api/path';const appDataDirPath = await appDataDir();const path = await normalize(`${appDataDirPath}/../users/tauri/avatar.png`);

#### [Since](https://tauri.app/reference/javascript/api/namespacepath/#since-23)

[Section titled “Since”](https://tauri.app/reference/javascript/api/namespacepath/#since-23)

1.0.0

**Source**: [https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/path.ts#L673](https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/path.ts#L673)

* * *

### [pictureDir()](https://tauri.app/reference/javascript/api/namespacepath/#picturedir)

[Section titled “pictureDir()”](https://tauri.app/reference/javascript/api/namespacepath/#picturedir)

    function pictureDir(): Promise<string>

Returns the path to the user’s picture directory.

Platform-specific

*   **Linux:** Resolves to [`xdg-user-dirs`](https://www.freedesktop.org/wiki/Software/xdg-user-dirs/)
    ’ `XDG_PICTURES_DIR`.
*   **macOS:** Resolves to `$HOME/Pictures`.
*   **Windows:** Resolves to `{FOLDERID_Pictures}`.

#### [Returns](https://tauri.app/reference/javascript/api/namespacepath/#returns-23)

[Section titled “Returns”](https://tauri.app/reference/javascript/api/namespacepath/#returns-23)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`string`\>

#### [Example](https://tauri.app/reference/javascript/api/namespacepath/#example-22)

[Section titled “Example”](https://tauri.app/reference/javascript/api/namespacepath/#example-22)

    import { pictureDir } from '@tauri-apps/api/path';const pictureDirPath = await pictureDir();

#### [Since](https://tauri.app/reference/javascript/api/namespacepath/#since-24)

[Section titled “Since”](https://tauri.app/reference/javascript/api/namespacepath/#since-24)

1.0.0

**Source**: [https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/path.ts#L440](https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/path.ts#L440)

* * *

### [publicDir()](https://tauri.app/reference/javascript/api/namespacepath/#publicdir)

[Section titled “publicDir()”](https://tauri.app/reference/javascript/api/namespacepath/#publicdir)

    function publicDir(): Promise<string>

Returns the path to the user’s public directory.

Platform-specific

*   **Linux:** Resolves to [`xdg-user-dirs`](https://www.freedesktop.org/wiki/Software/xdg-user-dirs/)
    ’ `XDG_PUBLICSHARE_DIR`.
*   **macOS:** Resolves to `$HOME/Public`.
*   **Windows:** Resolves to `{FOLDERID_Public}`.

#### [Returns](https://tauri.app/reference/javascript/api/namespacepath/#returns-24)

[Section titled “Returns”](https://tauri.app/reference/javascript/api/namespacepath/#returns-24)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`string`\>

#### [Example](https://tauri.app/reference/javascript/api/namespacepath/#example-23)

[Section titled “Example”](https://tauri.app/reference/javascript/api/namespacepath/#example-23)

    import { publicDir } from '@tauri-apps/api/path';const publicDirPath = await publicDir();

#### [Since](https://tauri.app/reference/javascript/api/namespacepath/#since-25)

[Section titled “Since”](https://tauri.app/reference/javascript/api/namespacepath/#since-25)

1.0.0

**Source**: [https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/path.ts#L462](https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/path.ts#L462)

* * *

### [resolve()](https://tauri.app/reference/javascript/api/namespacepath/#resolve)

[Section titled “resolve()”](https://tauri.app/reference/javascript/api/namespacepath/#resolve)

    function resolve(...paths): Promise<string>

Resolves a sequence of `paths` or `path` segments into an absolute path.

#### [Parameters](https://tauri.app/reference/javascript/api/namespacepath/#parameters-6)

[Section titled “Parameters”](https://tauri.app/reference/javascript/api/namespacepath/#parameters-6)

| Parameter | Type |
| --- | --- |
| …`paths` | `string`\[\] |

#### [Returns](https://tauri.app/reference/javascript/api/namespacepath/#returns-25)

[Section titled “Returns”](https://tauri.app/reference/javascript/api/namespacepath/#returns-25)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`string`\>

#### [Example](https://tauri.app/reference/javascript/api/namespacepath/#example-24)

[Section titled “Example”](https://tauri.app/reference/javascript/api/namespacepath/#example-24)

    import { resolve, appDataDir } from '@tauri-apps/api/path';const appDataDirPath = await appDataDir();const path = await resolve(appDataDirPath, '..', 'users', 'tauri', 'avatar.png');

#### [Since](https://tauri.app/reference/javascript/api/namespacepath/#since-26)

[Section titled “Since”](https://tauri.app/reference/javascript/api/namespacepath/#since-26)

1.0.0

**Source**: [https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/path.ts#L658](https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/path.ts#L658)

* * *

### [resolveResource()](https://tauri.app/reference/javascript/api/namespacepath/#resolveresource)

[Section titled “resolveResource()”](https://tauri.app/reference/javascript/api/namespacepath/#resolveresource)

    function resolveResource(resourcePath): Promise<string>

Resolve the path to a resource file.

#### [Parameters](https://tauri.app/reference/javascript/api/namespacepath/#parameters-7)

[Section titled “Parameters”](https://tauri.app/reference/javascript/api/namespacepath/#parameters-7)

| Parameter | Type | Description |
| --- | --- | --- |
| `resourcePath` | `string` | The path to the resource. Must follow the same syntax as defined in `tauri.conf.json > bundle > resources`, i.e. keeping subfolders and parent dir components (`../`). |

#### [Returns](https://tauri.app/reference/javascript/api/namespacepath/#returns-26)

[Section titled “Returns”](https://tauri.app/reference/javascript/api/namespacepath/#returns-26)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`string`\>

The full path to the resource.

#### [Example](https://tauri.app/reference/javascript/api/namespacepath/#example-25)

[Section titled “Example”](https://tauri.app/reference/javascript/api/namespacepath/#example-25)

    import { resolveResource } from '@tauri-apps/api/path';const resourcePath = await resolveResource('script.sh');

#### [Since](https://tauri.app/reference/javascript/api/namespacepath/#since-27)

[Section titled “Since”](https://tauri.app/reference/javascript/api/namespacepath/#since-27)

1.0.0

**Source**: [https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/path.ts#L515](https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/path.ts#L515)

* * *

### [resourceDir()](https://tauri.app/reference/javascript/api/namespacepath/#resourcedir)

[Section titled “resourceDir()”](https://tauri.app/reference/javascript/api/namespacepath/#resourcedir)

    function resourceDir(): Promise<string>

Returns the path to the application’s resource directory. To resolve a resource path, see [`resolveResource`](https://tauri.app/reference/javascript/api/namespacepath/#resolveresource)
.

[Platform-specific](https://tauri.app/reference/javascript/api/namespacepath/#platform-specific)

-------------------------------------------------------------------------------------------------

[Section titled “Platform-specific”](https://tauri.app/reference/javascript/api/namespacepath/#platform-specific)

Although we provide the exact path where this function resolves to, this is not a contract and things might change in the future

*   **Windows:** Resolves to the directory that contains the main executable.
*   **Linux:** When running in an AppImage, the `APPDIR` variable will be set to the mounted location of the app, and the resource dir will be `${APPDIR}/usr/lib/${exe_name}`. If not running in an AppImage, the path is `/usr/lib/${exe_name}`. When running the app from `src-tauri/target/(debug|release)/`, the path is `${exe_dir}/../lib/${exe_name}`.
*   **macOS:** Resolves to `${exe_dir}/../Resources` (inside .app).
*   **iOS:** Resolves to `${exe_dir}/assets`.
*   **Android:** Currently the resources are stored in the APK as assets so it’s not a normal file system path, we return a special URI prefix `asset://localhost/` here that can be used with the [file system plugin](https://tauri.app/plugin/file-system/)
    ,

#### [Returns](https://tauri.app/reference/javascript/api/namespacepath/#returns-27)

[Section titled “Returns”](https://tauri.app/reference/javascript/api/namespacepath/#returns-27)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`string`\>

#### [Example](https://tauri.app/reference/javascript/api/namespacepath/#example-26)

[Section titled “Example”](https://tauri.app/reference/javascript/api/namespacepath/#example-26)

    import { resourceDir } from '@tauri-apps/api/path';const resourceDirPath = await resourceDir();

#### [Since](https://tauri.app/reference/javascript/api/namespacepath/#since-28)

[Section titled “Since”](https://tauri.app/reference/javascript/api/namespacepath/#since-28)

1.0.0

**Source**: [https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/path.ts#L495](https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/path.ts#L495)

* * *

### [runtimeDir()](https://tauri.app/reference/javascript/api/namespacepath/#runtimedir)

[Section titled “runtimeDir()”](https://tauri.app/reference/javascript/api/namespacepath/#runtimedir)

    function runtimeDir(): Promise<string>

Returns the path to the user’s runtime directory.

Platform-specific

*   **Linux:** Resolves to `$XDG_RUNTIME_DIR`.
*   **macOS:** Not supported.
*   **Windows:** Not supported.

#### [Returns](https://tauri.app/reference/javascript/api/namespacepath/#returns-28)

[Section titled “Returns”](https://tauri.app/reference/javascript/api/namespacepath/#returns-28)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`string`\>

#### [Example](https://tauri.app/reference/javascript/api/namespacepath/#example-27)

[Section titled “Example”](https://tauri.app/reference/javascript/api/namespacepath/#example-27)

    import { runtimeDir } from '@tauri-apps/api/path';const runtimeDirPath = await runtimeDir();

#### [Since](https://tauri.app/reference/javascript/api/namespacepath/#since-29)

[Section titled “Since”](https://tauri.app/reference/javascript/api/namespacepath/#since-29)

1.0.0

**Source**: [https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/path.ts#L538](https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/path.ts#L538)

* * *

### [sep()](https://tauri.app/reference/javascript/api/namespacepath/#sep)

[Section titled “sep()”](https://tauri.app/reference/javascript/api/namespacepath/#sep)

    function sep(): string

Returns the platform-specific path segment separator:

*   `\` on Windows
*   `/` on POSIX

#### [Returns](https://tauri.app/reference/javascript/api/namespacepath/#returns-29)

[Section titled “Returns”](https://tauri.app/reference/javascript/api/namespacepath/#returns-29)

`string`

#### [Since](https://tauri.app/reference/javascript/api/namespacepath/#since-30)

[Section titled “Since”](https://tauri.app/reference/javascript/api/namespacepath/#since-30)

2.0.0

**Source**: [https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/path.ts#L633](https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/path.ts#L633)

* * *

### [tempDir()](https://tauri.app/reference/javascript/api/namespacepath/#tempdir)

[Section titled “tempDir()”](https://tauri.app/reference/javascript/api/namespacepath/#tempdir)

    function tempDir(): Promise<string>

Returns a temporary directory.

#### [Returns](https://tauri.app/reference/javascript/api/namespacepath/#returns-30)

[Section titled “Returns”](https://tauri.app/reference/javascript/api/namespacepath/#returns-30)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`string`\>

#### [Example](https://tauri.app/reference/javascript/api/namespacepath/#example-28)

[Section titled “Example”](https://tauri.app/reference/javascript/api/namespacepath/#example-28)

    import { tempDir } from '@tauri-apps/api/path';const temp = await tempDir();

#### [Since](https://tauri.app/reference/javascript/api/namespacepath/#since-31)

[Section titled “Since”](https://tauri.app/reference/javascript/api/namespacepath/#since-31)

2.0.0

**Source**: [https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/path.ts#L620](https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/path.ts#L620)

* * *

### [templateDir()](https://tauri.app/reference/javascript/api/namespacepath/#templatedir)

[Section titled “templateDir()”](https://tauri.app/reference/javascript/api/namespacepath/#templatedir)

    function templateDir(): Promise<string>

Returns the path to the user’s template directory.

Platform-specific

*   **Linux:** Resolves to [`xdg-user-dirs`](https://www.freedesktop.org/wiki/Software/xdg-user-dirs/)
    ’ `XDG_TEMPLATES_DIR`.
*   **macOS:** Not supported.
*   **Windows:** Resolves to `{FOLDERID_Templates}`.

#### [Returns](https://tauri.app/reference/javascript/api/namespacepath/#returns-31)

[Section titled “Returns”](https://tauri.app/reference/javascript/api/namespacepath/#returns-31)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`string`\>

#### [Example](https://tauri.app/reference/javascript/api/namespacepath/#example-29)

[Section titled “Example”](https://tauri.app/reference/javascript/api/namespacepath/#example-29)

    import { templateDir } from '@tauri-apps/api/path';const templateDirPath = await templateDir();

#### [Since](https://tauri.app/reference/javascript/api/namespacepath/#since-32)

[Section titled “Since”](https://tauri.app/reference/javascript/api/namespacepath/#since-32)

1.0.0

**Source**: [https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/path.ts#L560](https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/path.ts#L560)

* * *

### [videoDir()](https://tauri.app/reference/javascript/api/namespacepath/#videodir)

[Section titled “videoDir()”](https://tauri.app/reference/javascript/api/namespacepath/#videodir)

    function videoDir(): Promise<string>

Returns the path to the user’s video directory.

Platform-specific

*   **Linux:** Resolves to [`xdg-user-dirs`](https://www.freedesktop.org/wiki/Software/xdg-user-dirs/)
    ’ `XDG_VIDEOS_DIR`.
*   **macOS:** Resolves to `$HOME/Movies`.
*   **Windows:** Resolves to `{FOLDERID_Videos}`.

#### [Returns](https://tauri.app/reference/javascript/api/namespacepath/#returns-32)

[Section titled “Returns”](https://tauri.app/reference/javascript/api/namespacepath/#returns-32)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`string`\>

#### [Example](https://tauri.app/reference/javascript/api/namespacepath/#example-30)

[Section titled “Example”](https://tauri.app/reference/javascript/api/namespacepath/#example-30)

    import { videoDir } from '@tauri-apps/api/path';const videoDirPath = await videoDir();

#### [Since](https://tauri.app/reference/javascript/api/namespacepath/#since-33)

[Section titled “Since”](https://tauri.app/reference/javascript/api/namespacepath/#since-33)

1.0.0

**Source**: [https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/path.ts#L582](https://github.com/tauri-apps/tauri/blob/dev/packages/api/src/path.ts#L582)

* * *

[Support on Open Collective](https://opencollective.com/tauri)
 [Sponsor on GitHub](https://github.com/sponsors/tauri-apps)

© 2026 Tauri Contributors. CC-BY / MIT

---

# @tauri-apps/plugin-fs | Tauri

[Skip to content](https://tauri.app/reference/javascript/fs/#_top)

@tauri-apps/plugin-fs
=====================

Access the file system.

[Security](https://tauri.app/reference/javascript/fs/#security)

----------------------------------------------------------------

[Section titled “Security”](https://tauri.app/reference/javascript/fs/#security)

This module prevents path traversal, not allowing parent directory accessors to be used (i.e. “/usr/path/to/../file” or ”../path/to/file” paths are not allowed). Paths accessed with this API must be either relative to one of the [base directories](https://tauri.app/reference/javascript/fs/#basedirectory)
 or created with the [path API](https://v2.tauri.app/reference/javascript/api/namespacepath/)
.

The API has a scope configuration that forces you to restrict the paths that can be accessed using glob patterns.

The scope configuration is an array of glob patterns describing file/directory paths that are allowed. For instance, this scope configuration allows **all** enabled `fs` APIs to (only) access files in the _databases_ directory of the [`$APPDATA` directory](https://v2.tauri.app/reference/javascript/api/namespacepath/#appdatadir)
:

    {  "permissions": [    {      "identifier": "fs:scope",      "allow": [{ "path": "$APPDATA/databases/*" }]    }  ]}

Scopes can also be applied to specific `fs` APIs by using the API’s identifier instead of `fs:scope`:

    {  "permissions": [    {      "identifier": "fs:allow-exists",      "allow": [{ "path": "$APPDATA/databases/*" }]    }  ]}

Notice the use of the `$APPDATA` variable. The value is injected at runtime, resolving to the [app data directory](https://v2.tauri.app/reference/javascript/api/namespacepath/#appdatadir)
.

The available variables are: [`$APPCONFIG`](https://v2.tauri.app/reference/javascript/api/namespacepath/#appconfigdir)
, [`$APPDATA`](https://v2.tauri.app/reference/javascript/api/namespacepath/#appdatadir)
, [`$APPLOCALDATA`](https://v2.tauri.app/reference/javascript/api/namespacepath/#applocaldatadir)
, [`$APPCACHE`](https://v2.tauri.app/reference/javascript/api/namespacepath/#appcachedir)
, [`$APPLOG`](https://v2.tauri.app/reference/javascript/api/namespacepath/#applogdir)
, [`$AUDIO`](https://v2.tauri.app/reference/javascript/api/namespacepath/#audiodir)
, [`$CACHE`](https://v2.tauri.app/reference/javascript/api/namespacepath/#cachedir)
, [`$CONFIG`](https://v2.tauri.app/reference/javascript/api/namespacepath/#configdir)
, [`$DATA`](https://v2.tauri.app/reference/javascript/api/namespacepath/#datadir)
, [`$LOCALDATA`](https://v2.tauri.app/reference/javascript/api/namespacepath/#localdatadir)
, [`$DESKTOP`](https://v2.tauri.app/reference/javascript/api/namespacepath/#desktopdir)
, [`$DOCUMENT`](https://v2.tauri.app/reference/javascript/api/namespacepath/#documentdir)
, [`$DOWNLOAD`](https://v2.tauri.app/reference/javascript/api/namespacepath/#downloaddir)
, [`$EXE`](https://v2.tauri.app/reference/javascript/api/namespacepath/#executabledir)
, [`$FONT`](https://v2.tauri.app/reference/javascript/api/namespacepath/#fontdir)
, [`$HOME`](https://v2.tauri.app/reference/javascript/api/namespacepath/#homedir)
, [`$PICTURE`](https://v2.tauri.app/reference/javascript/api/namespacepath/#picturedir)
, [`$PUBLIC`](https://v2.tauri.app/reference/javascript/api/namespacepath/#publicdir)
, [`$RUNTIME`](https://v2.tauri.app/reference/javascript/api/namespacepath/#runtimedir)
, [`$TEMPLATE`](https://v2.tauri.app/reference/javascript/api/namespacepath/#templatedir)
, [`$VIDEO`](https://v2.tauri.app/reference/javascript/api/namespacepath/#videodir)
, [`$RESOURCE`](https://v2.tauri.app/reference/javascript/api/namespacepath/#resourcedir)
, [`$TEMP`](https://v2.tauri.app/reference/javascript/api/namespacepath/#tempdir)
.

Trying to execute any API with a URL not configured on the scope results in a promise rejection due to denied access.

[Enumerations](https://tauri.app/reference/javascript/fs/#enumerations)

------------------------------------------------------------------------

[Section titled “Enumerations”](https://tauri.app/reference/javascript/fs/#enumerations)

### [BaseDirectory](https://tauri.app/reference/javascript/fs/#basedirectory)

[Section titled “BaseDirectory”](https://tauri.app/reference/javascript/fs/#basedirectory)

#### [Since](https://tauri.app/reference/javascript/fs/#since)

[Section titled “Since”](https://tauri.app/reference/javascript/fs/#since)

2.0.0

#### [Enumeration Members](https://tauri.app/reference/javascript/fs/#enumeration-members)

[Section titled “Enumeration Members”](https://tauri.app/reference/javascript/fs/#enumeration-members)

##### [AppCache](https://tauri.app/reference/javascript/fs/#appcache)

[Section titled “AppCache”](https://tauri.app/reference/javascript/fs/#appcache)

    AppCache: 16;

###### [See](https://tauri.app/reference/javascript/fs/#see)

[Section titled “See”](https://tauri.app/reference/javascript/fs/#see)

appCacheDir for more information.

**Source**: undefined

##### [AppConfig](https://tauri.app/reference/javascript/fs/#appconfig)

[Section titled “AppConfig”](https://tauri.app/reference/javascript/fs/#appconfig)

    AppConfig: 13;

###### [See](https://tauri.app/reference/javascript/fs/#see-1)

[Section titled “See”](https://tauri.app/reference/javascript/fs/#see-1)

appConfigDir for more information.

**Source**: undefined

##### [AppData](https://tauri.app/reference/javascript/fs/#appdata)

[Section titled “AppData”](https://tauri.app/reference/javascript/fs/#appdata)

    AppData: 14;

###### [See](https://tauri.app/reference/javascript/fs/#see-2)

[Section titled “See”](https://tauri.app/reference/javascript/fs/#see-2)

appDataDir for more information.

**Source**: undefined

##### [AppLocalData](https://tauri.app/reference/javascript/fs/#applocaldata)

[Section titled “AppLocalData”](https://tauri.app/reference/javascript/fs/#applocaldata)

    AppLocalData: 15;

###### [See](https://tauri.app/reference/javascript/fs/#see-3)

[Section titled “See”](https://tauri.app/reference/javascript/fs/#see-3)

appLocalDataDir for more information.

**Source**: undefined

##### [AppLog](https://tauri.app/reference/javascript/fs/#applog)

[Section titled “AppLog”](https://tauri.app/reference/javascript/fs/#applog)

    AppLog: 17;

###### [See](https://tauri.app/reference/javascript/fs/#see-4)

[Section titled “See”](https://tauri.app/reference/javascript/fs/#see-4)

appLogDir for more information.

**Source**: undefined

##### [Audio](https://tauri.app/reference/javascript/fs/#audio)

[Section titled “Audio”](https://tauri.app/reference/javascript/fs/#audio)

    Audio: 1;

###### [See](https://tauri.app/reference/javascript/fs/#see-5)

[Section titled “See”](https://tauri.app/reference/javascript/fs/#see-5)

audioDir for more information.

**Source**: undefined

##### [Cache](https://tauri.app/reference/javascript/fs/#cache)

[Section titled “Cache”](https://tauri.app/reference/javascript/fs/#cache)

    Cache: 2;

###### [See](https://tauri.app/reference/javascript/fs/#see-6)

[Section titled “See”](https://tauri.app/reference/javascript/fs/#see-6)

cacheDir for more information.

**Source**: undefined

##### [Config](https://tauri.app/reference/javascript/fs/#config)

[Section titled “Config”](https://tauri.app/reference/javascript/fs/#config)

    Config: 3;

###### [See](https://tauri.app/reference/javascript/fs/#see-7)

[Section titled “See”](https://tauri.app/reference/javascript/fs/#see-7)

configDir for more information.

**Source**: undefined

##### [Data](https://tauri.app/reference/javascript/fs/#data)

[Section titled “Data”](https://tauri.app/reference/javascript/fs/#data)

    Data: 4;

###### [See](https://tauri.app/reference/javascript/fs/#see-8)

[Section titled “See”](https://tauri.app/reference/javascript/fs/#see-8)

dataDir for more information.

**Source**: undefined

##### [Desktop](https://tauri.app/reference/javascript/fs/#desktop)

[Section titled “Desktop”](https://tauri.app/reference/javascript/fs/#desktop)

    Desktop: 18;

###### [See](https://tauri.app/reference/javascript/fs/#see-9)

[Section titled “See”](https://tauri.app/reference/javascript/fs/#see-9)

desktopDir for more information.

**Source**: undefined

##### [Document](https://tauri.app/reference/javascript/fs/#document)

[Section titled “Document”](https://tauri.app/reference/javascript/fs/#document)

    Document: 6;

###### [See](https://tauri.app/reference/javascript/fs/#see-10)

[Section titled “See”](https://tauri.app/reference/javascript/fs/#see-10)

documentDir for more information.

**Source**: undefined

##### [Download](https://tauri.app/reference/javascript/fs/#download)

[Section titled “Download”](https://tauri.app/reference/javascript/fs/#download)

    Download: 7;

###### [See](https://tauri.app/reference/javascript/fs/#see-11)

[Section titled “See”](https://tauri.app/reference/javascript/fs/#see-11)

downloadDir for more information.

**Source**: undefined

##### [Executable](https://tauri.app/reference/javascript/fs/#executable)

[Section titled “Executable”](https://tauri.app/reference/javascript/fs/#executable)

    Executable: 19;

###### [See](https://tauri.app/reference/javascript/fs/#see-12)

[Section titled “See”](https://tauri.app/reference/javascript/fs/#see-12)

executableDir for more information.

**Source**: undefined

##### [Font](https://tauri.app/reference/javascript/fs/#font)

[Section titled “Font”](https://tauri.app/reference/javascript/fs/#font)

    Font: 20;

###### [See](https://tauri.app/reference/javascript/fs/#see-13)

[Section titled “See”](https://tauri.app/reference/javascript/fs/#see-13)

fontDir for more information.

**Source**: undefined

##### [Home](https://tauri.app/reference/javascript/fs/#home)

[Section titled “Home”](https://tauri.app/reference/javascript/fs/#home)

    Home: 21;

###### [See](https://tauri.app/reference/javascript/fs/#see-14)

[Section titled “See”](https://tauri.app/reference/javascript/fs/#see-14)

homeDir for more information.

**Source**: undefined

##### [LocalData](https://tauri.app/reference/javascript/fs/#localdata)

[Section titled “LocalData”](https://tauri.app/reference/javascript/fs/#localdata)

    LocalData: 5;

###### [See](https://tauri.app/reference/javascript/fs/#see-15)

[Section titled “See”](https://tauri.app/reference/javascript/fs/#see-15)

localDataDir for more information.

**Source**: undefined

##### [Picture](https://tauri.app/reference/javascript/fs/#picture)

[Section titled “Picture”](https://tauri.app/reference/javascript/fs/#picture)

    Picture: 8;

###### [See](https://tauri.app/reference/javascript/fs/#see-16)

[Section titled “See”](https://tauri.app/reference/javascript/fs/#see-16)

pictureDir for more information.

**Source**: undefined

##### [Public](https://tauri.app/reference/javascript/fs/#public)

[Section titled “Public”](https://tauri.app/reference/javascript/fs/#public)

    Public: 9;

###### [See](https://tauri.app/reference/javascript/fs/#see-17)

[Section titled “See”](https://tauri.app/reference/javascript/fs/#see-17)

publicDir for more information.

**Source**: undefined

##### [Resource](https://tauri.app/reference/javascript/fs/#resource)

[Section titled “Resource”](https://tauri.app/reference/javascript/fs/#resource)

    Resource: 11;

###### [See](https://tauri.app/reference/javascript/fs/#see-18)

[Section titled “See”](https://tauri.app/reference/javascript/fs/#see-18)

resourceDir for more information.

**Source**: undefined

##### [Runtime](https://tauri.app/reference/javascript/fs/#runtime)

[Section titled “Runtime”](https://tauri.app/reference/javascript/fs/#runtime)

    Runtime: 22;

###### [See](https://tauri.app/reference/javascript/fs/#see-19)

[Section titled “See”](https://tauri.app/reference/javascript/fs/#see-19)

runtimeDir for more information.

**Source**: undefined

##### [Temp](https://tauri.app/reference/javascript/fs/#temp)

[Section titled “Temp”](https://tauri.app/reference/javascript/fs/#temp)

    Temp: 12;

###### [See](https://tauri.app/reference/javascript/fs/#see-20)

[Section titled “See”](https://tauri.app/reference/javascript/fs/#see-20)

tempDir for more information.

**Source**: undefined

##### [Template](https://tauri.app/reference/javascript/fs/#template)

[Section titled “Template”](https://tauri.app/reference/javascript/fs/#template)

    Template: 23;

###### [See](https://tauri.app/reference/javascript/fs/#see-21)

[Section titled “See”](https://tauri.app/reference/javascript/fs/#see-21)

templateDir for more information.

**Source**: undefined

##### [Video](https://tauri.app/reference/javascript/fs/#video)

[Section titled “Video”](https://tauri.app/reference/javascript/fs/#video)

    Video: 10;

###### [See](https://tauri.app/reference/javascript/fs/#see-22)

[Section titled “See”](https://tauri.app/reference/javascript/fs/#see-22)

videoDir for more information.

**Source**: undefined

* * *

### [SeekMode](https://tauri.app/reference/javascript/fs/#seekmode)

[Section titled “SeekMode”](https://tauri.app/reference/javascript/fs/#seekmode)

#### [Enumeration Members](https://tauri.app/reference/javascript/fs/#enumeration-members-1)

[Section titled “Enumeration Members”](https://tauri.app/reference/javascript/fs/#enumeration-members-1)

##### [Current](https://tauri.app/reference/javascript/fs/#current)

[Section titled “Current”](https://tauri.app/reference/javascript/fs/#current)

    Current: 1;

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L80](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L80)

##### [End](https://tauri.app/reference/javascript/fs/#end)

[Section titled “End”](https://tauri.app/reference/javascript/fs/#end)

    End: 2;

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L81](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L81)

##### [Start](https://tauri.app/reference/javascript/fs/#start)

[Section titled “Start”](https://tauri.app/reference/javascript/fs/#start)

    Start: 0;

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L79](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L79)

[Classes](https://tauri.app/reference/javascript/fs/#classes)

--------------------------------------------------------------

[Section titled “Classes”](https://tauri.app/reference/javascript/fs/#classes)

### [FileHandle](https://tauri.app/reference/javascript/fs/#filehandle)

[Section titled “FileHandle”](https://tauri.app/reference/javascript/fs/#filehandle)

The Tauri abstraction for reading and writing files.

#### [Since](https://tauri.app/reference/javascript/fs/#since-1)

[Section titled “Since”](https://tauri.app/reference/javascript/fs/#since-1)

2.0.0

#### [Extends](https://tauri.app/reference/javascript/fs/#extends)

[Section titled “Extends”](https://tauri.app/reference/javascript/fs/#extends)

*   `Resource`

#### [Constructors](https://tauri.app/reference/javascript/fs/#constructors)

[Section titled “Constructors”](https://tauri.app/reference/javascript/fs/#constructors)

##### [new FileHandle()](https://tauri.app/reference/javascript/fs/#new-filehandle)

[Section titled “new FileHandle()”](https://tauri.app/reference/javascript/fs/#new-filehandle)

    new FileHandle(rid): FileHandle

###### [Parameters](https://tauri.app/reference/javascript/fs/#parameters)

[Section titled “Parameters”](https://tauri.app/reference/javascript/fs/#parameters)

| Parameter | Type |
| --- | --- |
| `rid` | `number` |

###### [Returns](https://tauri.app/reference/javascript/fs/#returns)

[Section titled “Returns”](https://tauri.app/reference/javascript/fs/#returns)

[`FileHandle`](https://tauri.app/reference/javascript/fs/#filehandle)

###### [Inherited from](https://tauri.app/reference/javascript/fs/#inherited-from)

[Section titled “Inherited from”](https://tauri.app/reference/javascript/fs/#inherited-from)

`Resource.constructor`

**Source**: undefined

#### [Accessors](https://tauri.app/reference/javascript/fs/#accessors)

[Section titled “Accessors”](https://tauri.app/reference/javascript/fs/#accessors)

##### [rid](https://tauri.app/reference/javascript/fs/#rid)

[Section titled “rid”](https://tauri.app/reference/javascript/fs/#rid)

    get rid(): number

###### [Returns](https://tauri.app/reference/javascript/fs/#returns-1)

[Section titled “Returns”](https://tauri.app/reference/javascript/fs/#returns-1)

`number`

###### [Inherited from](https://tauri.app/reference/javascript/fs/#inherited-from-1)

[Section titled “Inherited from”](https://tauri.app/reference/javascript/fs/#inherited-from-1)

`Resource.rid`

**Source**: undefined

#### [Methods](https://tauri.app/reference/javascript/fs/#methods)

[Section titled “Methods”](https://tauri.app/reference/javascript/fs/#methods)

##### [close()](https://tauri.app/reference/javascript/fs/#close)

[Section titled “close()”](https://tauri.app/reference/javascript/fs/#close)

    close(): Promise<void>

Destroys and cleans up this resource from memory. **You should not call any method on this object anymore and should drop any reference to it.**

###### [Returns](https://tauri.app/reference/javascript/fs/#returns-2)

[Section titled “Returns”](https://tauri.app/reference/javascript/fs/#returns-2)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`void`\>

###### [Inherited from](https://tauri.app/reference/javascript/fs/#inherited-from-2)

[Section titled “Inherited from”](https://tauri.app/reference/javascript/fs/#inherited-from-2)

`Resource.close`

**Source**: undefined

##### [read()](https://tauri.app/reference/javascript/fs/#read)

[Section titled “read()”](https://tauri.app/reference/javascript/fs/#read)

    read(buffer): Promise<null | number>

Reads up to `p.byteLength` bytes into `p`. It resolves to the number of bytes read (`0` < `n` <= `p.byteLength`) and rejects if any error encountered. Even if `read()` resolves to `n` < `p.byteLength`, it may use all of `p` as scratch space during the call. If some data is available but not `p.byteLength` bytes, `read()` conventionally resolves to what is available instead of waiting for more.

When `read()` encounters end-of-file condition, it resolves to EOF (`null`).

When `read()` encounters an error, it rejects with an error.

Callers should always process the `n` > `0` bytes returned before considering the EOF (`null`). Doing so correctly handles I/O errors that happen after reading some bytes and also both of the allowed EOF behaviors.

###### [Parameters](https://tauri.app/reference/javascript/fs/#parameters-1)

[Section titled “Parameters”](https://tauri.app/reference/javascript/fs/#parameters-1)

| Parameter | Type |
| --- | --- |
| `buffer` | [`Uint8Array`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Uint8Array) |

###### [Returns](https://tauri.app/reference/javascript/fs/#returns-3)

[Section titled “Returns”](https://tauri.app/reference/javascript/fs/#returns-3)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`null` | `number`\>

###### [Example](https://tauri.app/reference/javascript/fs/#example)

[Section titled “Example”](https://tauri.app/reference/javascript/fs/#example)

    import { open, BaseDirectory } from "@tauri-apps/plugin-fs"// if "$APPCONFIG/foo/bar.txt" contains the text "hello world":const file = await open("foo/bar.txt", { baseDir: BaseDirectory.AppConfig });const buf = new Uint8Array(100);const numberOfBytesRead = await file.read(buf); // 11 bytesconst text = new TextDecoder().decode(buf);  // "hello world"await file.close();

###### [Since](https://tauri.app/reference/javascript/fs/#since-2)

[Section titled “Since”](https://tauri.app/reference/javascript/fs/#since-2)

2.0.0

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L314](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L314)

##### [seek()](https://tauri.app/reference/javascript/fs/#seek)

[Section titled “seek()”](https://tauri.app/reference/javascript/fs/#seek)

    seek(offset, whence): Promise<number>

Seek sets the offset for the next `read()` or `write()` to offset, interpreted according to `whence`: `Start` means relative to the start of the file, `Current` means relative to the current offset, and `End` means relative to the end. Seek resolves to the new offset relative to the start of the file.

Seeking to an offset before the start of the file is an error. Seeking to any positive offset is legal, but the behavior of subsequent I/O operations on the underlying object is implementation-dependent. It returns the number of cursor position.

###### [Parameters](https://tauri.app/reference/javascript/fs/#parameters-2)

[Section titled “Parameters”](https://tauri.app/reference/javascript/fs/#parameters-2)

| Parameter | Type |
| --- | --- |
| `offset` | `number` |
| `whence` | [`SeekMode`](https://tauri.app/reference/javascript/fs/#seekmode) |

###### [Returns](https://tauri.app/reference/javascript/fs/#returns-4)

[Section titled “Returns”](https://tauri.app/reference/javascript/fs/#returns-4)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`number`\>

###### [Example](https://tauri.app/reference/javascript/fs/#example-1)

[Section titled “Example”](https://tauri.app/reference/javascript/fs/#example-1)

    import { open, SeekMode, BaseDirectory } from '@tauri-apps/plugin-fs';
    // Given hello.txt pointing to file with "Hello world", which is 11 bytes long:const file = await open('hello.txt', { read: true, write: true, truncate: true, create: true, baseDir: BaseDirectory.AppLocalData });await file.write(new TextEncoder().encode("Hello world"));
    // Seek 6 bytes from the start of the fileconsole.log(await file.seek(6, SeekMode.Start)); // "6"// Seek 2 more bytes from the current positionconsole.log(await file.seek(2, SeekMode.Current)); // "8"// Seek backwards 2 bytes from the end of the fileconsole.log(await file.seek(-2, SeekMode.End)); // "9" (e.g. 11-2)
    await file.close();

###### [Since](https://tauri.app/reference/javascript/fs/#since-3)

[Section titled “Since”](https://tauri.app/reference/javascript/fs/#since-3)

2.0.0

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L369](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L369)

##### [stat()](https://tauri.app/reference/javascript/fs/#stat)

[Section titled “stat()”](https://tauri.app/reference/javascript/fs/#stat)

    stat(): Promise<FileInfo>

Returns a [`FileInfo`](https://tauri.app/reference/javascript/fs/#fileinfo)
 for this file.

###### [Returns](https://tauri.app/reference/javascript/fs/#returns-5)

[Section titled “Returns”](https://tauri.app/reference/javascript/fs/#returns-5)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<[`FileInfo`](https://tauri.app/reference/javascript/fs/#fileinfo)
\>

###### [Example](https://tauri.app/reference/javascript/fs/#example-2)

[Section titled “Example”](https://tauri.app/reference/javascript/fs/#example-2)

    import { open, BaseDirectory } from '@tauri-apps/plugin-fs';const file = await open("file.txt", { read: true, baseDir: BaseDirectory.AppLocalData });const fileInfo = await file.stat();console.log(fileInfo.isFile); // trueawait file.close();

###### [Since](https://tauri.app/reference/javascript/fs/#since-4)

[Section titled “Since”](https://tauri.app/reference/javascript/fs/#since-4)

2.0.0

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L391](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L391)

##### [truncate()](https://tauri.app/reference/javascript/fs/#truncate)

[Section titled “truncate()”](https://tauri.app/reference/javascript/fs/#truncate)

    truncate(len?): Promise<void>

Truncates or extends this file, to reach the specified `len`. If `len` is not specified then the entire file contents are truncated.

###### [Parameters](https://tauri.app/reference/javascript/fs/#parameters-3)

[Section titled “Parameters”](https://tauri.app/reference/javascript/fs/#parameters-3)

| Parameter | Type |
| --- | --- |
| `len`? | `number` |

###### [Returns](https://tauri.app/reference/javascript/fs/#returns-6)

[Section titled “Returns”](https://tauri.app/reference/javascript/fs/#returns-6)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`void`\>

###### [Example](https://tauri.app/reference/javascript/fs/#example-3)

[Section titled “Example”](https://tauri.app/reference/javascript/fs/#example-3)

    import { open, BaseDirectory } from '@tauri-apps/plugin-fs';
    // truncate the entire fileconst file = await open("my_file.txt", { read: true, write: true, create: true, baseDir: BaseDirectory.AppLocalData });await file.truncate();
    // truncate part of the fileconst file = await open("my_file.txt", { read: true, write: true, create: true, baseDir: BaseDirectory.AppLocalData });await file.write(new TextEncoder().encode("Hello World"));await file.truncate(7);const data = new Uint8Array(32);await file.read(data);console.log(new TextDecoder().decode(data)); // Hello Wawait file.close();

###### [Since](https://tauri.app/reference/javascript/fs/#since-5)

[Section titled “Since”](https://tauri.app/reference/javascript/fs/#since-5)

2.0.0

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L423](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L423)

##### [write()](https://tauri.app/reference/javascript/fs/#write)

[Section titled “write()”](https://tauri.app/reference/javascript/fs/#write)

    write(data): Promise<number>

Writes `data.byteLength` bytes from `data` to the underlying data stream. It resolves to the number of bytes written from `data` (`0` <= `n` <= `data.byteLength`) or reject with the error encountered that caused the write to stop early. `write()` must reject with a non-null error if would resolve to `n` < `data.byteLength`. `write()` must not modify the slice data, even temporarily.

###### [Parameters](https://tauri.app/reference/javascript/fs/#parameters-4)

[Section titled “Parameters”](https://tauri.app/reference/javascript/fs/#parameters-4)

| Parameter | Type |
| --- | --- |
| `data` | [`Uint8Array`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Uint8Array) |

###### [Returns](https://tauri.app/reference/javascript/fs/#returns-7)

[Section titled “Returns”](https://tauri.app/reference/javascript/fs/#returns-7)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`number`\>

###### [Example](https://tauri.app/reference/javascript/fs/#example-4)

[Section titled “Example”](https://tauri.app/reference/javascript/fs/#example-4)

    import { open, write, BaseDirectory } from '@tauri-apps/plugin-fs';const encoder = new TextEncoder();const data = encoder.encode("Hello world");const file = await open("bar.txt", { write: true, baseDir: BaseDirectory.AppLocalData });const bytesWritten = await file.write(data); // 11await file.close();

###### [Since](https://tauri.app/reference/javascript/fs/#since-6)

[Section titled “Since”](https://tauri.app/reference/javascript/fs/#since-6)

2.0.0

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L450](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L450)

[Interfaces](https://tauri.app/reference/javascript/fs/#interfaces)

--------------------------------------------------------------------

[Section titled “Interfaces”](https://tauri.app/reference/javascript/fs/#interfaces)

### [CopyFileOptions](https://tauri.app/reference/javascript/fs/#copyfileoptions)

[Section titled “CopyFileOptions”](https://tauri.app/reference/javascript/fs/#copyfileoptions)

#### [Since](https://tauri.app/reference/javascript/fs/#since-7)

[Section titled “Since”](https://tauri.app/reference/javascript/fs/#since-7)

2.0.0

#### [Properties](https://tauri.app/reference/javascript/fs/#properties)

[Section titled “Properties”](https://tauri.app/reference/javascript/fs/#properties)

| Property | Type | Description | Defined in |
| --- | --- | --- | --- |
| `fromPathBaseDir?` | [`BaseDirectory`](https://tauri.app/reference/javascript/fs/#basedirectory) | Base directory for `fromPath`. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L586](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L586) |
| `toPathBaseDir?` | [`BaseDirectory`](https://tauri.app/reference/javascript/fs/#basedirectory) | Base directory for `toPath`. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L588](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L588) |

* * *

### [CreateOptions](https://tauri.app/reference/javascript/fs/#createoptions)

[Section titled “CreateOptions”](https://tauri.app/reference/javascript/fs/#createoptions)

#### [Since](https://tauri.app/reference/javascript/fs/#since-8)

[Section titled “Since”](https://tauri.app/reference/javascript/fs/#since-8)

2.0.0

#### [Properties](https://tauri.app/reference/javascript/fs/#properties-1)

[Section titled “Properties”](https://tauri.app/reference/javascript/fs/#properties-1)

| Property | Type | Description | Defined in |
| --- | --- | --- | --- |
| `baseDir?` | [`BaseDirectory`](https://tauri.app/reference/javascript/fs/#basedirectory) | Base directory for `path` | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L463](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L463) |

* * *

### [DebouncedWatchOptions](https://tauri.app/reference/javascript/fs/#debouncedwatchoptions)

[Section titled “DebouncedWatchOptions”](https://tauri.app/reference/javascript/fs/#debouncedwatchoptions)

#### [Since](https://tauri.app/reference/javascript/fs/#since-9)

[Section titled “Since”](https://tauri.app/reference/javascript/fs/#since-9)

2.0.0

#### [Extends](https://tauri.app/reference/javascript/fs/#extends-1)

[Section titled “Extends”](https://tauri.app/reference/javascript/fs/#extends-1)

*   [`WatchOptions`](https://tauri.app/reference/javascript/fs/#watchoptions)
    

#### [Properties](https://tauri.app/reference/javascript/fs/#properties-2)

[Section titled “Properties”](https://tauri.app/reference/javascript/fs/#properties-2)

| Property | Type | Description | Inherited from | Defined in |
| --- | --- | --- | --- | --- |
| `baseDir?` | [`BaseDirectory`](https://tauri.app/reference/javascript/fs/#basedirectory) | Base directory for `path` | [`WatchOptions`](https://tauri.app/reference/javascript/fs/#watchoptions)<br>.[`baseDir`](https://tauri.app/reference/javascript/fs/#basedir-10) | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L1177](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L1177) |
| `delayMs?` | `number` | Debounce delay | \-  | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L1185](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L1185) |
| `recursive?` | `boolean` | Watch a directory recursively | [`WatchOptions`](https://tauri.app/reference/javascript/fs/#watchoptions)<br>.[`recursive`](https://tauri.app/reference/javascript/fs/#recursive-3) | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L1175](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L1175) |

* * *

### [DirEntry](https://tauri.app/reference/javascript/fs/#direntry)

[Section titled “DirEntry”](https://tauri.app/reference/javascript/fs/#direntry)

A disk entry which is either a file, a directory or a symlink.

This is the result of the [`readDir`](https://tauri.app/reference/javascript/fs/#readdir)
.

#### [Since](https://tauri.app/reference/javascript/fs/#since-10)

[Section titled “Since”](https://tauri.app/reference/javascript/fs/#since-10)

2.0.0

#### [Properties](https://tauri.app/reference/javascript/fs/#properties-3)

[Section titled “Properties”](https://tauri.app/reference/javascript/fs/#properties-3)

| Property | Type | Description | Defined in |
| --- | --- | --- | --- |
| `isDirectory` | `boolean` | Specifies whether this entry is a directory or not. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L677](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L677) |
| `isFile` | `boolean` | Specifies whether this entry is a file or not. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L679](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L679) |
| `isSymlink` | `boolean` | Specifies whether this entry is a symlink or not. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L681](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L681) |
| `name` | `string` | The name of the entry (file name with extension or directory name). | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L675](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L675) |

* * *

### [ExistsOptions](https://tauri.app/reference/javascript/fs/#existsoptions)

[Section titled “ExistsOptions”](https://tauri.app/reference/javascript/fs/#existsoptions)

#### [Since](https://tauri.app/reference/javascript/fs/#since-11)

[Section titled “Since”](https://tauri.app/reference/javascript/fs/#since-11)

2.0.0

#### [Properties](https://tauri.app/reference/javascript/fs/#properties-4)

[Section titled “Properties”](https://tauri.app/reference/javascript/fs/#properties-4)

| Property | Type | Description | Defined in |
| --- | --- | --- | --- |
| `baseDir?` | [`BaseDirectory`](https://tauri.app/reference/javascript/fs/#basedirectory) | Base directory for `path`. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L1142](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L1142) |

* * *

### [FileInfo](https://tauri.app/reference/javascript/fs/#fileinfo)

[Section titled “FileInfo”](https://tauri.app/reference/javascript/fs/#fileinfo)

A FileInfo describes a file and is returned by `stat`, `lstat` or `fstat`.

#### [Since](https://tauri.app/reference/javascript/fs/#since-12)

[Section titled “Since”](https://tauri.app/reference/javascript/fs/#since-12)

2.0.0

#### [Properties](https://tauri.app/reference/javascript/fs/#properties-5)

[Section titled “Properties”](https://tauri.app/reference/javascript/fs/#properties-5)

| Property | Type | Description | Defined in |
| --- | --- | --- | --- |
| `atime` | `null` \| [`Date`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Date) | The last access time of the file. This corresponds to the `atime` field from `stat` on Unix and `ftLastAccessTime` on Windows. This may not be available on all platforms. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L120](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L120) |
| `birthtime` | `null` \| [`Date`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Date) | The creation time of the file. This corresponds to the `birthtime` field from `stat` on Mac/BSD and `ftCreationTime` on Windows. This may not be available on all platforms. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L126](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L126) |
| `blksize` | `null` \| `number` | Blocksize for filesystem I/O. Platform-specific - **Windows:** Unsupported. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L203](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L203) |
| `blocks` | `null` \| `number` | Number of blocks allocated to the file, in 512-byte units. Platform-specific - **Windows:** Unsupported. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L211](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L211) |
| `dev` | `null` \| `number` | ID of the device containing the file. Platform-specific - **Windows:** Unsupported. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L146](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L146) |
| `fileAttributes` | `null` \| `number` | This field contains the file system attribute information for a file or directory. For possible values and their descriptions, see [File Attribute Constants](https://docs.microsoft.com/en-us/windows/win32/fileio/file-attribute-constants)<br> in the Windows Dev Center Platform-specific - **macOS / Linux / Android / iOS:** Unsupported. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L138](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L138) |
| `gid` | `null` \| `number` | Group ID of the owner of this file. Platform-specific - **Windows:** Unsupported. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L187](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L187) |
| `ino` | `null` \| `number` | Inode number. Platform-specific - **Windows:** Unsupported. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L154](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L154) |
| `isDirectory` | `boolean` | True if this is info for a regular directory. Mutually exclusive to `FileInfo.isFile` and `FileInfo.isSymlink`. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L99](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L99) |
| `isFile` | `boolean` | True if this is info for a regular file. Mutually exclusive to `FileInfo.isDirectory` and `FileInfo.isSymlink`. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L94](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L94) |
| `isSymlink` | `boolean` | True if this is info for a symlink. Mutually exclusive to `FileInfo.isFile` and `FileInfo.isDirectory`. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L104](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L104) |
| `mode` | `null` \| `number` | The underlying raw `st_mode` bits that contain the standard Unix permissions for this file/directory. Platform-specific - **Windows:** Unsupported. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L163](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L163) |
| `mtime` | `null` \| [`Date`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Date) | The last modification time of the file. This corresponds to the `mtime` field from `stat` on Linux/Mac OS and `ftLastWriteTime` on Windows. This may not be available on all platforms. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L114](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L114) |
| `nlink` | `null` \| `number` | Number of hard links pointing to this file. Platform-specific - **Windows:** Unsupported. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L171](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L171) |
| `rdev` | `null` \| `number` | Device ID of this file. Platform-specific - **Windows:** Unsupported. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L195](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L195) |
| `readonly` | `boolean` | Whether this is a readonly (unwritable) file. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L128](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L128) |
| `size` | `number` | The size of the file, in bytes. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L108](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L108) |
| `uid` | `null` \| `number` | User ID of the owner of this file. Platform-specific - **Windows:** Unsupported. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L179](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L179) |

* * *

### [MkdirOptions](https://tauri.app/reference/javascript/fs/#mkdiroptions)

[Section titled “MkdirOptions”](https://tauri.app/reference/javascript/fs/#mkdiroptions)

#### [Since](https://tauri.app/reference/javascript/fs/#since-13)

[Section titled “Since”](https://tauri.app/reference/javascript/fs/#since-13)

2.0.0

#### [Properties](https://tauri.app/reference/javascript/fs/#properties-6)

[Section titled “Properties”](https://tauri.app/reference/javascript/fs/#properties-6)

| Property | Type | Description | Defined in |
| --- | --- | --- | --- |
| `baseDir?` | [`BaseDirectory`](https://tauri.app/reference/javascript/fs/#basedirectory) | Base directory for `path` | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L631](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L631) |
| `mode?` | `number` | Permissions to use when creating the directory (defaults to `0o777`, before the process’s umask). Ignored on Windows. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L625](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L625) |
| `recursive?` | `boolean` | Defaults to `false`. If set to `true`, means that any intermediate directories will also be created (as with the shell command `mkdir -p`). | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L629](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L629) |

* * *

### [OpenOptions](https://tauri.app/reference/javascript/fs/#openoptions)

[Section titled “OpenOptions”](https://tauri.app/reference/javascript/fs/#openoptions)

#### [Since](https://tauri.app/reference/javascript/fs/#since-14)

[Section titled “Since”](https://tauri.app/reference/javascript/fs/#since-14)

2.0.0

#### [Properties](https://tauri.app/reference/javascript/fs/#properties-7)

[Section titled “Properties”](https://tauri.app/reference/javascript/fs/#properties-7)

| Property | Type | Description | Defined in |
| --- | --- | --- | --- |
| `append?` | `boolean` | Sets the option for the append mode. This option, when `true`, means that writes will append to a file instead of overwriting previous contents. Note that setting `{ write: true, append: true }` has the same effect as setting only `{ append: true }`. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L518](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L518) |
| `baseDir?` | [`BaseDirectory`](https://tauri.app/reference/javascript/fs/#basedirectory) | Base directory for `path` | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L546](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L546) |
| `create?` | `boolean` | Sets the option to allow creating a new file, if one doesn’t already exist at the specified path. Requires write or append access to be used. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L531](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L531) |
| `createNew?` | `boolean` | Defaults to `false`. If set to `true`, no file, directory, or symlink is allowed to exist at the target location. Requires write or append access to be used. When createNew is set to `true`, create and truncate are ignored. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L538](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L538) |
| `mode?` | `number` | Permissions to use if creating the file (defaults to `0o666`, before the process’s umask). Ignored on Windows. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L544](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L544) |
| `read?` | `boolean` | Sets the option for read access. This option, when `true`, means that the file should be read-able if opened. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L504](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L504) |
| `truncate?` | `boolean` | Sets the option for truncating a previous file. If a file is successfully opened with this option set it will truncate the file to `0` size if it already exists. The file must be opened with write access for truncate to work. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L525](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L525) |
| `write?` | `boolean` | Sets the option for write access. This option, when `true`, means that the file should be write-able if opened. If the file already exists, any write calls on it will overwrite its contents, by default without truncating it. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L511](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L511) |

* * *

### [ReadDirOptions](https://tauri.app/reference/javascript/fs/#readdiroptions)

[Section titled “ReadDirOptions”](https://tauri.app/reference/javascript/fs/#readdiroptions)

#### [Since](https://tauri.app/reference/javascript/fs/#since-15)

[Section titled “Since”](https://tauri.app/reference/javascript/fs/#since-15)

2.0.0

#### [Properties](https://tauri.app/reference/javascript/fs/#properties-8)

[Section titled “Properties”](https://tauri.app/reference/javascript/fs/#properties-8)

| Property | Type | Description | Defined in |
| --- | --- | --- | --- |
| `baseDir?` | [`BaseDirectory`](https://tauri.app/reference/javascript/fs/#basedirectory) | Base directory for `path` | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L663](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L663) |

* * *

### [ReadFileOptions](https://tauri.app/reference/javascript/fs/#readfileoptions)

[Section titled “ReadFileOptions”](https://tauri.app/reference/javascript/fs/#readfileoptions)

#### [Since](https://tauri.app/reference/javascript/fs/#since-16)

[Section titled “Since”](https://tauri.app/reference/javascript/fs/#since-16)

2.0.0

#### [Properties](https://tauri.app/reference/javascript/fs/#properties-9)

[Section titled “Properties”](https://tauri.app/reference/javascript/fs/#properties-9)

| Property | Type | Description | Defined in |
| --- | --- | --- | --- |
| `baseDir?` | [`BaseDirectory`](https://tauri.app/reference/javascript/fs/#basedirectory) | Base directory for `path` | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L725](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L725) |

* * *

### [RemoveOptions](https://tauri.app/reference/javascript/fs/#removeoptions)

[Section titled “RemoveOptions”](https://tauri.app/reference/javascript/fs/#removeoptions)

#### [Since](https://tauri.app/reference/javascript/fs/#since-17)

[Section titled “Since”](https://tauri.app/reference/javascript/fs/#since-17)

2.0.0

#### [Properties](https://tauri.app/reference/javascript/fs/#properties-10)

[Section titled “Properties”](https://tauri.app/reference/javascript/fs/#properties-10)

| Property | Type | Description | Defined in |
| --- | --- | --- | --- |
| `baseDir?` | [`BaseDirectory`](https://tauri.app/reference/javascript/fs/#basedirectory) | Base directory for `path` | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L864](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L864) |
| `recursive?` | `boolean` | Defaults to `false`. If set to `true`, path will be removed even if it’s a non-empty directory. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L862](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L862) |

* * *

### [RenameOptions](https://tauri.app/reference/javascript/fs/#renameoptions)

[Section titled “RenameOptions”](https://tauri.app/reference/javascript/fs/#renameoptions)

#### [Since](https://tauri.app/reference/javascript/fs/#since-18)

[Section titled “Since”](https://tauri.app/reference/javascript/fs/#since-18)

2.0.0

#### [Properties](https://tauri.app/reference/javascript/fs/#properties-11)

[Section titled “Properties”](https://tauri.app/reference/javascript/fs/#properties-11)

| Property | Type | Description | Defined in |
| --- | --- | --- | --- |
| `newPathBaseDir?` | [`BaseDirectory`](https://tauri.app/reference/javascript/fs/#basedirectory) | Base directory for `newPath`. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L900](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L900) |
| `oldPathBaseDir?` | [`BaseDirectory`](https://tauri.app/reference/javascript/fs/#basedirectory) | Base directory for `oldPath`. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L898](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L898) |

* * *

### [StatOptions](https://tauri.app/reference/javascript/fs/#statoptions)

[Section titled “StatOptions”](https://tauri.app/reference/javascript/fs/#statoptions)

#### [Since](https://tauri.app/reference/javascript/fs/#since-19)

[Section titled “Since”](https://tauri.app/reference/javascript/fs/#since-19)

2.0.0

#### [Properties](https://tauri.app/reference/javascript/fs/#properties-12)

[Section titled “Properties”](https://tauri.app/reference/javascript/fs/#properties-12)

| Property | Type | Description | Defined in |
| --- | --- | --- | --- |
| `baseDir?` | [`BaseDirectory`](https://tauri.app/reference/javascript/fs/#basedirectory) | Base directory for `path`. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L942](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L942) |

* * *

### [TruncateOptions](https://tauri.app/reference/javascript/fs/#truncateoptions)

[Section titled “TruncateOptions”](https://tauri.app/reference/javascript/fs/#truncateoptions)

#### [Since](https://tauri.app/reference/javascript/fs/#since-20)

[Section titled “Since”](https://tauri.app/reference/javascript/fs/#since-20)

2.0.0

#### [Properties](https://tauri.app/reference/javascript/fs/#properties-13)

[Section titled “Properties”](https://tauri.app/reference/javascript/fs/#properties-13)

| Property | Type | Description | Defined in |
| --- | --- | --- | --- |
| `baseDir?` | [`BaseDirectory`](https://tauri.app/reference/javascript/fs/#basedirectory) | Base directory for `path`. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L1001](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L1001) |

* * *

### [WatchEvent](https://tauri.app/reference/javascript/fs/#watchevent)

[Section titled “WatchEvent”](https://tauri.app/reference/javascript/fs/#watchevent)

#### [Since](https://tauri.app/reference/javascript/fs/#since-21)

[Section titled “Since”](https://tauri.app/reference/javascript/fs/#since-21)

2.0.0

#### [Properties](https://tauri.app/reference/javascript/fs/#properties-14)

[Section titled “Properties”](https://tauri.app/reference/javascript/fs/#properties-14)

| Property | Type | Defined in |
| --- | --- | --- |
| `attrs` | `unknown` | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L1194](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L1194) |
| `paths` | `string`\[\] | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L1193](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L1193) |
| `type` | [`WatchEventKind`](https://tauri.app/reference/javascript/fs/#watcheventkind) | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L1192](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L1192) |

* * *

### [WatchOptions](https://tauri.app/reference/javascript/fs/#watchoptions)

[Section titled “WatchOptions”](https://tauri.app/reference/javascript/fs/#watchoptions)

#### [Since](https://tauri.app/reference/javascript/fs/#since-22)

[Section titled “Since”](https://tauri.app/reference/javascript/fs/#since-22)

2.0.0

#### [Extended by](https://tauri.app/reference/javascript/fs/#extended-by)

[Section titled “Extended by”](https://tauri.app/reference/javascript/fs/#extended-by)

*   [`DebouncedWatchOptions`](https://tauri.app/reference/javascript/fs/#debouncedwatchoptions)
    

#### [Properties](https://tauri.app/reference/javascript/fs/#properties-15)

[Section titled “Properties”](https://tauri.app/reference/javascript/fs/#properties-15)

| Property | Type | Description | Defined in |
| --- | --- | --- | --- |
| `baseDir?` | [`BaseDirectory`](https://tauri.app/reference/javascript/fs/#basedirectory) | Base directory for `path` | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L1177](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L1177) |
| `recursive?` | `boolean` | Watch a directory recursively | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L1175](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L1175) |

* * *

### [WriteFileOptions](https://tauri.app/reference/javascript/fs/#writefileoptions)

[Section titled “WriteFileOptions”](https://tauri.app/reference/javascript/fs/#writefileoptions)

#### [Since](https://tauri.app/reference/javascript/fs/#since-23)

[Section titled “Since”](https://tauri.app/reference/javascript/fs/#since-23)

2.0.0

#### [Properties](https://tauri.app/reference/javascript/fs/#properties-16)

[Section titled “Properties”](https://tauri.app/reference/javascript/fs/#properties-16)

| Property | Type | Description | Defined in |
| --- | --- | --- | --- |
| `append?` | `boolean` | Defaults to `false`. If set to `true`, will append to a file instead of overwriting previous contents. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L1045](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L1045) |
| `baseDir?` | [`BaseDirectory`](https://tauri.app/reference/javascript/fs/#basedirectory) | Base directory for `path` | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L1053](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L1053) |
| `create?` | `boolean` | Sets the option to allow creating a new file, if one doesn’t already exist at the specified path (defaults to `true`). | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L1047](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L1047) |
| `createNew?` | `boolean` | Sets the option to create a new file, failing if it already exists. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L1049](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L1049) |
| `mode?` | `number` | File permissions. Ignored on Windows. | **Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L1051](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L1051) |

[Type Aliases](https://tauri.app/reference/javascript/fs/#type-aliases)

------------------------------------------------------------------------

[Section titled “Type Aliases”](https://tauri.app/reference/javascript/fs/#type-aliases)

### [UnwatchFn()](https://tauri.app/reference/javascript/fs/#unwatchfn)

[Section titled “UnwatchFn()”](https://tauri.app/reference/javascript/fs/#unwatchfn)

    type UnwatchFn: () => void;

#### [Returns](https://tauri.app/reference/javascript/fs/#returns-8)

[Section titled “Returns”](https://tauri.app/reference/javascript/fs/#returns-8)

`void`

#### [Since](https://tauri.app/reference/javascript/fs/#since-24)

[Section titled “Since”](https://tauri.app/reference/javascript/fs/#since-24)

2.0.0

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L1259](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L1259)

* * *

### [WatchEventKind](https://tauri.app/reference/javascript/fs/#watcheventkind)

[Section titled “WatchEventKind”](https://tauri.app/reference/javascript/fs/#watcheventkind)

    type WatchEventKind:  | "any"  | object  | object  | object  | object  | "other";

#### [Since](https://tauri.app/reference/javascript/fs/#since-25)

[Section titled “Since”](https://tauri.app/reference/javascript/fs/#since-25)

2.0.0

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L1200](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L1200)

* * *

### [WatchEventKindAccess](https://tauri.app/reference/javascript/fs/#watcheventkindaccess)

[Section titled “WatchEventKindAccess”](https://tauri.app/reference/javascript/fs/#watcheventkindaccess)

    type WatchEventKindAccess: object | object | object | object;

#### [Since](https://tauri.app/reference/javascript/fs/#since-26)

[Section titled “Since”](https://tauri.app/reference/javascript/fs/#since-26)

2.0.0

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L1211](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L1211)

* * *

### [WatchEventKindCreate](https://tauri.app/reference/javascript/fs/#watcheventkindcreate)

[Section titled “WatchEventKindCreate”](https://tauri.app/reference/javascript/fs/#watcheventkindcreate)

    type WatchEventKindCreate: object | object | object | object;

#### [Since](https://tauri.app/reference/javascript/fs/#since-27)

[Section titled “Since”](https://tauri.app/reference/javascript/fs/#since-27)

2.0.0

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L1220](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L1220)

* * *

### [WatchEventKindModify](https://tauri.app/reference/javascript/fs/#watcheventkindmodify)

[Section titled “WatchEventKindModify”](https://tauri.app/reference/javascript/fs/#watcheventkindmodify)

    type WatchEventKindModify:  | object  | object  | object  | object  | object;

#### [Since](https://tauri.app/reference/javascript/fs/#since-28)

[Section titled “Since”](https://tauri.app/reference/javascript/fs/#since-28)

2.0.0

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L1229](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L1229)

* * *

### [WatchEventKindRemove](https://tauri.app/reference/javascript/fs/#watcheventkindremove)

[Section titled “WatchEventKindRemove”](https://tauri.app/reference/javascript/fs/#watcheventkindremove)

    type WatchEventKindRemove: object | object | object | object;

#### [Since](https://tauri.app/reference/javascript/fs/#since-29)

[Section titled “Since”](https://tauri.app/reference/javascript/fs/#since-29)

2.0.0

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L1249](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L1249)

[Functions](https://tauri.app/reference/javascript/fs/#functions)

------------------------------------------------------------------

[Section titled “Functions”](https://tauri.app/reference/javascript/fs/#functions)

### [copyFile()](https://tauri.app/reference/javascript/fs/#copyfile)

[Section titled “copyFile()”](https://tauri.app/reference/javascript/fs/#copyfile)

    function copyFile(   fromPath,   toPath,options?): Promise<void>

Copies the contents and permissions of one file to another specified path, by default creating a new file if needed, else overwriting.

#### [Parameters](https://tauri.app/reference/javascript/fs/#parameters-5)

[Section titled “Parameters”](https://tauri.app/reference/javascript/fs/#parameters-5)

| Parameter | Type |
| --- | --- |
| `fromPath` | `string` \| [`URL`](https://developer.mozilla.org/docs/Web/API/URL) |
| `toPath` | `string` \| [`URL`](https://developer.mozilla.org/docs/Web/API/URL) |
| `options`? | [`CopyFileOptions`](https://tauri.app/reference/javascript/fs/#copyfileoptions) |

#### [Returns](https://tauri.app/reference/javascript/fs/#returns-9)

[Section titled “Returns”](https://tauri.app/reference/javascript/fs/#returns-9)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`void`\>

#### [Example](https://tauri.app/reference/javascript/fs/#example-5)

[Section titled “Example”](https://tauri.app/reference/javascript/fs/#example-5)

    import { copyFile, BaseDirectory } from '@tauri-apps/plugin-fs';await copyFile('app.conf', 'app.conf.bk', { fromPathBaseDir: BaseDirectory.AppConfig, toPathBaseDir: BaseDirectory.AppConfig });

#### [Since](https://tauri.app/reference/javascript/fs/#since-30)

[Section titled “Since”](https://tauri.app/reference/javascript/fs/#since-30)

2.0.0

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L601](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L601)

* * *

### [create()](https://tauri.app/reference/javascript/fs/#create)

[Section titled “create()”](https://tauri.app/reference/javascript/fs/#create)

    function create(path, options?): Promise<FileHandle>

Creates a file if none exists or truncates an existing file and resolves to an instance of [`FileHandle`](https://tauri.app/reference/javascript/fs/#filehandle)
.

#### [Parameters](https://tauri.app/reference/javascript/fs/#parameters-6)

[Section titled “Parameters”](https://tauri.app/reference/javascript/fs/#parameters-6)

| Parameter | Type |
| --- | --- |
| `path` | `string` \| [`URL`](https://developer.mozilla.org/docs/Web/API/URL) |
| `options`? | [`CreateOptions`](https://tauri.app/reference/javascript/fs/#createoptions) |

#### [Returns](https://tauri.app/reference/javascript/fs/#returns-10)

[Section titled “Returns”](https://tauri.app/reference/javascript/fs/#returns-10)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<[`FileHandle`](https://tauri.app/reference/javascript/fs/#filehandle)
\>

#### [Example](https://tauri.app/reference/javascript/fs/#example-6)

[Section titled “Example”](https://tauri.app/reference/javascript/fs/#example-6)

    import { create, BaseDirectory } from "@tauri-apps/plugin-fs"const file = await create("foo/bar.txt", { baseDir: BaseDirectory.AppConfig });await file.write(new TextEncoder().encode("Hello world"));await file.close();

#### [Since](https://tauri.app/reference/javascript/fs/#since-31)

[Section titled “Since”](https://tauri.app/reference/javascript/fs/#since-31)

2.0.0

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L480](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L480)

* * *

### [exists()](https://tauri.app/reference/javascript/fs/#exists)

[Section titled “exists()”](https://tauri.app/reference/javascript/fs/#exists)

    function exists(path, options?): Promise<boolean>

Check if a path exists.

#### [Parameters](https://tauri.app/reference/javascript/fs/#parameters-7)

[Section titled “Parameters”](https://tauri.app/reference/javascript/fs/#parameters-7)

| Parameter | Type |
| --- | --- |
| `path` | `string` \| [`URL`](https://developer.mozilla.org/docs/Web/API/URL) |
| `options`? | [`ExistsOptions`](https://tauri.app/reference/javascript/fs/#existsoptions) |

#### [Returns](https://tauri.app/reference/javascript/fs/#returns-11)

[Section titled “Returns”](https://tauri.app/reference/javascript/fs/#returns-11)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`boolean`\>

#### [Example](https://tauri.app/reference/javascript/fs/#example-7)

[Section titled “Example”](https://tauri.app/reference/javascript/fs/#example-7)

    import { exists, BaseDirectory } from '@tauri-apps/plugin-fs';// Check if the `$APPDATA/avatar.png` file existsawait exists('avatar.png', { baseDir: BaseDirectory.AppData });

#### [Since](https://tauri.app/reference/javascript/fs/#since-32)

[Section titled “Since”](https://tauri.app/reference/javascript/fs/#since-32)

2.0.0

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L1156](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L1156)

* * *

### [lstat()](https://tauri.app/reference/javascript/fs/#lstat)

[Section titled “lstat()”](https://tauri.app/reference/javascript/fs/#lstat)

    function lstat(path, options?): Promise<FileInfo>

Resolves to a [`FileInfo`](https://tauri.app/reference/javascript/fs/#fileinfo)
 for the specified `path`. If `path` is a symlink, information for the symlink will be returned instead of what it points to.

#### [Parameters](https://tauri.app/reference/javascript/fs/#parameters-8)

[Section titled “Parameters”](https://tauri.app/reference/javascript/fs/#parameters-8)

| Parameter | Type |
| --- | --- |
| `path` | `string` \| [`URL`](https://developer.mozilla.org/docs/Web/API/URL) |
| `options`? | [`StatOptions`](https://tauri.app/reference/javascript/fs/#statoptions) |

#### [Returns](https://tauri.app/reference/javascript/fs/#returns-12)

[Section titled “Returns”](https://tauri.app/reference/javascript/fs/#returns-12)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<[`FileInfo`](https://tauri.app/reference/javascript/fs/#fileinfo)
\>

#### [Example](https://tauri.app/reference/javascript/fs/#example-8)

[Section titled “Example”](https://tauri.app/reference/javascript/fs/#example-8)

    import { lstat, BaseDirectory } from '@tauri-apps/plugin-fs';const fileInfo = await lstat("hello.txt", { baseDir: BaseDirectory.AppLocalData });console.log(fileInfo.isFile); // true

#### [Since](https://tauri.app/reference/javascript/fs/#since-33)

[Section titled “Since”](https://tauri.app/reference/javascript/fs/#since-33)

2.0.0

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L984](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L984)

* * *

### [mkdir()](https://tauri.app/reference/javascript/fs/#mkdir)

[Section titled “mkdir()”](https://tauri.app/reference/javascript/fs/#mkdir)

    function mkdir(path, options?): Promise<void>

Creates a new directory with the specified path.

#### [Parameters](https://tauri.app/reference/javascript/fs/#parameters-9)

[Section titled “Parameters”](https://tauri.app/reference/javascript/fs/#parameters-9)

| Parameter | Type |
| --- | --- |
| `path` | `string` \| [`URL`](https://developer.mozilla.org/docs/Web/API/URL) |
| `options`? | [`MkdirOptions`](https://tauri.app/reference/javascript/fs/#mkdiroptions) |

#### [Returns](https://tauri.app/reference/javascript/fs/#returns-13)

[Section titled “Returns”](https://tauri.app/reference/javascript/fs/#returns-13)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`void`\>

#### [Example](https://tauri.app/reference/javascript/fs/#example-9)

[Section titled “Example”](https://tauri.app/reference/javascript/fs/#example-9)

    import { mkdir, BaseDirectory } from '@tauri-apps/plugin-fs';await mkdir('users', { baseDir: BaseDirectory.AppLocalData });

#### [Since](https://tauri.app/reference/javascript/fs/#since-34)

[Section titled “Since”](https://tauri.app/reference/javascript/fs/#since-34)

2.0.0

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L644](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L644)

* * *

### [open()](https://tauri.app/reference/javascript/fs/#open)

[Section titled “open()”](https://tauri.app/reference/javascript/fs/#open)

    function open(path, options?): Promise<FileHandle>

Open a file and resolve to an instance of [`FileHandle`](https://tauri.app/reference/javascript/fs/#filehandle)
. The file does not need to previously exist if using the `create` or `createNew` open options. It is the callers responsibility to close the file when finished with it.

#### [Parameters](https://tauri.app/reference/javascript/fs/#parameters-10)

[Section titled “Parameters”](https://tauri.app/reference/javascript/fs/#parameters-10)

| Parameter | Type |
| --- | --- |
| `path` | `string` \| [`URL`](https://developer.mozilla.org/docs/Web/API/URL) |
| `options`? | [`OpenOptions`](https://tauri.app/reference/javascript/fs/#openoptions) |

#### [Returns](https://tauri.app/reference/javascript/fs/#returns-14)

[Section titled “Returns”](https://tauri.app/reference/javascript/fs/#returns-14)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<[`FileHandle`](https://tauri.app/reference/javascript/fs/#filehandle)
\>

#### [Example](https://tauri.app/reference/javascript/fs/#example-10)

[Section titled “Example”](https://tauri.app/reference/javascript/fs/#example-10)

    import { open, BaseDirectory } from "@tauri-apps/plugin-fs"const file = await open("foo/bar.txt", { read: true, write: true, baseDir: BaseDirectory.AppLocalData });// Do work with fileawait file.close();

#### [Since](https://tauri.app/reference/javascript/fs/#since-35)

[Section titled “Since”](https://tauri.app/reference/javascript/fs/#since-35)

2.0.0

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L565](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L565)

* * *

### [readDir()](https://tauri.app/reference/javascript/fs/#readdir)

[Section titled “readDir()”](https://tauri.app/reference/javascript/fs/#readdir)

    function readDir(path, options?): Promise<DirEntry[]>

Reads the directory given by path and returns an array of `DirEntry`.

#### [Parameters](https://tauri.app/reference/javascript/fs/#parameters-11)

[Section titled “Parameters”](https://tauri.app/reference/javascript/fs/#parameters-11)

| Parameter | Type |
| --- | --- |
| `path` | `string` \| [`URL`](https://developer.mozilla.org/docs/Web/API/URL) |
| `options`? | [`ReadDirOptions`](https://tauri.app/reference/javascript/fs/#readdiroptions) |

#### [Returns](https://tauri.app/reference/javascript/fs/#returns-15)

[Section titled “Returns”](https://tauri.app/reference/javascript/fs/#returns-15)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<[`DirEntry`](https://tauri.app/reference/javascript/fs/#direntry)
\[\]>

#### [Example](https://tauri.app/reference/javascript/fs/#example-11)

[Section titled “Example”](https://tauri.app/reference/javascript/fs/#example-11)

    import { readDir, BaseDirectory } from '@tauri-apps/plugin-fs';import { join } from '@tauri-apps/api/path';const dir = "users"const entries = await readDir('users', { baseDir: BaseDirectory.AppLocalData });processEntriesRecursively(dir, entries);async function processEntriesRecursively(parent, entries) {  for (const entry of entries) {    console.log(`Entry: ${entry.name}`);    if (entry.isDirectory) {       const dir = await join(parent, entry.name);      processEntriesRecursively(dir, await readDir(dir, { baseDir: BaseDirectory.AppLocalData }))    }  }}

#### [Since](https://tauri.app/reference/javascript/fs/#since-36)

[Section titled “Since”](https://tauri.app/reference/javascript/fs/#since-36)

2.0.0

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L706](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L706)

* * *

### [readFile()](https://tauri.app/reference/javascript/fs/#readfile)

[Section titled “readFile()”](https://tauri.app/reference/javascript/fs/#readfile)

    function readFile(path, options?): Promise<Uint8Array>

Reads and resolves to the entire contents of a file as an array of bytes. TextDecoder can be used to transform the bytes to string if required.

#### [Parameters](https://tauri.app/reference/javascript/fs/#parameters-12)

[Section titled “Parameters”](https://tauri.app/reference/javascript/fs/#parameters-12)

| Parameter | Type |
| --- | --- |
| `path` | `string` \| [`URL`](https://developer.mozilla.org/docs/Web/API/URL) |
| `options`? | [`ReadFileOptions`](https://tauri.app/reference/javascript/fs/#readfileoptions) |

#### [Returns](https://tauri.app/reference/javascript/fs/#returns-16)

[Section titled “Returns”](https://tauri.app/reference/javascript/fs/#returns-16)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<[`Uint8Array`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Uint8Array)
\>

#### [Example](https://tauri.app/reference/javascript/fs/#example-12)

[Section titled “Example”](https://tauri.app/reference/javascript/fs/#example-12)

    import { readFile, BaseDirectory } from '@tauri-apps/plugin-fs';const contents = await readFile('avatar.png', { baseDir: BaseDirectory.Resource });

#### [Since](https://tauri.app/reference/javascript/fs/#since-37)

[Section titled “Since”](https://tauri.app/reference/javascript/fs/#since-37)

2.0.0

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L739](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L739)

* * *

### [readTextFile()](https://tauri.app/reference/javascript/fs/#readtextfile)

[Section titled “readTextFile()”](https://tauri.app/reference/javascript/fs/#readtextfile)

    function readTextFile(path, options?): Promise<string>

Reads and returns the entire contents of a file as UTF-8 string.

#### [Parameters](https://tauri.app/reference/javascript/fs/#parameters-13)

[Section titled “Parameters”](https://tauri.app/reference/javascript/fs/#parameters-13)

| Parameter | Type |
| --- | --- |
| `path` | `string` \| [`URL`](https://developer.mozilla.org/docs/Web/API/URL) |
| `options`? | [`ReadFileOptions`](https://tauri.app/reference/javascript/fs/#readfileoptions) |

#### [Returns](https://tauri.app/reference/javascript/fs/#returns-17)

[Section titled “Returns”](https://tauri.app/reference/javascript/fs/#returns-17)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`string`\>

#### [Example](https://tauri.app/reference/javascript/fs/#example-13)

[Section titled “Example”](https://tauri.app/reference/javascript/fs/#example-13)

    import { readTextFile, BaseDirectory } from '@tauri-apps/plugin-fs';const contents = await readTextFile('app.conf', { baseDir: BaseDirectory.AppConfig });

#### [Since](https://tauri.app/reference/javascript/fs/#since-38)

[Section titled “Since”](https://tauri.app/reference/javascript/fs/#since-38)

2.0.0

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L765](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L765)

* * *

### [readTextFileLines()](https://tauri.app/reference/javascript/fs/#readtextfilelines)

[Section titled “readTextFileLines()”](https://tauri.app/reference/javascript/fs/#readtextfilelines)

    function readTextFileLines(path, options?): Promise<AsyncIterableIterator<string>>

Returns an async AsyncIterableIterator over the lines of a file as UTF-8 string.

#### [Parameters](https://tauri.app/reference/javascript/fs/#parameters-14)

[Section titled “Parameters”](https://tauri.app/reference/javascript/fs/#parameters-14)

| Parameter | Type |
| --- | --- |
| `path` | `string` \| [`URL`](https://developer.mozilla.org/docs/Web/API/URL) |
| `options`? | [`ReadFileOptions`](https://tauri.app/reference/javascript/fs/#readfileoptions) |

#### [Returns](https://tauri.app/reference/javascript/fs/#returns-18)

[Section titled “Returns”](https://tauri.app/reference/javascript/fs/#returns-18)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`AsyncIterableIterator`<`string`\>>

#### [Example](https://tauri.app/reference/javascript/fs/#example-14)

[Section titled “Example”](https://tauri.app/reference/javascript/fs/#example-14)

    import { readTextFileLines, BaseDirectory } from '@tauri-apps/plugin-fs';const lines = await readTextFileLines('app.conf', { baseDir: BaseDirectory.AppConfig });for await (const line of lines) {  console.log(line);}

You could also call AsyncIterableIterator.next to advance the iterator so you can lazily read the next line whenever you want.

#### [Since](https://tauri.app/reference/javascript/fs/#since-39)

[Section titled “Since”](https://tauri.app/reference/javascript/fs/#since-39)

2.0.0

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L798](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L798)

* * *

### [remove()](https://tauri.app/reference/javascript/fs/#remove)

[Section titled “remove()”](https://tauri.app/reference/javascript/fs/#remove)

    function remove(path, options?): Promise<void>

Removes the named file or directory. If the directory is not empty and the `recursive` option isn’t set to true, the promise will be rejected.

#### [Parameters](https://tauri.app/reference/javascript/fs/#parameters-15)

[Section titled “Parameters”](https://tauri.app/reference/javascript/fs/#parameters-15)

| Parameter | Type |
| --- | --- |
| `path` | `string` \| [`URL`](https://developer.mozilla.org/docs/Web/API/URL) |
| `options`? | [`RemoveOptions`](https://tauri.app/reference/javascript/fs/#removeoptions) |

#### [Returns](https://tauri.app/reference/javascript/fs/#returns-19)

[Section titled “Returns”](https://tauri.app/reference/javascript/fs/#returns-19)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`void`\>

#### [Example](https://tauri.app/reference/javascript/fs/#example-15)

[Section titled “Example”](https://tauri.app/reference/javascript/fs/#example-15)

    import { remove, BaseDirectory } from '@tauri-apps/plugin-fs';await remove('users/file.txt', { baseDir: BaseDirectory.AppLocalData });await remove('users', { baseDir: BaseDirectory.AppLocalData });

#### [Since](https://tauri.app/reference/javascript/fs/#since-40)

[Section titled “Since”](https://tauri.app/reference/javascript/fs/#since-40)

2.0.0

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L879](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L879)

* * *

### [rename()](https://tauri.app/reference/javascript/fs/#rename)

[Section titled “rename()”](https://tauri.app/reference/javascript/fs/#rename)

    function rename(   oldPath,   newPath,options?): Promise<void>

Renames (moves) oldpath to newpath. Paths may be files or directories. If newpath already exists and is not a directory, rename() replaces it. OS-specific restrictions may apply when oldpath and newpath are in different directories.

On Unix, this operation does not follow symlinks at either path.

#### [Parameters](https://tauri.app/reference/javascript/fs/#parameters-16)

[Section titled “Parameters”](https://tauri.app/reference/javascript/fs/#parameters-16)

| Parameter | Type |
| --- | --- |
| `oldPath` | `string` \| [`URL`](https://developer.mozilla.org/docs/Web/API/URL) |
| `newPath` | `string` \| [`URL`](https://developer.mozilla.org/docs/Web/API/URL) |
| `options`? | [`RenameOptions`](https://tauri.app/reference/javascript/fs/#renameoptions) |

#### [Returns](https://tauri.app/reference/javascript/fs/#returns-20)

[Section titled “Returns”](https://tauri.app/reference/javascript/fs/#returns-20)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`void`\>

#### [Example](https://tauri.app/reference/javascript/fs/#example-16)

[Section titled “Example”](https://tauri.app/reference/javascript/fs/#example-16)

    import { rename, BaseDirectory } from '@tauri-apps/plugin-fs';await rename('avatar.png', 'deleted.png', { oldPathBaseDir: BaseDirectory.App, newPathBaseDir: BaseDirectory.AppLocalData });

#### [Since](https://tauri.app/reference/javascript/fs/#since-41)

[Section titled “Since”](https://tauri.app/reference/javascript/fs/#since-41)

2.0.0

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L918](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L918)

* * *

### [size()](https://tauri.app/reference/javascript/fs/#size)

[Section titled “size()”](https://tauri.app/reference/javascript/fs/#size)

    function size(path): Promise<number>

Get the size of a file or directory. For files, the `stat` functions can be used as well.

If `path` is a directory, this function will recursively iterate over every file and every directory inside of `path` and therefore will be very time consuming if used on larger directories.

#### [Parameters](https://tauri.app/reference/javascript/fs/#parameters-17)

[Section titled “Parameters”](https://tauri.app/reference/javascript/fs/#parameters-17)

| Parameter | Type |
| --- | --- |
| `path` | `string` \| [`URL`](https://developer.mozilla.org/docs/Web/API/URL) |

#### [Returns](https://tauri.app/reference/javascript/fs/#returns-21)

[Section titled “Returns”](https://tauri.app/reference/javascript/fs/#returns-21)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`number`\>

#### [Example](https://tauri.app/reference/javascript/fs/#example-17)

[Section titled “Example”](https://tauri.app/reference/javascript/fs/#example-17)

    import { size, BaseDirectory } from '@tauri-apps/plugin-fs';// Get the size of the `$APPDATA/tauri` directory.const dirSize = await size('tauri', { baseDir: BaseDirectory.AppData });console.log(dirSize); // 1024

#### [Since](https://tauri.app/reference/javascript/fs/#since-42)

[Section titled “Since”](https://tauri.app/reference/javascript/fs/#since-42)

2.1.0

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L1341](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L1341)

* * *

### [stat()](https://tauri.app/reference/javascript/fs/#stat-1)

[Section titled “stat()”](https://tauri.app/reference/javascript/fs/#stat-1)

    function stat(path, options?): Promise<FileInfo>

Resolves to a [`FileInfo`](https://tauri.app/reference/javascript/fs/#fileinfo)
 for the specified `path`. Will always follow symlinks but will reject if the symlink points to a path outside of the scope.

#### [Parameters](https://tauri.app/reference/javascript/fs/#parameters-18)

[Section titled “Parameters”](https://tauri.app/reference/javascript/fs/#parameters-18)

| Parameter | Type |
| --- | --- |
| `path` | `string` \| [`URL`](https://developer.mozilla.org/docs/Web/API/URL) |
| `options`? | [`StatOptions`](https://tauri.app/reference/javascript/fs/#statoptions) |

#### [Returns](https://tauri.app/reference/javascript/fs/#returns-22)

[Section titled “Returns”](https://tauri.app/reference/javascript/fs/#returns-22)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<[`FileInfo`](https://tauri.app/reference/javascript/fs/#fileinfo)
\>

#### [Example](https://tauri.app/reference/javascript/fs/#example-18)

[Section titled “Example”](https://tauri.app/reference/javascript/fs/#example-18)

    import { stat, BaseDirectory } from '@tauri-apps/plugin-fs';const fileInfo = await stat("hello.txt", { baseDir: BaseDirectory.AppLocalData });console.log(fileInfo.isFile); // true

#### [Since](https://tauri.app/reference/javascript/fs/#since-43)

[Section titled “Since”](https://tauri.app/reference/javascript/fs/#since-43)

2.0.0

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L958](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L958)

* * *

### [truncate()](https://tauri.app/reference/javascript/fs/#truncate-1)

[Section titled “truncate()”](https://tauri.app/reference/javascript/fs/#truncate-1)

    function truncate(   path,   len?,options?): Promise<void>

Truncates or extends the specified file, to reach the specified `len`. If `len` is `0` or not specified, then the entire file contents are truncated.

#### [Parameters](https://tauri.app/reference/javascript/fs/#parameters-19)

[Section titled “Parameters”](https://tauri.app/reference/javascript/fs/#parameters-19)

| Parameter | Type |
| --- | --- |
| `path` | `string` \| [`URL`](https://developer.mozilla.org/docs/Web/API/URL) |
| `len`? | `number` |
| `options`? | [`TruncateOptions`](https://tauri.app/reference/javascript/fs/#truncateoptions) |

#### [Returns](https://tauri.app/reference/javascript/fs/#returns-23)

[Section titled “Returns”](https://tauri.app/reference/javascript/fs/#returns-23)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`void`\>

#### [Example](https://tauri.app/reference/javascript/fs/#example-19)

[Section titled “Example”](https://tauri.app/reference/javascript/fs/#example-19)

    import { truncate, readTextFile, writeTextFile, BaseDirectory } from '@tauri-apps/plugin-fs';// truncate the entire fileawait truncate("my_file.txt", 0, { baseDir: BaseDirectory.AppLocalData });
    // truncate part of the fileconst filePath = "file.txt";await writeTextFile(filePath, "Hello World", { baseDir: BaseDirectory.AppLocalData });await truncate(filePath, 7, { baseDir: BaseDirectory.AppLocalData });const data = await readTextFile(filePath, { baseDir: BaseDirectory.AppLocalData });console.log(data);  // "Hello W"

#### [Since](https://tauri.app/reference/javascript/fs/#since-44)

[Section titled “Since”](https://tauri.app/reference/javascript/fs/#since-44)

2.0.0

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L1024](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L1024)

* * *

### [watch()](https://tauri.app/reference/javascript/fs/#watch)

[Section titled “watch()”](https://tauri.app/reference/javascript/fs/#watch)

    function watch(   paths,   cb,options?): Promise<UnwatchFn>

Watch changes (after a delay) on files or directories.

#### [Parameters](https://tauri.app/reference/javascript/fs/#parameters-20)

[Section titled “Parameters”](https://tauri.app/reference/javascript/fs/#parameters-20)

| Parameter | Type |
| --- | --- |
| `paths` | `string` \| [`URL`](https://developer.mozilla.org/docs/Web/API/URL)<br> \| `string`\[\] \| [`URL`](https://developer.mozilla.org/docs/Web/API/URL)<br>\[\] |
| `cb` | (`event`) => `void` |
| `options`? | [`DebouncedWatchOptions`](https://tauri.app/reference/javascript/fs/#debouncedwatchoptions) |

#### [Returns](https://tauri.app/reference/javascript/fs/#returns-24)

[Section titled “Returns”](https://tauri.app/reference/javascript/fs/#returns-24)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<[`UnwatchFn`](https://tauri.app/reference/javascript/fs/#unwatchfn)
\>

#### [Since](https://tauri.app/reference/javascript/fs/#since-45)

[Section titled “Since”](https://tauri.app/reference/javascript/fs/#since-45)

2.0.0

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L1298](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L1298)

* * *

### [watchImmediate()](https://tauri.app/reference/javascript/fs/#watchimmediate)

[Section titled “watchImmediate()”](https://tauri.app/reference/javascript/fs/#watchimmediate)

    function watchImmediate(   paths,   cb,options?): Promise<UnwatchFn>

Watch changes on files or directories.

#### [Parameters](https://tauri.app/reference/javascript/fs/#parameters-21)

[Section titled “Parameters”](https://tauri.app/reference/javascript/fs/#parameters-21)

| Parameter | Type |
| --- | --- |
| `paths` | `string` \| [`URL`](https://developer.mozilla.org/docs/Web/API/URL)<br> \| `string`\[\] \| [`URL`](https://developer.mozilla.org/docs/Web/API/URL)<br>\[\] |
| `cb` | (`event`) => `void` |
| `options`? | [`WatchOptions`](https://tauri.app/reference/javascript/fs/#watchoptions) |

#### [Returns](https://tauri.app/reference/javascript/fs/#returns-25)

[Section titled “Returns”](https://tauri.app/reference/javascript/fs/#returns-25)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<[`UnwatchFn`](https://tauri.app/reference/javascript/fs/#unwatchfn)
\>

#### [Since](https://tauri.app/reference/javascript/fs/#since-46)

[Section titled “Since”](https://tauri.app/reference/javascript/fs/#since-46)

2.0.0

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L1315](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L1315)

* * *

### [writeFile()](https://tauri.app/reference/javascript/fs/#writefile)

[Section titled “writeFile()”](https://tauri.app/reference/javascript/fs/#writefile)

    function writeFile(   path,   data,options?): Promise<void>

Write `data` to the given `path`, by default creating a new file if needed, else overwriting.

#### [Parameters](https://tauri.app/reference/javascript/fs/#parameters-22)

[Section titled “Parameters”](https://tauri.app/reference/javascript/fs/#parameters-22)

| Parameter | Type |
| --- | --- |
| `path` | `string` \| [`URL`](https://developer.mozilla.org/docs/Web/API/URL) |
| `data` | [`Uint8Array`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Uint8Array)<br> \| [`ReadableStream`](https://developer.mozilla.org/docs/Web/API/ReadableStream)<br><[`Uint8Array`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Uint8Array)<br>\> |
| `options`? | [`WriteFileOptions`](https://tauri.app/reference/javascript/fs/#writefileoptions) |

#### [Returns](https://tauri.app/reference/javascript/fs/#returns-26)

[Section titled “Returns”](https://tauri.app/reference/javascript/fs/#returns-26)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`void`\>

#### [Example](https://tauri.app/reference/javascript/fs/#example-20)

[Section titled “Example”](https://tauri.app/reference/javascript/fs/#example-20)

    import { writeFile, BaseDirectory } from '@tauri-apps/plugin-fs';
    let encoder = new TextEncoder();let data = encoder.encode("Hello World");await writeFile('file.txt', data, { baseDir: BaseDirectory.AppLocalData });

#### [Since](https://tauri.app/reference/javascript/fs/#since-47)

[Section titled “Since”](https://tauri.app/reference/javascript/fs/#since-47)

2.0.0

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L1069](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L1069)

* * *

### [writeTextFile()](https://tauri.app/reference/javascript/fs/#writetextfile)

[Section titled “writeTextFile()”](https://tauri.app/reference/javascript/fs/#writetextfile)

    function writeTextFile(   path,   data,options?): Promise<void>

Writes UTF-8 string `data` to the given `path`, by default creating a new file if needed, else overwriting.

#### [Parameters](https://tauri.app/reference/javascript/fs/#parameters-23)

[Section titled “Parameters”](https://tauri.app/reference/javascript/fs/#parameters-23)

| Parameter | Type |
| --- | --- |
| `path` | `string` \| [`URL`](https://developer.mozilla.org/docs/Web/API/URL) |
| `data` | `string` |
| `options`? | [`WriteFileOptions`](https://tauri.app/reference/javascript/fs/#writefileoptions) |

#### [Returns](https://tauri.app/reference/javascript/fs/#returns-27)

[Section titled “Returns”](https://tauri.app/reference/javascript/fs/#returns-27)

[`Promise`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise)
<`void`\>

#### [Example](https://tauri.app/reference/javascript/fs/#example-21)

[Section titled “Example”](https://tauri.app/reference/javascript/fs/#example-21)

    import { writeTextFile, BaseDirectory } from '@tauri-apps/plugin-fs';
    await writeTextFile('file.txt', "Hello world", { baseDir: BaseDirectory.AppLocalData });

#### [Since](https://tauri.app/reference/javascript/fs/#since-48)

[Section titled “Since”](https://tauri.app/reference/javascript/fs/#since-48)

2.0.0

**Source**: [https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L1118](https://github.com/tauri-apps/plugins-workspace/blob/v2/plugins/fs/guest-js/index.ts#L1118)

* * *

[Support on Open Collective](https://opencollective.com/tauri)
 [Sponsor on GitHub](https://github.com/sponsors/tauri-apps)

© 2026 Tauri Contributors. CC-BY / MIT

---