An open API service indexing awesome lists of open source software.

https://github.com/luanroger/ts-package-template

Modern tools to build an NPM package with TypeScript support
https://github.com/luanroger/ts-package-template

biomejs boilerplate changelog pacakge rolldown template typescript

Last synced: 3 days ago
JSON representation

Modern tools to build an NPM package with TypeScript support

Awesome Lists containing this project

README

          



Rolldown logo


TypeScript logo

# ts-package-template

[![GitHub License](https://img.shields.io/github/license/LuanRoger/ts-package-template)
](https://github.com/LuanRoger/ts-package-template/blob/main/LICENSE)
[![NPM Version](https://img.shields.io/npm/v/%40luanroger%2Fts-package-template)](https://www.npmjs.com/package/@luanroger/ts-package-template)

A future proof TypeScript package template, using good alternative (kind of) tools. It includes everything you need to get started quickly, including a basic project structure, build scripts, and configuration files.

> You can delete the content of this README and add your own information about your package.

## Tools

- 📘 [TypeScript](https://www.typescriptlang.org/) - A typed superset of JavaScript that compiles to plain JavaScript.
- ⬇️ [Rolldown](https://rolldown.rs) with [tsdown](https://tsdown.dev/) - A modern JavaScript bundler that focuses on simplicity and ease of use. With `tsdown`, it provides seamless TypeScript integration.
- 🌿 [Biome](https://biomejs.dev/) - An all-in-one code linter and formatter.
- ⚡ [Vitest](https://vitest.dev/) - A blazing fast unit test framework.
- 📋 [git-cliff](https://git-cliff.org/) - A changelog generator based on [conventional commits](https://www.conventionalcommits.org/en/v1.0.0/).
- 🚀 [np](https://github.com/sindresorhus/np) - A better `npm publish`.
- 📦 [pnpm](https://pnpm.io/) — Already used in this project.

## Directory Structure

```plaintext
./
├── ./.vscode/
│ └── settings.json
├── ./src/
│ └── index.ts
├── ./test/
│ └── index.test.ts
├── biome.json
├── CHANGELOG.md
├── cliff.toml
├── tsconfig.json
├── tsconfig.build.json
└── tsdown.config.ts
```

> This is just the most important files and folders. Not every file is shown in this structure.

- `./` - The root directory of the project.
- `./.vscode/` - Contains VSCode-specific settings for the project.
- `./src/` - The source code of the package. Used by the bundler to create the final output, also, in the `dev` mode, the files here will be watched for changes.
- `./test/` - The test files for the package. Used by Vitest to run unit tests.
- `biome.json` - Configuration file for Biome, the code linter and formatter. Check the [Biome documentation](https://biomejs.dev/reference/configuration) for more details.
- `CHANGELOG.md` - The changelog file generated by `git-cliff`.
- `cliff.toml` - Configuration file for `git-cliff`. Check the [git-cliff documentation](https://git-cliff.org/docs/) for more details.
- `tsconfig.json` - The main TypeScript configuration file.
- `tsconfig.build.json` - TypeScript configuration file used specifically for the build process.
- `tsdown.config.ts` - Configuration file for `tsdown`. Check the [tsdown documentation](https://tsdown.dev/options/config-file) for more details.

## NPM Scripts

Run with:

```bash
pnpm
```

or

```bash
npm run <script>
```

- `dev` - Starts the bundler in watch mode over `./src`.
- `build` - Bundles the package using Rolldown and outputs to the `./dist` folder.
- `check` - Runs Biome to lint and format the code.
- `check:write` - Runs Biome to automatically fix linting and formatting issues.
- `test` - Runs Vitest to execute the unit tests.
- `test:watch` - Runs Vitest in watch mode for continuous testing during development.
- `changelog` - Generates or updates the `CHANGELOG.md` file using `git-cliff`.
- `publish` - Publishes the package to NPM using `np`.
- `publish:all` - Builds before publishing it to NPM.

## How to use

1. Clone this repository.
Alternatively, you can use this template when creating a new repository on GitHub by selecting the "Use this template" option. This will create a new repository with the same structure and files as this template.
2. Run `pnpm install` to install the dependencies.
3. Modify the `package.json` file to set your package `name`, `version`, `description`, `author`, and other relevant information.
4. You are ready to start coding your TypeScript package!

## License

This project is licensed under the MIT License - see the [LICENSE](https://github.com/LuanRoger/ts-package-template/blob/main/LICENSE) file for details.