react-package-bootstrap

A React base project for creating npm packages with Widergy standard defaults

Quick start

• Create a new repository on widergy account using this as template

• On repository settings add yourself and your team collaborators (Remember them to accept the invite 😅)

• Clone the repo locally

git clone https://github.com/widergy/your-package.git

• Install dependencies

Yarn install

• Start developing! 🎆

Local development

With this folder structure you can, basically, find two big paths

/lib

Inside this folder you should develop all components or functions that you want the library to include on the npm published package.

We've left an example component for you to see how to do it.

/example

Inside this folder you can build an example app to test your components locally or deploy it as a demo app for other users.

We've also left an example app for you to see how it works.

To start the server and test it locally you only need to run on the root folder:

yarn start

Build

To generate a production build of your package, you only need to run:

yarn build

Suppose that you need to test your package as a dependecy of an external repository, however you aren't ready to publish this library yet.

STOP, not everything is lost! 💡

You can still link your package 🔗

In your package root folder run:

yarn link

Then in the project that you want to consume this package run this on the root folder:

yarn link "@widergy/your-package-name"

For more info about npm link, you can read this Medium post by DailyJS

Publish to npm registry

On your first publish, you only need to run this:

npm publish --access=public

If this fails, it might be because this package already exists on npm and you should upgrade the package version related to the change that you've introduced.

Each npm package needs a version so that developers know if they can safely update to a new release of your package without breaking the rest of their code. The versioning system npm uses it's called SemVer, which stands for Semantic Versioning.

Dont worry too much about understanding the more complex version names but here is npm's summary of how the basic one works:

Given a version number MAJOR.MINOR.PATCH, increment the:

1. MAJOR version when you make incompatible API changes,
2. MINOR version when you add functionality in a backwards-compatible manner, and
3. PATCH version when you make backwards-compatible bug fixes.

You should run

npm version major/minor/patch

And then run npm publish again!

Remember that npm publish will create a commit with the version upgrade, so you must push it so other mantainers keep track of the package version, and consumers can upgrade it.

License

MIT © Widergy