记录集成 coveralls 时遇到的一坑

这两天想试一下coveralls，遂找了一个测试比较全的，使用mocha的React + Redux的Todo项目试验了一下，想着在这个基础上作一作练习，用用karma、Jest、AVA，结果刚开始就遇到了一个坑，折腾了很久才解决。

这个坑的大概是因为测试文件中使用了ES6语法，使用istanbul cover命令的时候就会报错，在网上找了不少方法试验，最终是成功的方法记录以下

一、 安装必要的包

yarn add cross-env babel-plugin-istanbul nyc --dev

二、 在package.json中添加以下内容

{
  …
  "nyc": {
    "require": [
      "babel-register"
    ],
    "reporter": [
      "lcov",
      "text"
    ],
    "include": [
      # 测试文件路径，如 "test/**/*.spec.js"
    ],
    "sourceMap": false,
    "instrument": false
  }
  …
}

或者新建一个.nycrc文件放入

{
  "require": [
    "babel-register"
  ],
  "reporter": [
    "lcov",
    "text"
  ],
  "include": [
    # 测试文件路径，如 "test/**/*.spec.js"
  ],
  "sourceMap": false,
  "instrument": false
}

三、 在.babelrc的env中添加

{
  …
  "env": {
    …
    "test": {
      "plugins": [
        [
          "istanbul", {
            "exclude": [
              # 测试文件路径，如 "**/*.spec.js"
            ]
          }
        ]
      ]
    }
  }
}

四、 在package.json的scripts中加入

"test:cov": "cross-env NODE_ENV=test nyc --reporter=text --reporter=lcov mocha test/**/*.spec.js"

五、 在终端执行yarn test:cov，最终成功效果以下

六、 最后再添加上.travis.yml和.coveralls.yml文件，再经过一些配置，就能够有 这种徽章了。这里就再也不赘述了，能够看下面的参考资料

参考资料

• 前端开源项目持续集成三剑客

• 如何让你的github项目更加高大上

• .travis.yml配置

• nyc官网