Package Exports

@studiobear/designspek-components

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (@studiobear/designspek-components) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

Svelte System-UI Components Library

This is a sample Svelte component library initially created from the Svelte component-template.

A few things have been added:

Storybook: For component development fun! Seriously though, makes test-driven development natural.
Jest/Testing-library: In combination with above === win!!!

Demo Site - Hosted by Netlify and deployed via Semaphore CI

My Svelte Component Library

A base for building shareable Svelte components.

.
├── .storybook
├── src
│   └── components
│       ├── __tests__
│       ├── stories
│       └── ...components
├── packag.json
└── ...

.storybook: configuration for Storybook and where addons, knobs, etc. are registered.
src/components: Main component directory
.../__tests__: Jest/Testing-library tests for components
.../stories: Storybook stories

Setting up

As this sub-repo is part of a monorepo, the initial yarn and lerna bootstrap-ing will have installed and linked all necessary dependencies.

Consuming components

Your package.json has a "svelte" field pointing to src/index.js, which allows Svelte apps to import the source code directly, if they are using a bundler plugin like rollup-plugin-svelte or svelte-loader (where resolve.mainFields in your webpack config includes "svelte"). This is recommended.

For everyone else, npm run build will bundle your component's source code into a plain JavaScript module (dist/index.mjs) and a UMD script (dist/index.js). This will happen automatically when you publish your component to npm, courtesy of the prepublishOnly hook in package.json.