[vscode]代码规范ESLint + Prettier 在vue项目中的使用和冲突解决[完美解决]
发布时间：2022-12-25 12:00
前言
在创建项目的时候记得勾选使用代码规范
![[vscode]代码规范ESLint + Prettier 在vue项目中的使用和冲突解决[完美解决]_第1张图片](https://img.it610.com/image/info8/fd5f369a0eba4a19b50b3f31871050d6.jpg)
ESLint
把规矩都列出来写在文件里，规范大家的代码统一化
如果代码不符合规则,ESLint就会报警高或者报红
Prettier
把规矩都列出来写在文件里，规范大家的代码统一化
一键保存自动帮助大家通过统一的规则格式化代码
使用
-
在vscode中开发vue项目需要安装这三个插件
![[vscode]代码规范ESLint + Prettier 在vue项目中的使用和冲突解决[完美解决]_第2张图片](https://img.it610.com/image/info8/aa63116554db4a0f8401ef0a369e5b70.jpg)
-
在
.eslintrc.js文件中配置rules属性[详细的规则见文档]-
举个栗子 规定字符串使用单引号和末尾不加分号
rules: { 'no-console': process.env.NODE_ENV === 'production' ? 'warn' : 'off', 'no-debugger': process.env.NODE_ENV === 'production' ? 'warn' : 'off', 'quotes': [1, 'single'], // 字符串使用单引号 'semi': [1, 'never'], // 末尾不加分号 'prettier/prettier': 'off' // 防止终端中因为规则问题报警告,所以关闭 },
-