Skip to content

build(docs): use custom Vite plugin to develop docs #55

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 5 commits into from
Feb 23, 2025

Conversation

metonym
Copy link
Owner

@metonym metonym commented Feb 23, 2025

I want to avoid syncing the README with the deployed demo site (e.g., #54).

Since the demo site is almost a verbatim reflection the README, it makes sense to build the docs site from the README.

This use a custom Vite plugin that preprocesses the README before it's processed by the Svelte Vite plugin.

It uses marked along with a couple of plugins to do the heavy lifting. In addition, it designated a watchDir, in which component cases can be added or updated.

These cases are then referenced as inline comments in the README. As Markdown, they are invisible, but in the docs site, they render the live example.


Some additional work following this:

  • Performance: pre-render the HTML and re-hydrate interactivity
  • Performance: de-couple component instances from the bulk of the markup (avoid including code strings in JS bundle)
  • Extract the custom plugin into an NPM package
  • Write unit tests using the example component cases

@metonym metonym merged commit 89ed672 into master Feb 23, 2025
1 check passed
@metonym metonym deleted the vite-process-readme branch February 23, 2025 23:15
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

1 participant