使用eslint统一代码风格

最近时间比较多，研究了一下公司项目中的代码，发现项目的编码风格并不统一，运算符前面空格的，运算符前面不空格的，用tab的，用空格键的，注释也写的及其不规范，忍不了，所以想借助eslint来统一一下编程风格，提高公司代码的一致性。

什么是eslint

ESLint最初是由Nicholas C. Zakas 于2013年6月创建的开源项目。它的目标是提供一个插件化的javascript代码检测工具。借助eslint，我们可以统一代码风格，让整个项目的编程风格保持一致。

如何使用eslint

关于如何学习eslint，推荐直接看官网：eslint。官网对于如何安装，如何配置已经介绍的很仔细了，我就不再狗尾续貂了。
一般推荐使用eslint init命令生成配置文件，然后根据自己的习惯，选择生成自己自定义的代码风格配置还是大公司里面的配置。生成配置文件后，如果我们想对代码规则修改，可以在rules里面加上自己的配置。

"rules": {
        "no-console":0
}

比如我的配置文件规则引用的是一个现在比较流行的规则，其中有一条就是不允许出现console，但是我个人比较喜欢用console.log调试,所以我将这条规则关闭了。总而言之，eslint的规则是完全可以自定义的。

js-doc风格的注释

JSDoc 根据 JavaScript 代码中的特殊格式的注释生成应用程序接口（API）文档。例如，下面的是一个函数的 JSDoc 注释：

/**
 * Add two numbers.
 * @param {number} num1 The first number.
 * @param {number} num2 The second number.
 * @returns {number} The sum of the two numbers.
 */
function add(num1, num2) {
    return num1 + num2;
}

在第一眼看到这个注释的时候就有一股亲切感，这不是C#里面的summary嘛，瞬间爱上。赶快找在webstrom里面怎么生成这种风格的注释，发现只要输入/**然后按enter就可以了，不愧是webstrom，啥都有。

在webstrom中使用eslint

使用npm安装好eslint后，选择File | Settings | Languages & Frameworks | JavaScript | Code Quality Tools | ESLint。一般安装好以后，webstrom会自动的寻找eslint所在的目录，并不需要我们手动的去配置，具体配置可参考下图。

webstrom-eslint.png