This project uses Create React App with TypeScript to develop and test a collection of reusable React components before publishing to npm.
- npm account (paid or public repository)
- React knowledge
- Create React App experience
- TypeScript knowledge (optional)
- Fork the repository
- Pull the repository
- Run
npm install
in the project directory - Create a folder in
/src/components
for your new component - Make an index file in
/src/components/yourComponentName
with the component exported - Add the export to
/index.ts
- Test and develop your component by adding it to
/src/App.tsx
- Consider using Emotion or similar to keep CSS with the component.
- Change the name and homepage in
package.json
to reflect your library
This project uses Create React App to test the components, so you can use React Testing Library to write tests.
npm run prepare
- Check the contents of
lib
folder as this is what will get published after runningnpm run publish
. The type definitions will also be added to the/lib
folder. - Change the version in
package.json
- Push the code
npm run publish
This script is set up to publish the components in the /lib
folder to npm with the --access public
flag, making the package publicly available.
The built package, which includes both CommonJS and ECMAScript modules, as well as CSS files, will be located in the lib
folder.
Contributions are welcome! If you would like to contribute to this project, please follow these steps:
- Fork the repository
- Create a new branch for your contribution
- Make your changes
- Submit a pull request
We appreciate any contribution that helps improve the project, whether it's fixing bugs, adding new features, or improving documentation. Before submitting your contribution, please make sure to thoroughly test your changes in the development environment to ensure stability and compatibility.
When submitting a pull request, please include a clear and concise description of the changes you have made and why they are needed. Please also make sure that your code follows the existing coding standards and conventions used in the project.
We look forward to reviewing your contributions!
This project is licensed under the MIT license. The license file can be found at the root of the repository: LICENSE
Please make sure to thoroughly test the components in the development environment before publishing to ensure stability and compatibility.
We hope you have good times and fun building React components with this library!