prettier格式化代码

时间:2021-6-17 作者:qvyue

prettier格式化,可以让整个项目按照同一种风格习惯写代码,不会出现一些人用两个空格,一些人用四个空格,让代码看起来很乱,有代码洁癖的人真是无法忍受

这里是prettier日常配置,记录一下

1. vscode下载prettier插件

2. 在项目根目录添加配置文件

  • 创建.prettierrc.js文件
module.exports = {
  // 2个空格渐进
  "tabWidth": 2,
  // 不使用缩进符,使用空格
  "useTabs": false,
  // 使用单引
  "singleQuote": true,
  // 行尾不使用;
  "semi": false,
  // 一行多少字符会换行
  "printWidth": 200,
  // 箭头函数,只有一个参数时,不需要括号
  "arrowParents": "avoid"
}
  • .prettierignore文件
*.min.js
*.handle.js
*.min.css
lib/
node_modules/
dist/

3. 默认使用prettier格式化文件

在单个文件里,右击,选择”format document with”,选择prettier

4. 在单个文件使用快捷

  • mac:options + shift + f
  • windows:alt + shift + f

5. 如果要全局格式化

// 设置全局格式化的范围
"scripts": {
  "pretitter": "pretitter --write './src/**/*.vue' ./src/**/*.js ./common/*.js"
}
  • 执行npm run pretitter进行全局格式化

6. 如果发现不生效,有可能需要项目安装prettier插件

npm i prettier
重启vscode和项目,查看是否生效

声明:本文内容由互联网用户自发贡献自行上传,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任。如果您发现有涉嫌版权的内容,欢迎发送邮件至:qvyue@qq.com 进行举报,并提供相关证据,工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。