使用 Istanbul + Webpack 覆盖 JSX 文件的代码

Posted 2023-03-16

【中文标题】使用 Istanbul + Webpack 覆盖 JSX 文件的代码

【英文标题】：Code coverage on JSX files with Istanbul + Webpack

【发布时间】：2016-07-23 23:51:58

【问题描述】：

我正在尝试使用 (webpack/karma) 为我的反应组件生成伊斯坦布尔覆盖率报告。但是生成的报告显示了转译后的代码，并且充满了（必要的）代码。

有没有办法在转译报告中的 JSX 代码之前查看或者至少只查看真实的应用程序代码？

我在karma.conf.js 中使用了一个 istanbul-instrumenter 作为 postLoader：

webpack: 
    postLoaders: [  
        //delays coverage til after tests are run, fixing transpiled source coverage error
        test: /\.jsx$/,
        exclude: /(test|node_modules|bower_components)\//,
        loader: 'istanbul-instrumenter' 
    ]

【问题讨论】：

你应该可以用 babel-node 做到这一点

【参考方案1】：

我刚刚通过将istanbul-instrumenter-loader 更改为babel-istanbul-instrumenter-loader 解决了这个问题。

遵循所需的配置：

 preLoaders: [
   // transpile and instrument only testing sources with babel-istanbul
   
     test: /.jsx?$/,
     loader: 'babel-istanbul',
     include: [
       path.resolve(__dirname, "/src/"), // My tests are under src folder :(
     ],
     query: 
       cacheDirectory: true
     
  
]