Svelte - routing , When I try entering any url I only get "No webpage was found" error-CodePudding

Using "svelte-routing" because I need to load a single page from lots of different urls , with the different urls serving as parameters. For example if a client loads into my-sight/123 the sight needs to load the app.svelte component while passing 123 as a parameter. The Problem is that whatever url I enter after the "my-sight/" I always get a "No webpage was found" page. App.svelte:

<script script lang="ts">
  import MenuGenerator from './components/MenuSections/MenuGenerator.svelte';
  import { Router, Route } from 'svelte-routing';
</script>

<Router>
  <Route path="/:accomodation" component={MenuGenerator} />
</Router>

MenuGenerator.svelte:

<script script lang="ts">
  export let accomodation: string;
  console.log('hello ', accomodation);
</script>

I've tested this on https://codesandbox.io/s/svelte-routing-forked-ztddj , just add anything after the / in the url and press enter and the same text is in the console.

Edit: We have QR codes and NFC tags, their urls are set and cannot be changed. The urls are my-sight/{qr_code} . I need routing that would redirect every possible url to home and pass in the {qr_code} as a value.

CodePudding user response：

With that last edit / comment, your use case makes a whole lot more sense.

You can use window.location.pathname in the browser to identify the QR Code within the URL.

<script>
  import { Router, Route } from "svelte-routing";
  import Home from "./routes/Home.svelte";
  import { onMount } from "svelte";
  onMount(()=>{
     let qr_code = window.location.pathname.substring(1);  // dump leading '/'
     console.log("qr_code: ", qr_code);
  })

</script>

  <Router>
    <div >
      <Route path="/:id" component={Home} />
    </div>
  </Router>

(edit) This answer specifically address the need to" I need routing that would redirect every possible url to home and pass in the {qr_code} as a value.

It sounds now, like that is only a partial requirement. (/edit)

CodePudding user response：

SOLVED !!!

I needed to uncomment a line of code in my snowpack config.

The line of code is:

//{ match: 'routes', src: '.*', dest: '/index.html' },

Tnx for the help !