DEV Community
Follow
One Vue app, three homes: desktop with Tauri, Android with Capacitor, and the web
The author built a single Vue.js application to serve as a desktop client, an Android app, and a web app. This approach allows for a unified UI, API calls, and OAuth flow across all targets. For desktop, Tauri with a Rust backend was used, while Capacitor was chosen for Android. A plain web version is also available. A significant challenge is that cross-compilation is not feasible; each platform's native toolchain is required for building. Older Windows versions might lack WebView2, necessitating bundling a bootstrapper with the installer. Handling OAuth redirects in packaged apps is complex, requiring custom schemes or deep linking instead of traditional web server callbacks. Rust release binary size can be reduced through specific Cargo.toml optimizations like panic="abort" and link-time optimization. Despite these complexities, the author found the approach worthwhile for avoiding separate project maintenance. The author recommends Vue combined with Tauri and Capacitor for web developers targeting desktop and mobile, advising to account for packaging and OAuth intricacies. The author also offers freelance services for this type of development.