一、esLint
esLint是提供一个插件化的javascript代码检测工具。
esLint 配置文件遵循 commonJS 的导出规则,所导出的对象是 eslint 的配置对象。
module.exports = {
// 表示当前目录即为根目录, eslint 规则将被限制到该目录下
root: true,
// env 表示启用 eslint 检测的环境
env: {
// 在 node 环境下启动 eslint 检测
node: true
},
// eslint 中基础配置需要继承的配置
extends: [
'plugin:vue/essential',
'@vue/standard'
],
// 解析器
parserOptions: {
parser: 'babel-eslint'
},
// 需要修改的启用规则及其各自的错误级别
/**
* 错误级别分为三种:
* "off" 或 0 --- 关闭规则
* "warn" 或 1 --- 开启规则,使用警告级别的错误:warn(不会导致程序退出)
* "error" 或 2 --- 开启规则,使用错误级别的错误:error(当被触发的时候,程序会退出)
*/
rules: {
'no-console': process.env.NODE_ENV === 'production' ? 'warn' : 'off',
'no-debugger': process.env.NODE_ENV === 'production' ? 'warn' : 'off'
}
}
二、eslint和prettier配合解决代码格式问题
1、打开vscode 在插件选项中找到对应插件进行安装即可。
2、新建一个.prettierrc文件
在该文件下,写入一下代码
{
// 不尾随分号 即 写完一句js代码,后面不加分号
"semi": false,
// 使用单引号
"singleQuote": true,
// 多行逗号分割的语法中,最后一行不加逗号
"trailingComma": "none"
}
3、设置vscode保存代码时,让代码符合eslint标准
4、修改vscode中tab对应的空格数
对于vscode而言,默认一个tab等于4个空格,而eslint希望一个tab为两个空格。
5、如果vscode使用了多个代码格式化工具,需要将prettier设置为默认
在任意一个文件中,右键
6、eslint和prettier代码冲突问题解决
eslint要求方法名和后面的小括号之间有个空格,但是保存时,prettier会自动将这个空格删除,因此造成冲突。
只需在.eslintrc.js文件中添加一条规则即可文章来源:https://www.toymoban.com/news/detail-784554.html
文章来源地址https://www.toymoban.com/news/detail-784554.html
到了这里,关于vscode使用eslint及prettier配合解决代码格式问题的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!