Working with Svelte Kit Table of Contents

2021-08-17

While working on this site, I ran across a module that seems to work well with the new

Svelte Kit

appication development toolkit. This is the

NPM svelte-toc module

I was as easy as described in the docs:

$ npm i -D svelte-toc

then simply import it into the the project:

<script lang="ts">
    import Toc from 'svelte-toc'
    ...
</script>

then use it:

<Toc />

I’ve only noticed some more update issues in dev mode. Sometimes it doesn’t correctly update the

ToC

after switching between pages. In particular an old page header tag is still shown until you click around the navagation a couple of time, then it seems to fix it self.

I’m not sure if this is an issue with the module itself, or with the way that I have my navigation system built.