This project was bootstrapped with Create React App.
To start using the example npm module
component-template, check out the documentation.
Developing with Component Template
Looking to build your own components? Fork this repo and proceed with the following documentation.
To begin, install dependencies with
To run a local server with
A new browser window should open up with the following url: http://localhost:3000
Execute the following command to run tests. Read more about that here.
npm run test
To also see test coverage when running tests, execute the following command:
npm test -- --coverage
Adding your own components
Currently the example component shipped in this project is
HelloWorld. To add your own components, replace HelloWorld with your own named component and tests.
- Component source code should live in
- Be sure to export your components here
- When published to npm, the
mainscript in package.json will be available at
lib/index.jsthanks to the
- Changelogs are important for communicating to users what features, fixes and breaking changes have been shipped. This project uses the angular commit convention as standard for creating readable and machine parseable commit messages.
Included in this project are a few scripts to help document, release and publish a react component. Before proceeding, make sure the
package.json are updated to properly define your own component.
Once your components are added and tested, use the following steps to release to npm.
Create Release branch
First, run the
create-release-branch script locally, which takes 1 argument, the release version. The release version can be a specific semantic version or it accepts
major to automatically increment the current release version and update the changelog. After the script is run, a branch will be pushed to the repo.
# RELEASE_VERSION: "1.0.0", patch, minor, major RELEASE_VERSION=0.2.0 npm run create-release-branch -- $RELEASE_VERSION
With the branch pushed to github, you can now manually create the pr.
First, update the npm task
gh-pages, to set the proper
REACT_APP_GH_PAGES_PATH for your project. Ex:
https://reactstrap.github.io/component-template project would be
component-template. No need for the trailing or leading slash.
Follow the next sections to publish locally or via Travis CI.
REACT_APP_GH_PAGES_PATH path updated, run the
deploy-docs script to compile the production version of your docs and push those changes to the
gh-pages branch of your repo.
npm run deploy-docs
via Travis CI
First, be sure to signup for npm if you haven't or run
npm login with your existing credentials.
Next, run the
publish-release task which will pull the latest changes, compile the components, tag the current commit as the
packge.json. push the tags to github and finally will run
npm publish. Check the publish-release script for more info.
npm run publish-release
Feel free to create an issue or PR.