#Sveltekit Navigation

6 messages · Page 1 of 1 (latest)

storm badge
#

How am I supposed to do navigation in taui/sveltekit?

Am I supposed to use svelte-routing?

I tried:

$app/navigation failed to resolve import.

import { goto } from '$app/navigation';

function selection(path) {
goto('./Primary');
}

dull adder
#

You should use some variant of routing functionality from the framework you use. I still haven't delved too deeply into Svelte but I would assume svelte-routing is what you should use

storm badge
#

Well, Sveltekit comes with routing (via $app/navigation and goto),
And svelte does not which uses the pckg svelte-routing

As far as I can tell, the sveltekit navigation pckg is missing from node_modules. So I guess I'll try svelte-routing.

The worst part of Svelte is changing pages. Which is a weird criticism to have.

dull adder
#

Vue was annoying as well before Vue Router. Give it time, Svelte is still the new kid on the block 🙂

storm badge
#

Svelte's lots of fun.

storm badge
#

How to route sveltekit

Install svelte-routing and do as the instructions

App.svelte
<script>
export let url = "menu"; // The initial page to load into (like index.html)
</script>

<main class="container">
  <Router {url}>
    <Route path="primary" component={Primary} />
    <Route path="secondary" component={Secondary} />
    <Route path="menu" component={Menu}></Route>
     <!-- fallback route when none above match -->
    <Route let:params>
      <p>Page not found</p>
    </Route>
  </Router>
</main>

Router literally works like your home network router. This is just a wrapper that tells the plugin what pages you have. component= links the path= to your actual svelte components. navigate("/pageName");