[SveletKit UI Kit] Attractions UI Kit integrate SveletKit

Attractions

Attractions is a pretty cool UI kit for Svelte.

SvelteKit is a framework for building web applications of all sizes, with a beautiful development experience and flexible filesystem-based routing.

Prerequisites

Initialize SvelteKit app

1
2
3
4
5
$ npm init [email protected] cloudolife-sveltekit-attractions-demo

$ cd cloudolife-sveltekit-attractions-demo

$ npm install

Install Attractions and dependencies

Add Attractions and its peer dependencies to your devDependencies:

1
$ npm install --save-dev attractions svelte-preprocess sass postcss

Use Attractions components

Import the desired components as named imports and use wherever you like!

1
2
3
4
5
<script>
import { Button } from 'attractions';
</script>

<Button>click me</Button>

Run

1
$ npm run dev -- --open

It will open brower and visit http://localhost:3000.

References

[1] Installation – Attractions - https://illright.github.io/attractions/docs/installation

[2] Attractions - https://illright.github.io/attractions/

[3] illright/attractions: A pretty cool UI kit for Svelte - https://github.com/illright/attractions

[4] SvelteKit • The fastest way to build Svelte apps - https://kit.svelte.dev/

[5] Getting started | Docs • SvelteKit - https://kit.svelte.dev/docs#introduction-getting-started

[6] Svelte • Cybernetically enhanced web apps - https://svelte.dev/