Prettier是一款强大的代码格式化工具,支持JavaScript、TypeScript、CSS、SCSS、Less、JSX、Angular、Vue、GraphQL、JSON、Markdown等语言,基本上前端能用到的文件格式它都可以搞定,是当下最流行的代码格式化工具。
一. 安装prettier
npm install prettier -D
二. 配置.prettierrc文件:
- useTabs:使用tab缩进还是空格缩进,选择false;
- tabWidth:tab是空格的情况下,是几个空格,选择2个;
- printWidth:当行字符的长度,推荐80,也有人喜欢100或120;
- singleQuote:使用单引号还是双引号,选择false,使用双引号;
- trailingComma:在多行输入的尾逗号是否添加,设置为 none;
- semi:语句末尾是否要加分号,默认值true,选择false表示不加;
{
"useTabs": false,
"tabWidth": 2,
"printWidth": 80,
"singleQuote": false,
"trailingComma": "none",
"semi": false
}
三. 创建.prettierignore忽略文件
/dist/*
.local
.output.js
/node_modules/**
**/*.svg
**/*.sh
/public/*
四. VSCode需要添加prettier插件
五. 在package.json文件里面配置"scripts"脚本
"prettier": "prettier --write ."
六. 终端运行命令:
npm run prettier
可以看到终端输出以下内容,格式化代码就已经完成啦