https://github.com/duongductrong/react-package-starter
A starter template for creating React packages.
https://github.com/duongductrong/react-package-starter
npm-package react react-package react-package-starter react-ts react-typescript-package
Last synced: 2 months ago
JSON representation
A starter template for creating React packages.
- Host: GitHub
- URL: https://github.com/duongductrong/react-package-starter
- Owner: duongductrong
- License: mit
- Created: 2025-01-23T16:15:00.000Z (over 1 year ago)
- Default Branch: master
- Last Pushed: 2025-01-24T03:53:50.000Z (over 1 year ago)
- Last Synced: 2025-01-24T04:17:59.851Z (over 1 year ago)
- Topics: npm-package, react, react-package, react-package-starter, react-ts, react-typescript-package
- Language: JavaScript
- Homepage:
- Size: 271 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- Funding: .github/FUNDING.yml
- License: LICENSE
Awesome Lists containing this project
README
# ๐ฆ React Package Starter
Starter kit for developing TypeScript or React NPM packages
## ๐ Getting started
```bash
npx degit https://github.com/duongductrong/react-package-starter custom-package
cd custom-package && git init
pnpm install && pnpm dev
```
## ๐ What's included?
- **โก๏ธ tsup**: The quickest and easiest way to bundle your TypeScript libraries. It seamlessly bundles packages into both ESM and CJS modules, with built-in support for TypeScript, code splitting, PostCSS, and more.
- **๐งช Vitest**: A modern testing framework for JavaScript, preconfigured to work effortlessly with TypeScript and JSX.
- **๐ค Dependabot**: A GitHub-powered tool that integrates into your workflow to automatically check for dependency updates and create pull requests to keep your project up-to-date.
- **๐โโ๏ธ TSX**: A zero-config tool that allows you to execute TypeScript files directly in a Node.js environment.
- **๐ผ Release-it**: A command-line utility that automates the creation of GitHub Releases, populating them with changes (commits) made since the last release.
- **๐ฆ๏ธ Pnpm**: A fast, disk space-efficient package manager that helps you install, share, and manage dependencies across projects.
- **๐ Commitizen**: A tool that helps you write conventional commit messages following the Conventional Commits specification.
## ๐ Usage
### ๐จ Development
Watch and rebuild code with `tsup`
```bash
pnpm dev
```
Run all tests and watch for changes
```bash
pnpm test
```
### ๐ฆ๏ธ Build
Build package with tsup for production.
```bash
pnpm build
```
## ๐ฉ Committing
When you are ready to commit simply run the following command to get a well formatted commit message. All staged files will automatically be linted and fixed as well.
```bash
pnpm commit
```
## ๐ Releasing, tagging & publishing to NPM
Create a semantic version tag and publish to Github Releases. When a new release is detected a Github Action will automatically build the package and publish it to NPM. Additionally, a Storybook will be published to Github pages.
Learn more about how to use the release-it command here.
```bash
pnpm release
```
When you are ready to publish to NPM simply run the following command:
```bash
pnpm publish
```
## ๐ค Dependabot
Dependabot is a tool that automates dependency updates. It checks for updates to your dependencies and opens pull requests to update them. Dependabot is enabled by default in this project. You can configure it by editing the `.github/dependabot.yml` file.
Read more about Dependabot [here](https://docs.github.com/en/code-security/dependabot/working-with-dependabot/dependabot-options-reference).