前端代码覆盖率问题及总结(二)

---

更新于2020.06.18

不管修改环境还是全局插桩打包出来的文件都没有插桩成功

同时在调研新的前端项目接入的时候跟我反馈到：打包test环境后能够正常插桩(这个是现象，因为我们的配置 istanbul的插件只是在test环境下才生效)，然后再重新打包pro环境的时候，打包出来的也仍然含有插桩的内容。

问题很诡异，于是我这边也重新做了个验证，先打了pro环境的包发现没有插桩，很正常。重新切换到test环境进行打包结果竟然没有插桩。这个就真的很奇怪了。我一度怀疑是package script设置环境变量的问题

"test": "cross-env BABEL_ENV=test webpack --config ./webpack.config/webpack.prod.istanbul.js --progress",

这个是我们的package.json的test打包的脚本

尝试了修改 BABEL_ENV=test为NODE_ENV=test或者说BABEL_ENV=test webpack --config多加一个 BABEL_ENV=test && webpack --config
结果还是一样。

这个时候只能使出终极大招了，我们默认babelrc插件的配置是这样子的。

"env": {
    "test": {
      "plugins": ["istanbul"]
    }
}

直接去掉env的现在，让默认打包都带上插桩

{
  "presets": [
    "@babel/preset-react",
    ...
  ],
  "plugins": [
    "react-hot-loader/babel",
    "@babel/plugin-transform-runtime",
    "@babel/plugin-transform-modules-commonjs",
    "istanbul"
    ...

就不信还插桩不成功。
结果真的是没成功。这个真的是没理由了。

突然想起来在上边的文章里面我们有提到可以在istannbul的源码里面打个日志看看是否有进入到instabul中。

babel-plugin-istanbul

export default declare(api => {
  api.assertVersion(7)

  const shouldSkip = makeShouldSkip()

  const t = api.types
  return {
    visitor: {
      Program: {
        enter (path) {
          this.__dv__ = null
          this.nycConfig = findConfig(this.opts)
          const realPath = getRealpath(this.file.opts.filename)
          // 增加一个打印
          console.log('istanbul, ', this.file.opts.filename)
          if (shouldSkip(realPath, this.nycConfig)) {
            return