Giter Site home page Giter Site logo

eslint-config's Introduction

How to use

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

Installed libraries out of the box:

Choose the right set of rules

Create the .eslintrc.js file in the directory next to package.json

module.exports = {
  extends: ["@goparrot/eslint-config/recommended"],
  parserOptions: {
    project: "./tsconfig.eslint.json",
  },
  rules: {
    // rules to override.
  },
};

You should create the tsconfig.eslint.json in your project.

See the examples of tsconfig.json and tsconfig.eslint.json in this repository.

Choose the right set of rules

Common recommended rules:

extends: ['@goparrot/eslint-config/recommended']

Less strict rules:

extends: ['@goparrot/eslint-config/recommended', '@goparrot/eslint-config/less-strict']

For a frontend project with react and jsx:

npm install --save-dev eslint-plugin-react eslint-plugin-react-hooks
extends: ['@goparrot/eslint-config/recommended', '@goparrot/eslint-config/react', '@goparrot/eslint-config/jsx']

Create the .eslintignore file in the directory next to .eslintrc.js

# you must any dot `.file` which you want to ignore
# by default we don't ignore hidden `!.*.js` and `!.*.json` files in the root directory (for example: `.commitlintrc.js`, .`prettierrc.json`)
# example: if you don't want to ignore these files
!.eslintrc.js

# don't forget to add here all ignored folders or files from .gitignore that you don't need to check with a linter (there is no magic)
# by default we ignore `node_modules` and `.yalc` folders in the root directory
# example: if you want to ignore these files or directories
dist
coverage
test-reports
.nyc_output
.bit

add npm scripts

{
  "scripts": {
    "prettier": "npm run prettier:base -- '**/**.+(md)'",
    "prettier:base": "prettier --ignore-path .eslintignore --write",
    "format": "npm run prettier && npm run lint -- --fix",
    "format:base": "npm run lint:base -- --fix",
    "format:staged": "git add . && lint-staged --allow-empty -q",
    "lint": "npm run lint:base -- './**/**.{ts,tsx,js,jsx,json}'",
    "lint:base": "npm run lint:config:check && eslint",
    "lint:config:check": "eslint-config-prettier src/index.ts",
    "typecheck": "tsc -p tsconfig.json --noEmit"
  }
}

Make sure to

  • call the linter on the pre-commit hook
  • configure prettier to be called automatically when saving a file in the Webstorm or vscode

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.