@cl3tus/config

Shared configuration files for ESLint, Prettier, TypeScript, and Commitlint for Node.js, Next.js, and React projects.

Installation

npm install --save-dev @cl3tus/config

Peer Dependencies

This package requires the following peer dependencies:

npm install --save-dev eslint prettier typescript @commitlint/cli @trivago/prettier-plugin-sort-imports prettier-plugin-tailwindcss prettier-plugin-classnames

Usage

ESLint

Two configurations are available depending on your project type.

For Node.js / Vite projects

Create an eslint.config.js file in your project root:

import eslintConfig from "@cl3tus/config/eslint/node";

export default eslintConfig;

Features:

• TypeScript support with typescript-eslint
• Unused imports detection and removal
• Consistent type imports
• Smart unused variables detection with _ prefix ignore pattern

For Next.js projects

Create an eslint.config.js file in your project root:

import eslintConfig from "@cl3tus/config/eslint/nextjs";

export default eslintConfig;

Features:

• All Node.js features above
• Next.js core-web-vitals and TypeScript configs
• React-specific rules

Extending the config

You can extend either config with your own rules:

import eslintConfig from "@cl3tus/config/eslint/node"; // or /nextjs

export default [
  ...eslintConfig,
  {
    rules: {
      // Your custom rules
    },
  },
];

Prettier

Create a prettier.config.mjs file in your project root:

export { default } from '@cl3tus/config/prettier';

Or extend the config:

import baseConfig from '@cl3tus/config/prettier';

export default {
  ...baseConfig,
  // Your custom options
};

Features:

• Tailwind CSS class sorting
• Import statement sorting (React/Next first, then third-party, then local)
• Classnames plugin support
• 2-space indentation, 100 character line width

TypeScript

Extend the configuration in your tsconfig.json:

{
  "extends": "@cl3tus/config/tsconfig",
  "compilerOptions": {
    // Your custom options
  }
}

Features:

• Optimized for Next.js projects
• Path aliases support (@/*)
• Strict mode enabled
• Modern ES2017 target

Commitlint

Create a commitlint.config.js file in your project root:

module.exports = {
  extends: ["@cl3tus/config/commitlint"],
};

Features:

• Conventional commits format
• Extended body max line length (400 characters)

Complete Setup Examples

For a Node.js / Vite project

# Install the config package and peer dependencies
npm install --save-dev @cl3tus/config eslint prettier typescript @commitlint/cli @trivago/prettier-plugin-sort-imports prettier-plugin-tailwindcss prettier-plugin-classnames husky

# Initialize husky (optional, for git hooks)
npx husky init

eslint.config.js:

import eslintConfig from "@cl3tus/config/eslint/node";

export default eslintConfig;

prettier.config.mjs:

export { default } from '@cl3tus/config/prettier';

tsconfig.json:

{
  "extends": "@cl3tus/config/tsconfig"
}

commitlint.config.js:

module.exports = {
  extends: ["@cl3tus/config/commitlint"],
};

For a Next.js project

# Install the config package and peer dependencies
npm install --save-dev @cl3tus/config eslint prettier typescript @commitlint/cli @trivago/prettier-plugin-sort-imports prettier-plugin-tailwindcss prettier-plugin-classnames husky

# Initialize husky (optional, for git hooks)
npx husky init

eslint.config.js:

import eslintConfig from "@cl3tus/config/eslint/nextjs";

export default eslintConfig;

prettier.config.mjs:

export { default } from '@cl3tus/config/prettier';

tsconfig.json:

{
  "extends": "@cl3tus/config/tsconfig"
}

commitlint.config.js:

module.exports = {
  extends: ["@cl3tus/config/commitlint"],
};

package.json scripts:

{
  "scripts": {
    "lint": "eslint .",
    "lint:fix": "eslint . --fix",
    "format": "prettier --write .",
    "format:check": "prettier --check ."
  }
}

What's Included

ESLint Plugins & Configs

Node.js config:

• @eslint/js (recommended rules)
• typescript-eslint (TypeScript support)
• eslint-plugin-unused-imports

Next.js config:

• All Node.js plugins above
• eslint-config-next (core-web-vitals + TypeScript)
• @eslint/eslintrc (for compatibility)

Prettier Plugins

• @trivago/prettier-plugin-sort-imports
• prettier-plugin-tailwindcss
• prettier-plugin-classnames

Commitlint Config

• @commitlint/config-conventional

Development & Deployment

Manual Release (Local)

To manually release a new version:

# Patch version (1.0.0 -> 1.0.1) - for bug fixes
npm run release:patch

# Minor version (1.0.0 -> 1.1.0) - for new features
npm run release:minor

# Major version (1.0.0 -> 2.0.0) - for breaking changes
npm run release:major

Automatic Release (GitLab CI/CD)

The package is automatically deployed to npm via GitLab CI/CD.

Setup

1. Create an npm access token:

   • Go to https://www.npmjs.com/settings/YOUR_USERNAME/tokens
   • Create a new "Automation" token

2. Add secrets to GitLab:

   • Go to Settings > CI/CD > Variables in your GitLab project
   • Add NPM_TOKEN with your npm token
   • Add CI_PUSH_TOKEN with a GitLab Personal Access Token (write permissions)

3. Push to main branch:

   git push origin main

4. Trigger release:

   • Go to CI/CD > Pipelines in GitLab
   • Click the "play" button on the release job
   • The version will be automatically bumped based on your commit message:
     • BREAKING CHANGE: or major: → major version
     • feat: or feature: → minor version
     • Other commits → patch version

Commit Message Convention

Use conventional commits to automatically determine version bump:

# Patch (1.0.0 -> 1.0.1)
git commit -m "fix: correct typo in README"

# Minor (1.0.0 -> 1.1.0)
git commit -m "feat: add new eslint rule"

# Major (1.0.0 -> 2.0.0)
git commit -m "feat: redesign config structure

BREAKING CHANGE: config imports have changed"

License

MIT