svelteness / kit-docs

Documentation integration for SvelteKit.
https://kitdocs.vercel.app
MIT License
471 stars 33 forks source link

Unexpected token < in JSON at position 0 on each route #3

Closed isaacfink closed 2 years ago

isaacfink commented 2 years ago

I copied the docs route folder from this repo as a starting point but I keep getting this error, the only thing I changed in the folder is I removed the images (logo, and social card) and all the references to it, I also renamed layout to layout.reset because I have a root layout

I have a [dir].sidebar.json.js with the following code

import { createSidebarRequestHandler } from '@svelteness/kit-docs/node';

export const get = createSidebarRequestHandler();

and [slug].meta.json.js

import { createMetaRequestHandler } from '@svelteness/kit-docs/node';

export const get = createMetaRequestHandler();

this is my svelte config

import preprocess from 'svelte-preprocess';
import adapter from '@sveltejs/adapter-auto';
import {kitDocsPlugin} from '@svelteness/kit-docs/node'
import Icons from 'unplugin-icons/vite'

/** @type {import('@sveltejs/kit').Config} */
const config = {
    extensions: ['.svelte', '.md'],
    kit: {
        adapter: adapter(),
        vite:{
            optimizeDeps: {
                exclude: ['@urql/svelte', '@urql/core'],
              },

              plugins: [
                  Icons({compiler: 'svelte'}),
                  kitDocsPlugin({
                      shiki: {
                          theme: 'material-ocean'
                      },
                  }),
              ],

        }
    },

    preprocess: [
        preprocess({
            postcss: true
        })
    ]
};

export default config;

I always get the same error,

500
Unexpected token < in JSON at position 0
SyntaxError: Unexpected token < in JSON at position 0
    at JSON.parse (<anonymous>)
    at Proxy.<anonymous> (file:///Users/isaac/Desktop/projects/saffron/redo/frontend/.svelte-kit/runtime/server/index.js:1797:21)
    at processTicksAndRejections (node:internal/process/task_queues:96:5)
    at async eval (/node_modules/@svelteness/kit-docs/client/loaders/index.js:22:22)
    at async load_node (file:///Users/isaac/Desktop/projects/saffron/redo/frontend/.svelte-kit/runtime/server/index.js:1826:12)
    at async respond$1 (file:///Users/isaac/Desktop/projects/saffron/redo/frontend/.svelte-kit/runtime/server/index.js:2177:15)
    at async render_page (file:///Users/isaac/Desktop/projects/saffron/redo/frontend/.svelte-kit/runtime/server/index.js:2378:19)
    at async resolve (file:///Users/isaac/Desktop/projects/saffron/redo/frontend/.svelte-kit/runtime/server/index.js:2610:11)
    at async respond (file:///Users/isaac/Desktop/projects/saffron/redo/frontend/.svelte-kit/runtime/server/index.js:2543:20)
    at async file:///Users/isaac/Desktop/projects/saffron/redo/frontend/node_modules/@sveltejs/kit/dist/chunks/index.js:244:24
isaacfink commented 2 years ago

I am not using typescript so I didn't include an of the types

didier commented 2 years ago

I noticed that root routes don't work, e.g.: you can't use kit-docs at /, but you can at /docs/ or something that's at least one level deep.

mihar-22 commented 2 years ago

Probably the loader is failing to normalize the slug. Can you push your code up to a repo that you can share with me. It'd help me debug way faster.

Myrmod commented 2 years ago

I got the same kind of error if I am not mistaken:

https://github.com/Myrmod/svelte-babylon/tree/kit-docs

git clone git@github.com:Myrmod/svelte-babylon.git && cd svelte-babylon
git checkout kit-docs
npm ci
npm run dev
mihar-22 commented 2 years ago

This should be resolved in the latest. Added better loader fail handling and the default layout has better meta null checks too.

isaacfink commented 2 years ago

I tried on multiple routes so it's not only the root route, what's the latest?

mihar-22 commented 2 years ago

upgrade to 0.6.1 -> npm i @svelteness/kit-docs@^0.6.1 -D

isaacfink commented 2 years ago

So i upgraded and it's still not working, here is a repo with a reproduction, please let me know when I can delete the repo git@github.com:isaacfink/svelteness-kit-docs-issue.git

mihar-22 commented 2 years ago

Thanks heaps for the repro @isaacfink. The issue seemed to be that shiki wasn't being optimized by Vite and failing server-side import. I've included by default now. You can delete the repo right after you test if 0.7.2 fixes things on your end.

isaacfink commented 2 years ago

Thanks such I'll test it tomorrow and let you know, if you don't mind explaining in short what is shiki? I saw it's in the config but I had no idea what it does, is it the theme?

mihar-22 commented 2 years ago

Syntax highlighter: https://shiki.matsu.io/

isaacfink commented 2 years ago

Also should I expect problems with deployment? Specifically with vercel?

mihar-22 commented 2 years ago

I've personally deployed to Vercel without any issues. Feel free to test it out in a PR so it's not on your main site. If you run into any issues let me know in a new issue.

Myrmod commented 2 years ago

Since 0.7.2 it works fine. Thank you a lot :)

isaacfink commented 2 years ago

It works now but I have a different issue now, the sidebar disappears after a second

mihar-22 commented 2 years ago

Thanks @isaacfink. I'm looking in to it now https://github.com/svelteness/kit-docs/issues/10.