How to create and publish Svelte components

5 min readOct 15, 2021

In my last articles I have mainly talked about how to integrate Svelte, Tailwind, Jest and how to use NPM. Why all this? To get to understand how to create a Svelte component and how to publish it as an NPM package. Below, as is my habit now, I report the various steps I followed and the link to a template that should simplify everything.

Create components with SvelteKit

First of all the technology: SvelteKit. It may seem like a bizarre choice but I think it’s the simplest way. The SvelteKit documentation also has a section dedicated to packaging.

In short, you can take the contents of the src/lib folder and save it as a package. It is also possible to publish it on NPM. In addition, the contents of the main folder can be exported in order to simplify the creation of documentation.

I omit the explanation of how to create a component with SvelteKit and the integration with Jest and TailwindCSS. I’ve written a couple of articles about it:

I go directly to what to change: the svelte.config.js file. I add the package entry and set the directory to export the compiled package to (by default it is the package folder)

const config = {
// ...
kit: {
target: '#svelte',
package: {
dir: 'package',
emitTypes: true
// ...

Then I download and install svelte2tsx to generate TSX files from SVELTE files.

npm i svelte2tsx

How To Interact With Google Chart

5 min read

Feb 10, 2022

Visualize Your Medium Stats With Svelte and JavaScript

7 min read

Jan 25, 2022

How to Get Medium Stats With JavaScript and Svelte

6 min read

Jan 17, 2022

How To Create Responsive Data Tables With CSS Grid

8 min read

Jan 12, 2022

How to Get Medium Stats With JavaScript and Svelte

6 min read

Jan 8, 2022

How To Document Svelte Components — Part 2

5 min read

Jan 2, 2022

The Journey of a Novice Programmer

8 min read

Dec 12, 2021

How to Create an Accordion Element With Svelte and Tailwind

4 min read

Nov 28, 2021

How to Test If a Dom Element Exists in a Svelte Component with Jest

2 min read

Nov 17, 2021

How to Document Svelte Components

5 min read

Nov 15, 2021


I'm a hobby programmer, experimenting with Svelte, Javascript, Construct 3 and magic tools