{
  "$type": "site.standard.document",
  "canonicalUrl": "https://mhartington.io/post/typescript-eslint-setup",
  "path": "/post/typescript-eslint-setup",
  "publishedAt": "2019-02-22T02:10:20.000Z",
  "site": "at://did:plc:7kwylbxx56yro6aqz3oh5d2s/site.standard.publication/3mpgyj6haew2g",
  "textContent": "I was digging into ESLint tonight to see if there was a Language Service plugin available for TypeScript. In doing so, I realized I had no clue how to setup ESLint, especially considering the changes with regard to @typescript-eslint.\n\nLast time I used ESLint, I was still writing AngularJS and ES6 was still far away. So, somethings have changed.\n\nInstalling\n\nFirst, we'll want to install the necessary packages, ESLint, the parser, and the plugin itself.\n\nAs noted on the TypeScript/ESLint plugin repo, if you have ESLint installed globally, you'll need to install the plugin globally as well.\n\nSet Up\n\nWith things installed, we need to setup an RC file for ESLint to read. This can be generated with\n\nYou will be prompted with different question about what you want to do with ESLint, most of which you can ignore for now. The last question will ask you how do you want to store your ESLint settings, a JavaScript file, JSON, or YAML. This is up to you, but for the rest of this post, I'll assume JavaScript.\n\nWith our config file created, we'll want to edit it and remove the unnecessary settings.\n\nWe should have something like this\n\nAt a bare minimum, we need to include the correct parser and plugin for ESLint to work.\n\nThis will let us lint any TypeScript file, but it won't be really helpful. By default, ESLint doesn't read any project configuration from a tsconfig.json, you need to specify the path to your tsconfig.json in a parserOptions object.\n\nNow if we run ESLint, it will understand how we have configured our project.\n\nRules and Extends\n\nLike TSLint, ESLint offers different rules and packages we can use to quickly enforce code style. The @typescript-eslint plugin ships with recommended rules that can be used.\n\nThis is nice to get up and running, but what if you need to customize the rules?\n\nTo do this, we just add a rules entry, and configure the rules available\n\nTo see what rules are available, you can read the docs.\n\nClosing\n\nI'm excited to see where ESLint goes and start integrating it in my projects.",
  "title": "TypeScript ESLint Setup"
}