React Component Library

Note: This is a customized fork from react-component-library by Harvey Delaney

This project skeleton was created to help people get started with creating their own React component library using:

• Rollup
• Sass
• TypeScript
• Storybook to help you create and show off your components
• Jest and React Testing Library enabling testing of the components

Development

Testing

npm run test

Building

npm run build

Storybook

To run a live-reload Storybook server on your local machine:

npm run storybook

To export your Storybook as static files:

npm run storybook:build

Generating New Components
I’ve included a handy NodeJS util file under util called create-component.js. Instead of copy pasting components to create a new component, you can instead run this command to generate all the files you need to start building out a new component. To use it:

npm run generate YourComponentName

This will generate:

/src
  /YourComponentName
    YourComponentName.tsx
    YourComponentName.stories.tsx
    YourComponentName.test.tsx
    YourComponentName.types.ts
    YourComponentName.scss

The default templates for each file can be modified under util/templates.

You can type the component name in lowercase mode the command will Capitilized your component on generation time.

Don’t forget to add the component to your index.ts exports if you want the library to export the component!