TypeScript icon, indicating that this package has built-in type declarations

2.1.1 • Public • Published

React TypeScript NPM Boilerplate

This is a boilerplate project for writing React NPM modules (or component libraries) in TypeScript. The code is compiled and published to NPM via CircleCI v2 Workflows and Github Releases.

This boilderplate includes a Storybook to visualize and demonstrate your components. The Storybook is automatically deployed to Zeit once configured (see the Storybook for this template here). This allows you to test each PR visually and in isolation.



  1. Fork or clone this repository
  2. If using VS Code, install recommended extensions
  3. yarn install
  4. yarn start
  5. Create your components
  6. Export your components in index.ts
  7. Publish your module by creating a new GitHub Release (with a v.*.*.* version number). CircleCI will automatically build and deploy.

yarn Scripts

  • test - run unit tests
  • test:cover - run unit tests with test coverage
  • lint - check eslint and prettier rules
  • lint:fix - autofix unmet eslint and prettier rules
  • local-pack - create the tgz package locally to test consumers without publishing
  • start - start the storybook server and automatically open in browser
  • compile - standard typescript compile tsc
  • now-build - used by Zeit when building your storybook for deployment (do not rename this script)

Before each commit, husky and lint-staged will automatically lint your staged ts, tsx, js, jsx files.


Circle CI

You need to configure one environment variable in CircleCI, for publishing to NPM.



You need to authorize Zeit with your GitHub account to enable automatic deployments. Once configured, you can enable Zeit to deploy any repository that contains a now.json file.

Dependabot (optional)

I recommend enabling Dependabot on this repository to keep your dependencies up to date. Each dependency update will be created as a PR, which will automatically validate via Circle CI and you can manually validate via Zeit.


This code is released under the MIT license - feel free to use it.


Please contribute any improvements or fixes to this project!

To make sure you have a pleasant experience, please read the code of conduct. It outlines core values and beliefs and will make working together a happier experience.




Package Sidebar


npm i @fullstackio/newline-mdx-components

Weekly Downloads






Unpacked Size

46.8 kB

Total Files


Last publish


  • fullstackio
  • pozymasika