Sveltekit Document

screenshot of Sveltekit Document
svelte
vite

The missing document manager for SvelteKit

Overview

The missing document manager for SvelteKit is a tiny utility that allows users to change the <html>, <head>, and <body> tags from any page or layout in SvelteKit. It comes with full SSR support, making it a convenient tool for developers working with SvelteKit.

Features

  • Expands <svelte:body> to work with attributes: This feature allows the <svelte:body> tag to work with attributes, not just event listeners. It is accessible in SSR via %ska.body.attributes% in app.html, addressing a long-standing feature request.
  • Adds <ska:html> (ska = SvelteKit Addons): This utility adds the <ska:html> tag, which forwards attributes and event listeners to the <html> element. It is accessible in SSR via %ska.html.attributes% in app.html.
  • Supports SSR placeholders: The utility provides SSR placeholders that can be added to src/app.html manually or by using the provided app.html template.

Summary

The missing document manager for SvelteKit is a useful utility for SvelteKit developers who need to modify the <html>, <head>, and <body> tags. With features like attribute support for <svelte:body>, the addition of <ska:html>, and SSR placeholders, this utility simplifies the management of document structure in SvelteKit projects. Its easy installation process makes it accessible to developers looking to enhance their SvelteKit applications.

svelte
Svelte

Svelte is a modern front-end framework that compiles your code at build time, resulting in smaller and faster applications. It uses a reactive approach to update the DOM, allowing for high performance and a smoother user experience.

vite
Vite

Vite is a build tool that aims to provide a faster and leaner development experience for modern web projects

eslint
Eslint

ESLint is a linter for JavaScript that analyzes code to detect and report on potential problems and errors, as well as enforce consistent code style and best practices, helping developers to write cleaner, more maintainable code.

typescript
Typescript

TypeScript is a superset of JavaScript, providing optional static typing, classes, interfaces, and other features that help developers write more maintainable and scalable code. TypeScript's static typing system can catch errors at compile-time, making it easier to build and maintain large applications.