sudhirkunnure v0.1.0

Create React Lib

Create React component libraries with no build configuration.

tl;dr

npm install -g create-react-lib

create-react-lib my-lib
cd my-lib
npm build

Then publish to npm using npm run publish and use in any react application with support for modules.

Getting Started

Installation

Install it once globally:

npm install -g create-react-lib

Creating an App

create-react-lib my-lib
cd my-lib

It will create a directory called my-lib inside the current folder. Inside that directory, it will generate the initial project structure and install the transitive dependancies:

my-lib/
  README.md
  node_modules/
  package.json
  .gitignore
  lib/
  src/
    Component.jsx
    __test__/
      Component.test.jsx

No configuration or complicated folder structures, just the files you need to build your components. One the installation is done, you can run some commands inside the project folder:

npm test

Runs the testing framework, looking for tests in test folders maked with -test.js or .test.js or .spec.js

Read more about testing.

npm run build

Builds the library for production to the lib folder. It does not bundle, minify, or optimize the files, allowing the client to process the library per their needs.

npm run publish

Interactively verifys your package information, and then publishes the library to npm for client consumption.

Philosophy

• One Dependency: There is just one build dependency. It uses Babel, ESLint, and other amazing projects, but provides a cohesive curated experience on top of them.

• Simple builds: Your library isn't bundle or post processed, allowing your end users to process the library per their needs, and avoiding unecessary complexity.

• No Lock-In: You can "eject" at any time. Run a single command, and all the configuration and build dependancies will be moved directly into your project, so you can pick up right where you left off.

Why use this?

If you're getting started with React, use create-react-lib to automate the build of your component library. There is no configuration file, and react-lib-scripts is the only extra build dependancy in your package.json. Your environment will have everything you need to build a modern React component library:

• React, JSX, and ES6 support.
• Language extras beyond ES6 like the object spread operator.
• A linter that lints common errors.
• A build script to compile your projects files into plain javascript.
• A publish script to get your library onto npm.

You don't have to use this. There are many ways to create a React component library, some of which involve elaborate bundling configurations and post processing. This is a clean and simple solution that's fully compatible with apps built using the react-create-app tool that can be evolved to suit the needs of your users.