vscode中使用prettier和typescript

参考博文#

文章标题：How to use Prettier with ESLint and TypeScript in VSCode
链接：https://khalilstemmler.com/blogs/tooling/prettier/

总结#

1. 使用npm安装prettier

npm install --save-dev prettier

2. 新增.prettierrc配置文件，需要对哪些内容进行格式化

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

3. 新增.prettierignore忽略格式的文件

/dist/*
.local
.output.js
/node_modules/**

**/*.svg
**/*.sh

/public/*

4. package.json中新增运行的脚本

{
  "scripts": {
    ...
    "prettier": "prettier --config .prettierrc --write ."
  }
}

5. 在vscode中安装Prettier - Code formatter插件
6. 打开vscode的配置settting.json如果没有下列配置项或者配置项不对的话则按下面的进行处理

// Default (format when you paste)
"editor.formatOnPaste": true,
// Default (format when you save)
"editor.formatOnSave": true,

7. 运行命令，会对不符合格式要求的内容进行格式化

npm run prettier