ESLint 是一个前端代码检查工具,可以帮助开发者发现代码中的潜在问题,提高代码的可读性、可维护性、降低 Bug 出现的可能性。而 Airbnb、Google 等大型公司制定的规则是业界公认的高质量规则,并且可用于很多项目中。本文将介绍如何使用 ESLint 来配置 Airbnb 规则。
安装和配置
安装 ESLint
npm install eslint --save-dev
安装 eslint-config-airbnb 和 eslint-plugin-import
npm install eslint-config-airbnb eslint-plugin-import --save-dev
如下修改 .eslintrc.js 配置
-- -------------------- ---- ------- -------------- - - -------- - --------- -- -------- - --------- -- ------ - -- ---- ----- ---- -- --
除了规则的配置外,我们还可以在 .eslintrc.js 文件中添加其他的 ESLint 配置,例如 parserOptions、env 等等。
如何使用规则
下面是一些常用的规则:
不允许使用 var 变量
// bad var a = 1; // good let a = 1; const b = 2;
不允许使用 eval 函数
// bad eval('console.log("Hello, world!")'); // good const helloWorld = 'console.log("Hello, world!")';
对象属性须使用点进行访问
// bad const obj = { name: "Alice" }; const name = obj["name"]; // good const obj = { name: "Alice" }; const name = obj.name;
字符串使用单引号
// bad const str = "Hello, world!"; // good const str = 'Hello, world!';
方法及括号间无空格,关键字与括号间有空格
-- -------------------- ---- ------- -- --- -------- --- --- -- - ------ - - - - - -- ---- -------- ------ -- - ------ - - -- -
多个换行只保留一个
-- -------------------- ---- ------- -- --- --- - - -- --- - - -- -- ---- --- - - -- --- - - --
总结
通过设置 ESLint 来使用 Airbnb 规则能够使我们的代码更加规范和易于阅读。在项目开发中,我们可以按照团队或个人的需求,在 .eslintrc.js 配置文件中进行自定义配置。
本文只介绍了一部分 ESLint Airbnb 规则,更多规则请参考官方文档:https://github.com/airbnb/javascript/tree/master/packages/eslint-config-airbnb
希望本文能够帮助你更好地理解 ESLint 校验规则,提高代码质量。
来源:JavaScript中文网 ,转载请注明来源 https://www.javascriptcn.com/post/6594bfe9eb4cecbf2d9069dd