Prettier 代码格式化

  1. 添加依赖
yarn add prettier
  1. 配置 WebStorm

  2. 格式化文件

在根目录下新建.prettierrc.json的文件,标识格式化规范 文件内容如下

{
  "printWidth": 100,
  "semi": true,
  "vueIndentScriptAndStyle": true,
  "singleQuote": true,
  "trailingComma": "all",
  "proseWrap": "never",
  "htmlWhitespaceSensitivity": "strict",
  "endOfLine": "auto"
}
  • singleQuote: 单引号
  • trailingComma: 对象属性最后没有","
  • semi: 是否需要分号

更多设置参考官方文档:https://prettier.io/docs/en/options.html

在根目录下新建.prettierignore的文件,标识格式化忽略的文件或者目录 文件内容如下

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

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

/public/*

编辑根目录下package.json 添加一行代码内容如下

"lint:prettier": "prettier --write  \"src/**/*.{js,json,tsx,css,less,scss,vue,html,md}\""

执行yarn run lint:prettier即可按照规范格式化指定范围内的文件代码

Stylelint 检查

  1. 添加依赖
yarn add stylelint
  1. 配置 WebStorm

Eslint 检查

  1. 添加依赖
yarn add eslint
  1. 配置 WebStorm

TypeScript 规范

  1. 配置 WebStorm

Logo

技术共进,成长同行——讯飞AI开发者社区

更多推荐