prettier + tslint使用

使用prettier

只需要保存文件，代码就会被整理格式，代码复查的时候不需要再争论风格

把prettier加入到项目:

yarn add prettier --dev --exact

Then, create an empty config file to let editors and other tools kNow you are using Prettier:

echo {}> .prettierrc.json

{
    "bracketSpacing": true,
    "semi": true,
    "singleQuote": true,
    "trailingComma": "es5",
    "printWidth": 200
}

要从格式化中排除文件.prettierignore，请在项目的根目录中创建一个文件。.prettierignore使用gitignore 语法。

package.json
package-lock.json
yarn.lock
wwwroot
*.html
*.less

用一个文件验证是否成功:

yarn prettier --write src/index.js

git提交代码的时候自动运行prettier:  pretty-quick

yarn add pretty-quick husky --dev

In package.json, add:

"husky": {
  "hooks": {
    "pre-commit": "pretty-quick --staged"
  }
}

 

 

使用.vscode中settings.json

打开设置-工作区设置

选中format on save，自动生成settings.json文件

 

 保存时自动格式化--使用tslint

"editor.formatOnSave": true,
"editor.codeActionsOnSave": {
  "source.fixAll.tslint": true
},

 

 

 

解决tslint和prettier冲突

Prettier 负责格式化，而 tslint 负责代码质量等所有其他事情。

安装过程很简单，一旦你设置TSLint and Prettier:

yarn add -D tslint-config-prettier

Make sure you've already set up TSLint and Prettier.

将其添加到tslint.json文件的末尾：

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

现在我们可以毫无问题地使用 Prettier 和 TSLint！