1.说明
ESLint
简单的来说就是去判断你的JS
代码写的格式对不对的一个依赖。没有它你的代码也能运行,有了它你的代码可以写的更漂亮。ESLint
还支持插件,第三方框架会基于ESLint
写出自己的代码检查插件。比如Vue3
对应eslint-plugin-vue
。其他的不过多探讨,直接手撕Vben
的代码。
2.安装ESLint
yarn add eslint --dev
配置ESLint:根目录下创建:.eslintrc.js
文件。
这里可以使用eslint
的init
。但是我不清楚Vben
的初始化操作是怎么选的,所以直接拷贝Vben
的配置算了,知道的朋友也可以指教这里怎么init
。
2.1.原代码
module.exports = {
root: true,
env: {
browser: true,
node: true,
es6: true,
},
parserOptions: {},
extends: [],
rules: {},
};
7.1.2.带注解代码
module.exports = {
// ↓默认情况下,ESLint 会在所有父级目录里寻找配置文件,一直到根目录。如果你想要你所有项目都遵循一个特定的约定时,这将会很有用,但有时候会导致意想不到的结果。为了将 ESLint 限制到一个特定的项目,在你项目根目录下的 package.json 文件或者 .eslintrc.* 文件里的 eslintConfig 字段下设置 "root": true。ESLint 一旦发现配置文件中有 "root": true,它就会停止在父级目录中寻找。
// ↓此项是用来告诉eslint找当前配置文件不能往父级查找
root: true,
// ↓指定你想启用的环境
env: {
browser: true,
node: true,
es6: true,
},
// ↓设置解析器
parser: "",
// ↓解析器选项
parserOptions: {},
// ↓扩展项
extends: [],
// ↓自定义规则配置
rules: {},
};
3.配置ESLint忽略文件
根目录下创建:.eslintignore
文件。这个匹配文件没什么好解释的。
*.sh
node_modules
*.md
*.woff
*.ttf
.vscode
.idea
dist
/public
/docs
.husky
.local
/bin
Dockerfile
上一章
第六章-配置TS
下一章
第八章-安装eslint-plugin-vue