@mvf/eslint-config-typescript

MVF ESLINT CONFIG FOR TYPESCRIPT

Package for MVF typescript linting standards

Install MVF eslint config in your application

If you use npm v5 or above, run the command:

npx install-peerdeps --dev @mvf/eslint-config-typescript

Otherwise, install the correct versions of each package listed by the command:

npm info "@mvf/eslint-config-typescript@latest" peerDependencies

Enable MVF linter

Create .eslintrc.json file in your root directory and paste the below:

{
  "parser": "@typescript-eslint/parser",
  "extends": [
    "@mvf/eslint-config-typescript"
  ]
}

You can add the below scripts in the package.json to run the linter:

"lint": "eslint './src/**/*.ts'" // list lint issues without fixing them
"lint:fix": "npm run lint -- --fix" // fix lint errors automatically when possible and list remaining lint issues

You might need to restart VS Code to see the warnings and errors highlighted in your code.

Recommended overrides on mvf eslint config

We recommend to add a rule to enforce the I prefix on interface names.

Example of incorrect code for this rule

interface HelloWorld {
  name: string
}

Example of correct code for this rule

interface IHelloWorld {
  name: string
}

To add this rule, paste the below in your .eslintrc.json file (after "extends")

"rules": {
  "@typescript-eslint/naming-convention": [
    "error",
    {
      "selector": "interface",
      "format": ["PascalCase"],
      "prefix": ["I"]
    }
  ]
}

We also recommend disabling "@typescript-eslint/no-explicit-any" for your test, mock and migration files

"overrides": [
  {
    "files": [
      "*.test.ts",
      "*.mock.ts",
      "src/migrations/*.ts"
    ],
    "rules": {
      "@typescript-eslint/no-explicit-any": "off"
    }
  }
]

React applications

This config doesn't support React by default. To add React linter, we recommand to install eslint-plugin-react

Remember to update your lint script to include tsx files

"lint": "eslint './src/**/*.ts' './src/**/*.tsx'"

Publish changes to @mvf/eslint-config-typescript

After you have merged a PR to master, you need to rebuild and publish the components.

1. Checkout master git checkout master && git pull
2. Use one of the following make publish commands to publish changes:
   • make publish kind=patch - Use this if your change is a bug fix and is backwards compatible.
   • make publish kind=minor - Use this if your change adds new functionality and is backwards compatible.
   • make publish kind=major - Use this if your change is not backwards compatible.