Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

ESLint demands semicolon and wants it removed at the same time

I am configuring ESLint (as TSLint is soon-to-be-deprecated) to work with my .ts files. I have this very little file:

export default interface Departure {
  line: string;
  direction: string;
  time: Date;
};

in the last time, where semicolon is, ESLint in my VSCode signals two errors: one about missing semicolon eslint(semi) and another one about unnecessary semicolon eslint(no-extra-semi).

eslint semicolon error

Below is my .eslintrc.js:

module.exports = {
    "env": {
        "browser": true,
        "commonjs": true,
        "es6": true,
        "node": true
    },
    "extends": [
        "plugin:@typescript-eslint/recommended",
        "airbnb"
    ],
    "globals": {
        "Atomics": "readonly",
        "SharedArrayBuffer": "readonly"
    },
    "parser": "@typescript-eslint/parser",
    "parserOptions": {
        "ecmaFeatures": {
            "jsx": true
        },
        "ecmaVersion": 2018
    },
    "plugins": [
        "react",
        "@typescript-eslint"
    ],
    "settings": {
        "import/resolver": {
            "node": {
                "extensions": [".js", ".jsx", ".ts", ".tsx"]
            }
        }
    },
    "rules": {
    }
};

how can I get rid of this bizarre situation? None of the errors should be there.

like image 589
MrLoon Avatar asked Oct 20 '19 16:10

MrLoon


People also ask

Do you require semicolons ESLint?

This rule has two options, a string option and an object option. String option: "always" (default) requires semicolons at the end of statements. "never" disallows semicolons as the end of statements (except to disambiguate statements beginning with [ , ( , / , + , or - )

Should I use semicolons TypeScript?

The use of semicolons in JavaScript is optional due to the existence of ASI. TypeScript also uses ASI. However, ASI does not always function correctly, and there are several situations where missing a semicolon will lead to an unexpected runtime error.

Do I need ESLint if I use TypeScript?

In the TypeScript 2019 Roadmap, the TypeScript core team explains that ESLint has a more performant architecture than TSLint and that they will only be focusing on ESLint when providing editor linting integration for TypeScript. For that reason, I would recommend using ESLint for linting TypeScript projects.


1 Answers

The issue here is that 2 rules are applied at the same time:
1. export default requires to have a semicolon
2. interface requires to get rid of a semicolon

The fix here would be to split the declaration of the interface from the export statement like so:

interface Departure {
  line: string;
  direction: string;
  time: Date;
}

export default Departure;

I didn't come up with the answer myself. Source was this submitted issue

like image 172
oleksandr.kazimirchuk Avatar answered Oct 25 '22 17:10

oleksandr.kazimirchuk