ESLint configuration

ESLint requires configuration via a .eslintrc.* (for example .eslintrc.yml) configuration file as detailed in ESLint's documentation.

If you don't specify your custom configuration file we use our default below. We suggest to add your own configuration file into your repository root directory to be able to specify your coding and quality standards.

.eslintrc.yml

env:
  browser: true
  es6: true
  mocha: true
  node: true
parser: "@babel/eslint-parser"
extends:
  - "eslint:recommended"
  - "plugin:react/recommended"
parserOptions:
  ecmaVersion: 2020
  sourceType: "module"
  ecmaFeatures:
    classes: true
    jsx: true
rules:
  brace-style:
    - warn
    - 1tbs
  camelcase: warn
  comma-dangle:
    - warn
    - always-multiline
  comma-style:
    - error
    - last
  complexity:
    - error
    - 10
  curly: warn
  eol-last:
    - error
    - always
  id-length: error
  max-lines: error
  max-params:
    - error
    - 4
  no-duplicate-imports: error
  no-eq-null: error
  eqeqeq:
    - error
    - smart
  no-eval: error
  no-implied-eval: error
  no-invalid-this: error
  no-shadow: error
  no-undefined: error
  no-empty-function: warn
  no-extend-native: error
  no-param-reassign: warn
  no-unused-expressions: warn
  no-useless-concat: warn
  no-label-var: warn
  no-use-before-define: error
  no-const-assign: error
  no-useless-constructor: warn
  no-useless-rename: warn
  no-warning-comments:
    - warn
    - location: anywhere
      terms:
        - todo
        - fixme
  prefer-promise-reject-errors: error
  semi: error
settings:
  react:
    pragma: React
    version: 17.0.1

Usage with React

To get started linting React applications, you can use the following ESLint configuration:

.eslintrc.yml

env:
  browser: true
  es6: true
  mocha: true
parser: "@babel/eslint-parser"
extends:
  - "eslint:recommended"
  - "plugin:react/recommended"
parserOptions:
  ecmaVersion: 2021
  sourceType: "module"
  ecmaFeatures:
    classes: true
settings:
  react:
    pragma: React
    version: 18.0.0

Usage with TypeScript

TSLint is deprecated for quite some time so we recommend using ESLint for TypeScript analysis. The setup is pretty straight forward. First you need to tell ESLint to analyze also .ts files and disable TSLint. You can achieve that by adding .codeac.yml into the root of your repository.

.codeac.yml

---

version: '1'
tools:
    eslint:
        ext: '.js,.jsx,.ts,.tsx'
    tslint:
        enabled: false

The last step is to teach ESLint understanding TypeScript with the official typescript-eslint plugin. Feel free to add more rules configuration such as the complexity one in the example below.

.eslintrc.yml

env:
    browser: true
    es6: true
    node: true
parser: "@typescript-eslint/parser"
plugins:
    - "@typescript-eslint"
extends:
    - "eslint:recommended"
    - "plugin:@typescript-eslint/recommended"
rules:
    complexity:
        - error
        - 10

Ignoring files

Storing generated or third party code in your repository is in general not a good idea. However, sometimes you really need to do this and Codeac got you covered. Usually you don't want to analyze those files so you can place .eslintignore file to the root folder of your repository. This file can contain list of files that are ignored. Take a look on this simple example with jQuery and Bootstrap:

.eslintignore

dist/jquery.min.js
dist/bootstrap.js

Supported plugins

For security concerns related to executing code within a docker container, our ESLint engine currently ignores all but a select number of ESLint plugins. Please see the list below of plugins we currently support: