​Prettier is an automatic code formatter which supports various languages, including TypeScript. It also has extensions for various text editors like VSCode, Atom, and even Vim. If you have installed these extensions, it will use Prettier's service to automatically format your code after saving.

If you would rather not use Prettier instead, you can easily disable it too. In VSCode, open .vscode/settings.json, then change the "editor.formatOnSave" option to false:

{
  "[json]": {
    "editor.formatOnSave": false
  },
  "[javascript]": {
    "editor.formatOnSave": false
  },
  "[typescript]": {
    "editor.formatOnSave": false
  }
}

Configuring TSLint for Prettier

The .prettierrc file configures how Prettier formats your code. By default we use the following options.

{
  "semi": true,
  "tabWidth": 2,
  "printWidth": 120,
  "singleQuote": false,
  "trailingComma": "none"
}

We can use tslint-config-prettier to override some TSLint rules with its Prettier counterparts. In your tslint.json file, extend tslint-config-prettier.

{
  "extends" : [
    "tslint:recommended",
    "tslint-config-prettier"
  ]
}

To make Prettier error out on formatting errors, we can also use tslint-plugin-prettier to add a custom rule for this.

yarn add --dev tslint-plugin-prettier

{
  "rulesDirectory": ["tslint-plugin-prettier"],
  "rules": {
    "prettier": true
  }
}