Eslint Config

@spellix/eslint-config is a collection of ESLint configuration presets. This package provides a set of base configurations for different environments and frameworks, ensuring a consistent and standardized coding style across various parts of our projects.

The following configs are available, and are designed to be used together.

• Client
• Node
• Prettier
• TypeScript

Installation

You can install the @spellix/eslint-config package using your preferred package manager.

Using npm:

npm install @spellix/eslint-config --save-dev

Using yarn:

yarn add @spellix/eslint-config --dev

Using pnpm:

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

Base Configs

Client

The client configuration is intended for browser-based JavaScript code.

Usage:

module.exports = {
  extends: [
    require.resolve('@spellix/eslint-config/client'),
  ],
};

Node

The node configuration is tailored for server-side JavaScript code.

Usage:

module.exports = {
  extends: [
    require.resolve('@spellix/eslint-config/node'),
  ],
};

Prettier

The Prettier configuration integrates ESLint with Prettier.

Note: Prettier is a peer-dependency of this package, and should be installed at the root of your project.

See: https://prettier.io/docs/en/install.html

npm install prettier --save-dev
# or
yarn add prettier --dev
# or
pnpm add prettier --save-dev

Usage:

module.exports = {
  extends: [
    require.resolve('@spellix/eslint-config/prettier'),
  ],
};

React

This configuration is specifically designed for React applications.

Usage:

module.exports = {
  extends: [
    require.resolve('@spellix/eslint-config/react'),
  ],
};

TypeScript

The TypeScript configuration is suitable for projects using TypeScript. Some rules enabled in this configuration require additional type information. Provide the path to your tsconfig.json as necessary.

Note: TypeScript is a peer-dependency of this package, and should be installed at the root of your project.

npm install typescript --save-dev
# or
yarn add typescript --dev
# or
pnpm add typescript --save-dev

Usage:

module.exports = {
  extends: [
    require.resolve('@spellix/eslint-config/typescript'),
  ],
  parserOptions: {
    project: './tsconfig.json',
  },
};

Using Configurations Together

You can combine multiple configurations to suit your project needs. For example, a React project using TypeScript might include:

module.exports = {
  extends: [
    require.resolve('@spellix/eslint-config/client'),
    require.resolve('@spellix/eslint-config/react'),
    require.resolve('@spellix/eslint-config/typescript'),
    // Optionally include Prettier last
    require.resolve('@spellix/eslint-config/prettier'),
  ],
  parserOptions: {
    project: './tsconfig.json',
  },
};

Note: Ensure that you install all required dependencies for the configurations you choose to combine.