Route parameters "user/:id" and "second level" urls create an "Unexpected token <" error

i serve my svelte single page application with express. As long as i try following:

<script>
    import {Router, Route} from 'svelte-navigator'
</script>

<Router>
    <Route path="/">root</Route>
    <Route path="test">test</Route>
    <Route path="test/:id">works!</Route>
</Router>

and go to "localhost:3000" it outputs "root", and go to "localhost:3000/test" it outputs "test", and go to "localhost:3000/test/2" it displays a blank image and an error in the console SyntaxError: Unexpected token '<'

i've tried to launch the bundle with a sirv --single, same result:

and go to "localhost:3000" it outputs "root",

  [17:08:11] 200 ─ 3.70ms ─ /build/bundle.css
  [17:08:11] 200 ─ 6.28ms ─ /build/bundle.js
  [17:08:11] 200 ─ 2.68ms ─ /build/bundle.js.map

and go to "localhost:3000/test" it outputs "test",

  [17:12:00] 200 ─ 1.06ms ─ /build/bundle.css
  [17:12:00] 200 ─ 0.83ms ─ /build/bundle.js
  [17:12:00] 200 ─ 1.31ms ─ /build/bundle.js.map

and go to "localhost:3000/test/2" instead of syntax error, i get 404 on bundle.css and bundle.js

  [17:08:23] 404 ─ 0.31ms ─ /test/build/bundle.css
  [17:08:23] 404 ─ 0.15ms ─ /test/build/bundle.js

same thing happens if i try to create second level urls like "localhost:3000/test/second"

  [17:06:24] 200 ─ 1.05ms ─ /test/second
  [17:06:25] 404 ─ 0.23ms ─ /test/build/bundle.css
  [17:06:25] 404 ─ 0.18ms ─ /test/build/bundle.js

<Router>
    <Route path="/">bla</Route>
    <Route path="test">hello</Route>
    <Route path="test/second">works!</Route>
</Router>

what i might do wrong?

client package.json

{
    "name": "Alenashop_Client",
    "version": "1.0.0",
    "scripts": {
        "build": "rollup -c",
        "start": "rollup -c -w",
        "preview": "sirv public --no-clear --single"
    },
    "devDependencies": {
        "@rollup/plugin-alias": "^3.1.9",
        "@rollup/plugin-commonjs": "^17.0.0",
        "@rollup/plugin-node-resolve": "^11.0.0",
        "rollup": "^2.35.1",
        "rollup-plugin-css-only": "^3.1.0",
        "rollup-plugin-livereload": "^2.0.0",
        "rollup-plugin-svelte": "~7.0.0",
        "rollup-plugin-terser": "^7.0.2",
        "sirv-cli": "^1.0.10",
        "svelte": "^3.31.1"
    },
    "dependencies": {
        "@mdi/js": "^6.6.96",
        "svelte-navigator": "^3.1.5"
    }
}

rollup config

import path from 'path'
import svelte from 'rollup-plugin-svelte'
import resolve from '@rollup/plugin-node-resolve'
import commonjs from '@rollup/plugin-commonjs'
import alias from '@rollup/plugin-alias'
import livereload from 'rollup-plugin-livereload'
import {terser} from 'rollup-plugin-terser'
import css from 'rollup-plugin-css-only'
const dev = process.env.ROLLUP_WATCH

export default {
    input: 'src/index.js',
    output: {
        sourcemap: true,
        format: 'iife',
        name: 'app',
        file: 'public/build/bundle.js',
    },
    plugins: [
        svelte({compilerOptions: {dev}}),
        css({output: 'bundle.css'}),
        resolve(),
        commonjs(),
        dev && livereload('public'),
        !dev && terser(),
        alias({
            entries: {
                '~': path.resolve(__dirname, './src'),
            },
        }),
    ],
}

mefechoel / svelte-navigator

Route parameters "user/:id" and "second level" urls create an "Unexpected token <" error #71