add docs on configuring TSLint for Prettier
This commit is contained in:
@@ -15,6 +15,7 @@
|
||||
* [Module bundling](./in-depth/module-bundling.md)
|
||||
* [Deploy destinations](./in-depth/deploy-destinations.md)
|
||||
* [TypeScript](./in-depth/typescript.md)
|
||||
* [Prettier](./in-depth/prettier.md)
|
||||
* [Cookbook](./in-depth/cookbook.md)
|
||||
* [Environment variables](./in-depth/cookbook/environment-variables.md)
|
||||
* [One-line PowerShell setup](./in-depth/cookbook/one-line-powershell.md)
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
# Prettier
|
||||
# Code formatting with Prettier
|
||||
|
||||
[Prettier](https://prettier.io/) is an automatic code formatter which supports various languages, including TypeScript. It also has extensions for various text editors like [VSCode](https://github.com/prettier/prettier-vscode), [Atom](https://github.com/prettier/prettier-atom), and even [Vim](https://github.com/prettier/vim-prettier). If you have installed these extensions, it will use Prettier's service to automatically format your code after saving.
|
||||
|
||||
@@ -17,3 +17,42 @@ If you would rather not use Prettier instead, you can easily disable it too. In
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
## Configuring TSLint for Prettier
|
||||
|
||||
The `.prettierrc` file configures how Prettier formats your code. By default we use the following options.
|
||||
|
||||
```json
|
||||
{
|
||||
"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`.
|
||||
|
||||
```json
|
||||
{
|
||||
"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.
|
||||
|
||||
```bash
|
||||
yarn add --dev tslint-plugin-prettier
|
||||
```
|
||||
|
||||
```json
|
||||
{
|
||||
"rulesDirectory": ["tslint-plugin-prettier"],
|
||||
"rules": {
|
||||
"prettier": true
|
||||
}
|
||||
}
|
||||
|
||||
@@ -10,7 +10,6 @@
|
||||
"member-ordering": [false],
|
||||
"no-console": [false],
|
||||
"no-namespace": [true, "allow-declarations"],
|
||||
"trailing-comma": [true, {"multiline": "never", "singleline": "never"}],
|
||||
"variable-name": [
|
||||
true,
|
||||
"ban-keywords",
|
||||
|
||||
Reference in New Issue
Block a user