[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

• Node.js - https://nodejs.org/en/

  Node.js® is a JavaScript runtime built on Chrome’s V8 JavaScript engine.

  Install Node.js - https://nodejs.org/en/ CLI.

  # Mac OS X
  $ brew install node

  See Node.js - https://nodejs.org/en/ to learn more about others OS.

Initialize SvelteKit app

$ npm init svelte@next cloudolife-sveltekit-attractions-demo

$ cd cloudolife-sveltekit-attractions-demo

$ npm install

Install Attractions and dependencies

Add Attractions and its peer dependencies to your devDependencies:

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

Use Attractions components

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

<script>
  import { Button } from 'attractions';
</script>

<Button>click me</Button>

Run

$ 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/