nyc with webpack 4 using .tmp folder

Question

I am currently using:

"mocha": "^5.2.0"
"mocha-webpack": "^2.0.0-beta.0"
"webpack": "^4.19.1"
"nyc": "^13.0.1"

and for some reason, I'm getting weird source files.

.tmp/mocha-webpack/1537879911832/webpack:/src                            
|    61.18 |    29.63 |    64.29 |    61.18 |                   |
  db.js    

I'm wondering how this is generated because exclude doesn't work

"nyc": {
    "exclude": [
        "./tmp/**/*"
    ],
}

Here's my webpack file

var nodeExternals = require("webpack-node-externals")
const path = require("path")
const webpack = require("webpack")

const webpackConfig = {
    mode: "none",
    context: path.resolve(__dirname),
    resolve: {
        extensions: [".js"],
        alias: {
            "#": path.join(__dirname, "../src"),
        }
    },
    output: {
        // use absolute paths in sourcemaps (important for debugging via IDE)
        devtoolModuleFilenameTemplate: "[absolute-resource-path]",
        devtoolFallbackModuleFilenameTemplate: "[absolute-resource-path]?[hash]"
    },
    devtool: "inline-cheap-module-source-map",
    plugins: [
        new webpack.NamedModulesPlugin()
    ],
    target: "node", // webpack should compile node compatible code
    externals: [nodeExternals()], // in order to ignore all modules in node_modules folder
}

module.exports = webpackConfig

Answer 1

I got it working by reading this manual: https://github.com/vuejs/vue-test-utils-mocha-webpack-example

The main trick was to install babel-plugin-istanbul and update .babelrc file:

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

And package.json looks like:

"nyc": {
    "exclude": [
      "**/tests/**/*.js",
      ".tmp/**/*.js",
      "webpack.config.js"
    ]
  }

And the webpack.config.js looks like:

var path = require('path')
var webpack = require('webpack')
const nodeExternals = require('webpack-node-externals')

module.exports = {
  entry: './src/main.js',
  output: {
    // use absolute paths in sourcemaps (important for debugging via IDE)
    devtoolModuleFilenameTemplate: '[absolute-resource-path]',
    devtoolFallbackModuleFilenameTemplate: '[absolute-resource-path]?[hash]',
  },
  resolve: {
    alias: {
      'vue$': 'vue/dist/vue.esm.js',
      '@': path.resolve(__dirname, 'src')
    }
  },
  module: {
    rules: [
      {
        test: /\.vue$/,
        loader: 'vue-loader'
      },
      {
        test: /\.js$/,
        loader: 'babel-loader',
        exclude: /node_modules/
      },
      {
        test: /\.(png|jpg|gif|svg)$/,
        loader: 'file-loader',
        options: {
          name: '[name].[ext]?[hash]'
        }
      }
    ]
  },
  devServer: {
    historyApiFallback: true,
    noInfo: true
  },
  performance: {
    hints: false
  },
  devtool: 'inline-cheap-module-source-map',
  externals: ["fs", nodeExternals()],
  mode: 'development',
  plugins: [
    new webpack.NamedModulesPlugin()
  ]
}