Question

我当前正在使用：

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

出于某种原因，我得到了奇怪的源文件。

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

我想知道这是怎么产生的，因为排除不起作用

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

这是我的webpack文件

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

我通过阅读以下手册来使它正常工作：https://github.com/vuejs/vue-test-utils-mocha-webpack-example

主要的技巧是安装babel-plugin-istanbul和更新.babelrc文件：

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

package.json如下：

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

webpack.config.js如下：

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()
  ]
}

使用.tmp文件夹的Webpack 4的nyc

1 个答案: