Personal Config

ESLint, Jest, TSconfig and Prettier rules for all of my personal projects. Feel free to use these conventions :-)

How it works

This repository contains set of ESLint, Jest, Typescript & Prettier configurations to be used in JavaScript and Typescript projects.

ESLint

For ESLint there are two set configurations to be used to:

• the base configuration, which defines the common ESLint rules, the ECMAScript version and the module system.
• the enhancers, which contain specific settings for different frameworks, like React or Vue.

By using one or more of these packages, you can enforce the desired code styles for each type of project.

For more information on how to use each package and their specific configurations, please read the package's README by following the links below. You may also check the examples listed in Typical Configs to see how the packages may be combined for the most common scenarios.

For more information on how to use each package and their specific configurations, please read the package's README by following the links below. You may also check the examples listed in Typical Configs to see how the packages may be combined for the most common scenarios.

Base config

The base config is published as @isfawwaz/eslint-config-base, check out its README to know how to use it.

Enhancer configs

There are several enhancer packages, which are intended to be used in conjunction with the base configuration:

• @isfawwaz/eslint-config-babel - If you are going to use Babel to transpile source code.
• @isfawwaz/eslint-config-jest - If you are going to use Jest to develop tests.

Jest

For Jest there are same with ESLint which have two set configurations to be used to, but unfortunely on current version only base configuration available.

Base config

The base config is published as @isfawwaz/jest-config-base, check out its README to know how to use it.

Typescript Config

For Typescript config there are two set configuration to be used to:

• `@isfawwaz/tsconfig/react-library.json - If you want to detect accessibility issues on your library project which based on React.
• `@isfawwaz/tsconfig/nextjs.json - If you want to detect accessibility issues in web projects based on NextJS.

Prettier

For Prettier config file, that only one config that can be used. check it out README.md to know how to use it.

Typical configs

{
  "root": true,
  "env": {
    "browser": true
  },
  "extends": [
    "@isfawwaz/eslint-config-base/esm",
    "@isfawwaz/eslint-config-babel",
    "@isfawwaz/eslint-config-jest"
  ]
}

{
  "root": true,
  "env": {
    "node": true
  },
  "extends": ["@isfawwaz/eslint-config-base/cjs/es2019", "@isfawwaz/eslint-config-jest"]
}

// .prettierrc.js

module.exports = {
  ...require('@isfawwaz/prettier-config'),
  singleQuote: false,
};

{
  "extends": "@isfawwaz/tsconfig/react-library.json",
  "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx"],
  "exclude": ["node_modules"]
}

Special Thanks

Thanks to @moxy/eslint-config for such amazing inspiration for me to create my version of config.

License

MIT License