全栈笔记_规范篇（eslint+prettier统一管理前端代码规范 - 基础知识）

两者的区别

1. eslint：代码格式和代码质量都支持检查，但最擅长的是代码质量处理，不擅长代码格式处理。
2. prettier：是一个代码格式化工具，只做代码格式化处理，比如是否使用单引号，语句结尾是否使用分号等等。

• 结论：我们一般采用eslint来做代码质量约束，用prettier来做代码风格约束。

使用

1. 安装vscode插件：eslint 和 Prettier - Code formatter
2. 安装依赖包：yarn add eslint@7.32.0 -D
3. settings.json配置：
   • 开启保存触发自动格式化功能： “editor.formatOnSave”: true
   • 设置默认格式化工具：“editor.defaultFormatter”: “esbenp.prettier-vscode”
   • 新建配置文件.eslintrc.js：配置参考vue3案例
   • 新建配置文件.prettierrc.js：文件保存时就会按这个配置格式化文件

   // .pretti