Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/zapal-tech/dx
Zapal development experience. Set of code quality tools configurations, rule sets, and utilities.
https://github.com/zapal-tech/dx
Last synced: about 2 months ago
JSON representation
Zapal development experience. Set of code quality tools configurations, rule sets, and utilities.
- Host: GitHub
- URL: https://github.com/zapal-tech/dx
- Owner: zapal-tech
- License: mit
- Created: 2024-09-15T16:31:07.000Z (4 months ago)
- Default Branch: main
- Last Pushed: 2024-10-05T12:06:49.000Z (3 months ago)
- Last Synced: 2024-10-29T10:40:36.685Z (2 months ago)
- Language: TypeScript
- Size: 215 KB
- Stars: 0
- Watchers: 0
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE.md
Awesome Lists containing this project
README
# @zapal/dx
Zapal DX (Developer Experience) - opinionated and simple set of code quality tools' configurations, rule sets and utilities, to
make your life easier.
Used by Zapal internally, but open-sourced for everyone to use.
## Getting started
Tools for which configurations are provided:
- Prettier (`>=3 <4`)
- ESLint (`>=9 <10`)
- TypeScript (`>=4.8.0 <6`)
- Commitlint (`>=19 <20`)
_P.S.: The configurations by default may not suit your needs. You can extend them or override them with your own configurations_.
**IMPORTANT**: This package is not contains a tools itself as dependencies, only a set of configurations.
## Installation
```bash
# pnpm
pnpm add -D @zapal/dx
# npm
npm i -D @zapal/dx
# yarn
yarn add -D @zapal/dx
```
## Usage
All the configurations are available as named exports and default export (the base configurations) from the package
subdirectories.
**Separate directory for each tool's configurations:**
- **Prettier:** `@zapal/dx/prettier`
- **ESLint:** `@zapal/dx/eslint`
- **TypeScript:** `@zapal/dx/typescript`
- **Commitlint:** `@zapal/dx/commitlint`
**IMPORTANT**: There is no exports from the root of the package, only from the subdirectories.
### Prettier
Prettier configurations use `prettier-plugin-packagejson` and `@ianvs/prettier-plugin-sort-imports` plugins by default.
- `prettier-plugin-packagejson` is used to format `package.json` files and does not require any additional configuration.
- `@ianvs/prettier-plugin-sort-imports` is used to sort imports in TS/JS/React/Vue/Svelte files. It may require an additional
configuration to provide the best development experience. Check the
[plugin's documentation](https://www.npmjs.com/package/@ianvs/prettier-plugin-sort-imports) for more information.
The default configuration for `@ianvs/prettier-plugin-sort-imports` is:
```json
{
"importOrderTypeScriptVersion": "5.0.0",
"importOrder": [
"",
"^(@zapal)(/.*)$",
"",
"",
"^[.]",
"",
"^(?!.*[.]css$)[./].*$",
".css$"
]
}
```
Using the default configuration:
```json5
// package.json
{
"prettier": "@zapal/dx/prettier"
}
```
```js
// .prettierrc.js or .prettierrc.mjs
export { default } from '@zapal/dx/prettier'
```
```js
// .prettierrc.js or .prettierrc.mjs
export { sveltePrettierConfig as default } from '@zapal/dx/prettier'
```
Using the configuration with some custom options:
```js
// .prettierrc.js or .prettierrc.mjs
import { defaultPrettierConfig } from '@zapal/dx/prettier'
export default {
...defaultPrettierConfig,
semi: false,
}
```
### ESLint
Principle is the same as for Prettier.
```json5
// package.json
{
"eslintConfig": "@zapal/dx/eslint"
}
```
```js
// eslint.config.js or eslint.config.mjs
export { default } from '@zapal/dx/eslint'
```
### TypeScript
Available exports:
- `@zapal/dx/typescript` - default configuration
- `@zapal/dx/typescript/next` - configuration for Next.js, extending the default configuration
- `@zapal/dx/typescript/svelte` - configuration for Svelte-based projects, extending the default configuration
Using the default configuration:
```json5
// tsconfig.json
{
"extends": "@zapal/dx/typescript"
}
```
Using the configuration for Next.js, for example:
```json5
// tsconfig.json
{
"extends": "@zapal/dx/typescript/next"
}
```
### Commitlint
**IMPORTANT**: Unfortunately, the `commitlint` requires you to install extended dependencies directly in your project. Use
`devDependencies` for that.
Here is the list of the required `devDependencies` for the configurations:
- Default - `@commitlint/config-conventional`
- PNPM Workspace scopes - `@commitlint/config-conventional` and `@commitlint/config-pnpm-scopes`
Using the default configuration:
```json5
// .commitlintrc.json
{
"extends": ["@zapal/dx/commitlint"]
}
```
```js
// commitlint.config.js or commitlint.config.mjs
export { default } from '@zapal/dx/commitlint'
```
Using the configuration with configuration for PNPM Workspace based scopes:
```js
// commitlint.config.js or commitlint.config.mjs
export { pnpmWorkspaceScopesCommitlintConfig as default } from '@zapal/dx/commitlint'
```