A slightly opinionated starter kit for developing React and/or TypeScript packages. It comes with a several pre-configured tools, so you could focus on coding instead of configuring a project for the nth time. From building to releasing a package, this starter kit has you covered.
Table of Contents
This project setup will include following features.
- ⚡ Blazing fast dev server and build
- 🚓 Test & Publish via Github Actions CI/CD workflows for your package. Run tests on every commit plus integrate with Github Releases to automate publishing package to NPM and Storybook to Github Pages.
- 🧙♂️ Developer experience improved with ESLint, Prettier and Husky
- 🤖 Conventional Commit Lint — Make sure you & your teammates follow conventional commit
Package | Description |
---|---|
Typescript | TypeScript is a typed superset of JavaScript that compiles to plain JavaScript. |
tsup | The simplest and fastest way to bundle your TypeScript libraries. Used to bundle package as ESM and CJS modules. Supports TypeScript, Code Splitting, PostCSS, and more out of the box. |
Vitest | A testing framework for JavaScript. Preconfigured to work with TypeScript and JSX. |
Storybook | Storybook is a frontend workshop for building UI components and pages in isolation. |
Husky | Git hook management |
Conventional Commit | A specification for adding human and machine readable meaning to commit messages. |
Commitlint | Lint commit messages |
Commitizen | Using a standardized set of rules to write commits, makes commits easier to read, and enforces writing descriptive commits. |
Lint Staged | Run linters against staged git files and don't let 💩 slip into your code base! |
ESLint | A tool for identifying and reporting on patterns found in ECMAScript/JavaScript code. |
Prettier | An opinionated code formatter |
- node >=18.4.0
- npm >=9.x.x
Create the project using this link Create a new repository
clone your project
git clone https://github.com/[YOUR-ACCOUNT-NAME]/[YOUR-PROJECT-NAME].git
Access the project directory.
cd [YOUR-PROJECT-NAME]
Install dependencies.
npm install
Serve with hot reload at http://localhost:6006.
npm run storybook
Command | Description |
---|---|
npm run dev |
Starts the server in dev mode |
npm run lint |
Runs ESLint on the project |
npm run lint-staged |
Runs Prettier on only staged (changed) files |
npm run type-check |
Runs TSC |
npm run build |
Runs build production bundle to 'dist' directly |
This project uses MIT license: License