Sapper перезагружает страницу [slug] без html, только json на странице

Проблема в том, что у вас есть перекрывающиеся маршруты - ваш маршрут API и ваша страница находятся в / books / slug-go-here. Когда вы перемещаетесь на стороне клиента, Sapper заменяет новый компонент Svelte и ничего не запрашивает с сервера. Когда вы идете туда напрямую, браузер запрашивает / books / slug-go-here и получает JSON от вашего API.

Чтобы исправить это, вы должны переименовать свой серверный маршрут в [slug].json.js и загрузить /books/slug-goes-here.json в свой компонент. Таким образом, у вас есть два разных маршрута: / books / slug-go-here возвращает HTML-страницу, а /books/slug-goes-here.json возвращает данные JSON для этой страницы.

<!-- [slug].svelte -->
<script context="module">
    export async function preload({ params }) {
        // this is the component located at books/[slug]
        // it requests books/[slug].json to get its data
        const res = await this.fetch(`books/${params.slug}.json`);
        const data = await res.json();

        // etc
    }
</script>