Code Monkey home page Code Monkey logo

eslint-config's Introduction

CodeQL MIT License

ESLint Config

ESLint basic configuration for personal projects.

Installation

npm install --save-dev eslint-config-chema22r

Usage

This ESLint config adds the rules modularly, depending on the needs of the project. Those are the possible extensions and their requirements:

Extension ID Aim Requirements (plugins)
eslint-config-chema22r Frontend
Backend
eslint-plugin-import
eslint-plugin-promise
eslint-config-chema22r/jest Frontend eslint-plugin-jest
eslint-config-chema22r/mocha Backend eslint-plugin-mocha
eslint-config-chema22r/mongo Backend -
eslint-config-chema22r/node Backend eslint-plugin-node
eslint-config-chema22r/react Frontend eslint-plugin-react
eslint-plugin-react-hooks

All the extensions are compatible and can be combined.

All the extensions include a default configuration that can be overwritten (parserOptions, rules, settings, etc.).

All the extensions requirements must be installed or some of the imported rules might not work. E.g.: the extension eslint-config-chema22r imports a custom set of rules based on the extensions eslint:all, plugin:import/recommended and plugin:promise/recommended so in this case, not installing the plugin eslint-plugin-import or eslint-plugin-promise will disable all the rules related to the corresponding plugin, but the eslint rules will still be enabled.

Examples

Frontend Example Using React and Jest

{
    "env": {
        "browser": true,
        "es2021": true,
        "jest": true
    },
    "extends": [
        "chema22r",
        "chema22r/jest",
        "chema22r/react"
    ],
    "parserOptions": {
        "ecmaFeatures": {
            "impliedStrict": true,
            "jsx": true
        },
        "ecmaVersion": 2021,
        "sourceType": "module"
    },
    "parser": "babel-eslint",
    "rules": {}
}

In this example, the env and parserOptions fields are completely optional since they were already imported through the extensions used. Setting a different configuration here will merge and overwrite the imported one from the extensions. Important example: the imported parserOptions looks exactly as in the example, so if we set a different one locally as "parserOptions": { "ecmaFeatures": { "jsx": false } }, only the field jsx will be overwritten, keeping all remaining fields intact, even the impliedStrict field within ecmaFeatures.

Backend Example Using Node.js, MongoDB and Mocha

{
    "env": {
        "es2021": true,
        "mocha": true,
        "mongo": true,
        "node": true
    },
    "extends": [
        "chema22r",
        "chema22r/mocha",
        "chema22r/mongo",
        "chema22r/node"
    ],
    "parserOptions": {
        "ecmaFeatures": {
            "impliedStrict": true
        },
        "ecmaVersion": 2021,
        "sourceType": "module"
    },
    "rules": {}
}

In this example, the env and parserOptions fields are completely optional since they were already imported through the extensions used. Setting a different configuration here will merge and overwrite the imported one from the extensions. Important example: the imported env looks exactly as in the example, so if we set a different one locally as "env": { "es2019": true }, no field will be overwritten, keeping all remaining fields intact, even the es2021 field.

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.