Welcome to brfd-svui

Relative paths

Since svelte-ui is a npm-published library, all import paths are relative instead of absolute. That is so that, when compiled, the paths will still make sense in the importing package.

There might be a way to compile relative paths into absolute ones, but at the moment documentation around this is scarce.

Running svelte-ui

If this is the first time doing this, run:

yarn
yarn build

This will create a dist folder which we will use to deploy

CSS

In your svelte-kit project, import in your main layout the following:

import 'brfd-svui/dist/css/svui-tailwind.css'
import 'brfd-svui/dist/css/theme.css'
import 'brfd-svui/dist/css/smui.css'

Developing locally

To import svelte-ui in another project and watch for changes, do the following:

In the svelte-ui folder:

yarn link

In the folder where you want to use svelte-ui, make sure brfd-svui is listed as a dependency inside package.json, and then run:

yarn link brfd-svui

Now your local version of svelte-ui (the one you built in the dist folder) will be used instead of the npm-installed one. To watch for changes, inside the svelte-ui folder run:

yarn watch

Exporting components

Make sure all of your code is exported in index.ts, otherwise apps implementing svelte-ui will not be able to see it. No consts/types should be exported from .svelte files. All non-svelte components should be exported from .ts files.

Publishing svelte-ui

Make sure you are logged in locally to npm Increment the version in package.json, then run

yarn publish