时间戳

首页 > 解决方案 > 如何使用 webpack 运行单元测试？

javascript - 如何使用 webpack 运行单元测试？

问题描述

我有一个与 webpack 捆绑在一起的 Node Js 服务器，配置如下：

module.exports = {
    entry: './build/index.js',
    output: {
        filename: 'main.js',
        path: path.resolve(__dirname, 'dist'),
        devtoolModuleFilenameTemplate: '../[resource-path]',
    },

    target: 'node',
    node: {
        __dirname: true,
    },
    externals: {
        kcors: 'kcors',
        'koa-bodyparser': 'koa-bodyparser'
    },
    module: {
        rules: [
            {
                test: /\.js$/,
                use: ["source-map-loader"],
                enforce: "pre"
            },
        ],
    },
    resolve: {
        extensions: ['.js'],
    },
    // plugins: [
    //     new webpack.DefinePlugin({
    //         "process.env": JSON.stringify(dotenv.parsed)
    //     }),
    // ],
    devtool: 'eval-source-map'
};

main.js这在里面创建了一个文件dist

到目前为止一切看起来都不错。我手动测试了服务器并且它工作正常。

现在，在我使用 webpack 之前，我有一组单元测试，我.spec.js在我的入口文件夹（build/文件夹）中使用后缀命名，并且每个.js文件都有各自的.spec同级文件，位于.js.

为了运行这些单元测试，我使用 mocha 和命令：mocha build/**/*.spec.js --recursive --timeout 20000

由于我是 webpack 和捆绑概念的新手，如何从main.js文件中运行相同的测试？我想确保所有测试仍在捆绑文件中传递

标签： javascriptnode.jsunit-testingwebpackmocha.js

解决方案

利用

npm install mocha mocha-loader

配置你的 webpack.config.js 文件，如：

module.exports = {
entry: './entry.js',
output: {
 path: __dirname,
 filename: 'bundle.js',
},
module: {
 rules: [
   {
     test: /test\.js$/,
     use: 'mocha-loader',
     exclude: /node_modules/,
   },
 ],
},
};

然后，从您的主文件中调用您的测试文件，例如：（进入 app.js）

import test from 'allMyTests';

推荐阅读