tibi-svelte-starter/src/components/App.svelte

<script lang="ts">
    import { Router, Route } from "svelte-routing"
    import { scrollToTop } from "svelte-scrollto"
    import { generalInfo, location, currentLang } from "../store"

    import Home from "./routes/Home.svelte"
    import Content from "./routes/Content.svelte"

    import Header from "./widgets/Header.svelte"
    import Footer from "./widgets/Footer.svelte"

    export let url = ""

    if (url) {
        // ssr
        let l = url.split("?")
        $location = {
            path: l[0],
            search: l.length > 1 ? l[1] : "",
            push: false,
            pop: false,
        }
    }

    // scroll to top on new site
    location.subscribe((location) => {
        if (location.push) scrollToTop()
    })

    if (typeof window !== "undefined") console.log("App initialized")
</script>

<svelte:head>
    {#if $generalInfo?.meta?.metaTitle}
        <title>{$generalInfo?.meta?.metaTitle}</title>
    {/if}
    {#if $generalInfo?.meta?.metaDescription}
        <meta name="description" content="{$generalInfo?.meta?.metaDescription}" />
    {/if}
    {#if $generalInfo?.meta?.metaKeywords}
        <meta name="keywords" content="{$generalInfo?.meta?.metaKeywords.replaceAll(' ', '')}" />
    {/if}
    {#if $generalInfo?.person?.firstname || $generalInfo?.person?.lastname}
        <meta
            name="author"
            content="{$generalInfo?.person?.firstname ? $generalInfo?.person?.firstname : ''} {$generalInfo?.person
                ?.lastname
                ? $generalInfo?.person?.lastname
                : ''}"
        />
    {/if}
    {#if $generalInfo?.meta?.metaTagRobots}
        <meta name="robots" content="{$generalInfo?.meta?.metaTagRobots}" />
    {/if}
    {#if $generalInfo?.media?.favicon}
        <link rel="shortcut icon" type="image/x-icon" href="{$generalInfo?.media?.favicon.src}" />
    {/if}
</svelte:head>

<Header />

<Router url="{url}">
    <Route path="/" let:params>
        <Home />
    </Route>
    <Route path="/*path" let:params>
        <Content path="{params.path}" />
    </Route>
</Router>

<Footer />

<style lang="less" global>
    @import "./../css/main.less";
</style>