autofix max-line rule

[n1xn]

I want to autofix custom rules by saving the file. Everything works fine except custom rules, I dont know why. In this example I am trying to apply a max-len rule, which gets reccognized by throwing errors but autofixing does not trigger.

.eslintrc.js

  extends: [
    "airbnb-base",
    "plugin:@typescript-eslint/recommended",
    "prettier/@typescript-eslint"
  ],
  parser: "@typescript-eslint/parser",
  plugins: ["@typescript-eslint"],
  parserOptions: {
    project: "./tsconfig.json"
  },
  settings: {
    "import/resolver": {
      node: {
        extensions: [".js", ".jsx", ".ts", ".tsx", ".d.ts"]
      }
    }
  },
  rules: {
    "max-len": ["error", { code: 80, ignoreUrls: true }]
  }
};

.vscode/settings.json

{
  "eslint.enable": true,
  "eslint.validate": [
    { "language": "javascript", "autoFix": true },
    { "language": "javascriptreact", "autoFix": true },
    { "language": "typescript", "autoFix": true },
    { "language": "typescriptreact", "autoFix": true }
  ],
  "eslint.run": "onType",
  "eslint.packageManager": "npm",
  "eslint.alwaysShowStatus": true,
  "eslint.autoFixOnSave": true,
}

[lydell]

First off – don't forget to include "prettier" in your extends array (right before "prettier/@typescript-eslint").

According to the max-len documentation, max-len does not have autofix. So that should be why it's not autofixed?

[n1xn]

Thank you for that hint! But by adding this line the code feels unformated. I have read the Airbnb implementation guide of this repo. But the rules doesnt really get applied. I have tested it with multiple-empty-lines. It only gets applied when I leave "prettier" out ot the extends array (format on saving).

I will try reinstalling VSCode..

[lydell]

Cool! Let me know if you need further help. I’m closing this for now since there seems to be nothing to do on our side, but we’ll reopen if needed.

[n1xn]

By adding "prettier" linting is not more supported. Single Quotes, Space Lines etc. will not be an error anymore. I think I will stick to tslint until typescript-eslint hits v2.

EDIT:

Got the behavior I want now, with the following config:

module.exports = {
  extends: [
    "airbnb-base",
    "plugin:@typescript-eslint/recommended",
    "plugin:prettier/recommended",
    "prettier/@typescript-eslint"
  ],
  parser: "@typescript-eslint/parser",
  plugins: ["@typescript-eslint"],
  parserOptions: {
    project: "./tsconfig.json"
  },
  settings: {
    "import/resolver": {
      node: {
        extensions: [".js", ".jsx", ".ts", ".tsx", ".d.ts"]
      }
    }
  },
  rules: {
    quotes: [
      "error",
      "single",
      { avoidEscape: true, allowTemplateLiterals: false }
    ],
    "prettier/prettier": ["error", { singleQuote: true }]
  }
};