@fullhaus/eslint-config v0.1.1

FULLHAUS ESLint configuration

This repository contains the ESLint configuration used for projects maintained by FULLHAUS. It provides a comprehensive set of ESLint rules configurations for both modern flat setups (ESLint v9+) and legacy projects (ESLint v8).

Installation

You can install the FULLHAUS ESLint configuration using a package manager of your choice:

pnpm add @fullhaus/eslint-config --save-dev

Usage

Flat config

For projects using the flat configuration, you can use following setup:

import fhEslint from '@fullhaus/eslint-config';

export default [
  ...fhEslint.configs.default,
];

Legacy config

If you're using a legacy configuration of ESLint (v8), extend the config as shown below. You must also provide a value for the parserOptions.project property. Usually this is the path to yourtsconfig.json.

{
  "extends": [
    "@fullhaus/eslint-config/legacy"
  ],
  "parserOptions": {
    "project": "./tsconfig.json"
  }
}

Custom Configurations

In case your project requires specific configurations (for example, a JavaScript-only codebase or just stylistic rules), you can selectively extend the configurations you need.

Flat config:

import fhEslint from '@fullhaus/eslint-config';

export default [
  ...fhEslint.configs.baseConfig, // js only
  ...fhEslint.configs.stylisticConfig, // stylistic only
];

Legacy config

{
  "extends": [
    "@fullhaus/eslint-config/legacy/configs/base",
    "@fullhaus/eslint-config/legacy/configs/stylistic"
  ]
}

React

For React projects, you can extend your ESLint configuration with React-specific rules.

Flat config:

import fhEslint from '@fullhaus/eslint-config';

export default [
  ...fhEslint.configs.default,
  ...fhEslint.configs.reactConfig,
  // or when using React with TypeScript (.tsx):
  ...fhEslint.configs.typedReactConfig,
];

Legacy config:

{
  "extends": [
    "@fullhaus/eslint-config/legacy",
    "@fullhaus/eslint-config/legacy/configs/react",
    // or when using React with TypeScript (.tsx):
    "@fullhaus/eslint-config/legacy/configs/typed-react"
  ]
}

Frameworks

Frameworks (like Next.js) come with their own ESLint configuration, which can lead to plugin conflicts. To prevent these issues, our configuration provides all necessary rules. Here’s an example setup for a Next.js project:

// example using next.js
import fhEslint from '@fullhaus/eslint-config';

export default [
  ...compat.extends('next/core-web-vitals'),
  ...fhEslint.configs.default,
  {
    rules: fhEslint.rules.typedReactRules,
  },
];

!NOTE Adjust the usage of compat.extends as required by your project’s setup.

Available Configurations and Rules

The FULLHAUS ESLint Configuration package provides a modular set of configurations and rules designed to accommodate different project needs. Below is a list of the available options:

Configurations

Rules

• baseRules: Rules for JavaScript
• commentsRules: Rules for ESLint comments
• reactRules: Rules for React
• stylisticRules: Rules for code styling
• typedReactRules: Rules for React using TypeScript
• typescriptRules: Rules for TypeScript

Feel free to mix and match these configurations and rules to best suit your project’s requirements.

License

This project is licensed under the MIT License. See the LICENSE file for details.