[bug] Generated Leptos project doesn't work
Closed this issue ยท 3 comments
First of all, I really appreciate your hard work, and congrats on the Tauri 2.0 release ๐ฅ๐ฅ๐ฅ
I was excited to try it out with Leptos, but haven't been able to make it work yet, because of this issue:
Describe the bug
Trying to use create-tauri-app
to create a leptos app and running it doesn't work, see below:
Reproduction
PS D:\dev\proj> cargo create-tauri-app
โ Project name ยท tauri-leptos-app
โ Identifier ยท com.tauri-leptos-app.app
โ Choose which language to use for your frontend ยท Rust - (cargo)
โ Choose your UI template ยท Leptos - (https://leptos.dev/)
Template created! To get started run:
cd tauri-leptos-app
cargo tauri android init
For Desktop development, run:
cargo tauri dev
For Android development, run:
cargo tauri android dev
PS D:\dev\proj> cd .\tauri-leptos-app\
PS D:\dev\proj\tauri-leptos-app> cargo tauri dev
Error `tauri.conf.json` error on `build`: Additional properties are not allowed ('devUrl', 'frontendDist' were unexpected)
Error `tauri.conf.json` error: Additional properties are not allowed ('app', 'bundle', 'identifier', 'productName', 'version' were unexpected)
So then I removed those offending keys from the JSON, now it runs, but in the browser it panics because window.__TAURI__
is not defined!
I confirmed with:
use leptos::*;
use wasm_bindgen::prelude::*;
#[wasm_bindgen]
extern "C" {
#[wasm_bindgen(js_namespace = ["window", "__TAURI__", "tauri"])]
fn invoke(cmd: &str, args: JsValue) -> JsValue;
}
#[component]
pub fn App() -> impl IntoView {
let is_tauri_available = create_memo(move |_| {
let window = window();
window.get("__TAURI__").is_some()
});
view! {
<div>
{move || if is_tauri_available.get() {
view! { <p>"Tauri is available"</p> }
} else {
view! { <p>"Tauri is not available"</p> }
}}
</div>
}
}
It shows "Tauri is not available".
So then I saw in the checklist that I should add
"app": {
"withGlobalTauri": true
}
but if I do that, it complains again!
PS D:\dev\proj\tauri-leptos-app> cargo tauri dev
Error `tauri.conf.json` error: Additional properties are not allowed ('app' was unexpected)
So it seems there's no way to make this work (?)
Expected behavior
The project generated with the CLI should build & run without any modification, ideally ๐
Full tauri info
output
PS D:\dev\proj\tauri-leptos-app> cargo tauri info
WARNING: no lock files found, defaulting to npm
[โ] Environment
- OS: Windows 10.0.22631 X64
โ WebView2: 129.0.2792.65
โ MSVC: Visual Studio Community 2022
โ rustc: 1.82.0-nightly (8b3870784 2024-08-07)
โ cargo: 1.82.0-nightly (94977cb1f 2024-08-06)
โ rustup: 1.27.1 (54dd3d00f 2024-04-24)
โ Rust toolchain: nightly-x86_64-pc-windows-msvc (environment override by RUSTUP_TOOLCHAIN)
- node: 20.9.0
- pnpm: 8.10.5
- npm: 10.1.0
- bun: 1.1.27
[-] Packages
- tauri [RUST]: 2.0.1
- tauri-build [RUST]: 2.0.1
- wry [RUST]: 0.44.1
- tao [RUST]: 0.30.2
- tauri-cli [RUST]: 2.0.0-alpha.21
- @tauri-apps/api ๎: not installed!
- @tauri-apps/cli [NPM]: 2.0.0-alpha.21 (outdated, latest: 2.0.1)
[-] App
- build-type: build
- CSP: unset
- distDir: ../dist
- devPath: http://localhost:8080/
Additional context
Another (but small) issue of this template:
It starts listening at port 1420 but it's waiting for it to listen on port 8080 and keeps repeatedly printing these warnings:
2024-10-03T22:18:23.051588Z INFO server listening at http://127.0.0.1:1420
Warn Waiting for your frontend dev server to start on http://localhost:8080/...
Warn Waiting for your frontend dev server to start on http://localhost:8080/...
Warn Waiting for your frontend dev server to start on http://localhost:8080/...
[etc.]
And a third issue:
When canceling with Ctrl-C, even though the CLI returns, trunk keeps running in the background and I have to kill it manually/separately!
I had the same issue but on macOS. Updating tauri-cli resolved the issue for me.
cargo install tauri-cli --version "^2.0.0" --locked
ref: https://v2.tauri.app/reference/cli/
After this, I was able to run cargo create-tauri-app
and the templates worked without modification.
Ah thanks, now it works :)