How to configure eslint with nodejs express application

Viewed 32276

js application. I need to use eslint for this application. I am using https://www.npmjs.com/package/eslint-config-airbnb and using prettier plugin in VS Code editor.

.eslintrc

{
  "extends": "airbnb"
}

I see that VS Code is giving me lot of errors in complete project now after adding eslint plugin https://marketplace.visualstudio.comitems?itemName=dbaeumer.vscode-eslint and npm package.

Few errors

[eslint] Definition for rule 'jsx-a11y/href-no-hash' was not found (jsx-a11y/href-no-hash)
[eslint] Expected linebreaks to be 'LF' but found 'CRLF'. (linebreak-style)
[eslint] Unexpected unnamed function. (func-names)
[eslint] Missing space before function parentheses. (space-before-function-paren)
[eslint] Strings must use singlequote. (quotes)
[eslint] Unexpected function expression. (prefer-arrow-callback)
[eslint] Unexpected unnamed function 'bind'. (func-names)
[eslint] Missing space before function parentheses. (space-before-function-paren)

package.json

  "devDependencies": {
    "babel": "^6.23.0",
    "babel-cli": "^6.5.1",
    "babel-core": "^6.9.0",
    "babel-eslint": "^7.2.3",
    "babel-preset-es2015": "^6.5.0",
    "babel-preset-stage-0": "6.5.0",
    "eslint": "^3.19.0",
    "eslint-config-airbnb": "^15.1.0",
    "eslint-plugin-import": "^2.7.0",
    "eslint-plugin-jsx-a11y": "^6.0.2",
    "eslint-plugin-react": "^7.4.0",
    "nodemon": "^1.12.1"
  }

index.js

import request from "superagent";

module.exports = function(req, res, next) {
  const id = "abc";

  request
    .post(url)
    .send(`p1=v1`)
    .send(`p2=v2`)
    .end(function(error, response) {}.bind(this));
  next();
};

enter image description here

Same kind of errors in each JS files. Does anyone know how to resolve these ?

5 Answers

1) Add the following modules to your devDependencies using:

npm install --save-dev eslint
npm install --save-dev eslint-config-airbnb-base
npm install --save-dev eslint-plugin-import

2) Add an eslintConfig section to your package.json:

"eslintConfig": {
    "extends": "airbnb-base",
    "env": {
        "es6": true,
        "browser": true
    },
    "rules": {
        "brace-style": [
            "error",
            "stroustrup"
        ],
        "comma-dangle": [
            "error",
            "never"
        ],
        "no-unused-vars": [
            "warn"
        ],
        "no-var": [
            "off"
        ],
        "one-var": [
            "off"
        ]
    }
}

3) Visit eslint.org/docs/rules, search for the warnings you want to tweak and add them to the eslintConfig above.

4) Delete the .eslintrc file in the root of your project.

5) Restart your IDE

ESLint wrote messages what you need to do. Just read it.

Correct code with this rules should be following:

import request from 'superagent';

module.exports = (req, res, next) => {
  const id = 'abc';

  request
    .post(url)
    .send('p1=v1')
    .send('p2=v2')
    .end((error, response) => {
      // do something on end
    });
  next();
};

Other answers are close, hope this answer will help in a complete answer:

1:

File .eslintrc.js

module.exports = {
  env: {
    es6: true,
    node: true,
  },
  extends: "eslint:recommended",
  globals: {
    Atomics: "readonly",
    SharedArrayBuffer: "readonly",
  },
  // parser: "babel-eslint",
  parserOptions: {
    ecmaVersion: 2018,
    sourceType: "module",
  },
  // plugins: [],
  rules: {
    "no-console": "off", // "warn" // "off"
  },
  settings: {},
};

2:

File .eslintignore

node_modules/

3:

File package.json

{
  "scripts": {
    "lint": "eslint \"./**/*.js\" --quiet",
    "lintFull": "eslint \"./**/*.js\"",
    "lintFix": "eslint --fix './**/*.js'"
  },
  "devDependencies": {
    "eslint": "^6.8.0",
  }
}

4:

npm i
npm run lint

That's all

----------------

But, additionally, if you want to make your own .eslintrc.js with custom settings like Typescript, etc. try the below:

1:

npm i eslint -g

2:

eslint --init

? How would you like to use ESLint? To check syntax and find problems
? What type of modules does your project use? JavaScript modules (import/export)
? Which framework does your project use? None of these
? Does your project use TypeScript? No
? Where does your code run? Node
? What format do you want your config file to be in? JavaScript
    Successfully created .eslintrc.js file in C:\repo\nodeapp1

Hope that helps.

If you are using atom, vs code... maybe the editor needs to install globally eslint.

npm install -g eslint

Related