Puppy Components 🐶

• sample boilerplate for using React with Rollup

Component Playground

Usage

1. Install (yarn or npm)

   Yarn:

   $ yarn add puppy-components

   NPM:

   $ npm install puppy-components

2. Import the component(s) you want to use. Visit the playground for usage examples and component docs.

Developing

To start the developing run :

> npm run dev

Testing

Testing is done with Jest, Enzyme and Jasmine Matchers

> npm run test

or (for getting coverage)

> npm run test:coverage

Linting

Linting is set up through ESLint and configured with eslint-config-airbnb You can modify linting rules by overriding them in the .eslintrc.json file.

> npm run lint

or (for for automatic fixing if possible)

> npm run lint:fix

Publishing

> npm run release

Deploy the Styleguide to GitHub Pages

Make sure the repository url in package.json file is set to your repoitory url, then:

> npm run deploy

Scripts

• npm run dev : Executes the develop mode, running watcher and the Stylguide, rebuilding your library on every change.
• npm run start : Only serves the Styleguide.
• npm run build : Builds your library (build can be faound in dist folder).
• npm run styleguide:build : Builds the static Styleguide in case you want to deploy it.
• npm run test : Runs the tests.
• npm run test:coverage: Runs the test and shows the coverage.
• npm run lint : Runs the linter.
• npm run lint:fix : Runs the linter and fixes automatic fixable issues.
• npm run release : Publishes your Library on NPM or your private Registry (depending on your config in your .npmrc file).
• npm run deploy: Deploys the Styleguide to GitHub Pages.

Resources

Bundler

• Rollup.js

Styleguide

• React Styleguidist

Testing

• Jasmine Matchers
• Enzyme
• Jest

Linting

• ESLint

Compiler

• Babel 7