如何将mocha测试文件与webpack进程集成?

时间:2018-01-25 14:48:55

标签: javascript mocha

我有一个JS类,我想编写测试。我安装了mocha。在项目根目录中创建了一个文件test.js。我现在可以像这样运行测试

var assert = require('assert');

describe('Arithmetic', function() {
    describe('Plus', function() {
        it('1 + 1 equals 2', function() {
        assert.equal(1+1, 2);
        });
    });
});

一切都好!我不确定的是如何测试我的文件,因为它包含很多ES6的东西。例如,像 import someDependency from 'resources/assets/js/someDependencyToMyClass';

如何让mocha知道我的package.json / webpack进程?或者我应该只测试我的代码的转换版本?

<小时/> 我试图自己设置一个测试类并运行节点,但后来我绕过了所有的babel东西,所以它不会工作。除了我的SPA(反应)之外,我还考虑过制作一个测试页面,但我不会混淆实际的代码。你会怎么做?

此外,如有必要,这是我的项目package.json。

{
    "private": true,
    "scripts": {
        "dev": "npm run development",
        "development": "cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js",
        "watch": "cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --watch --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js",
        "watch-poll": "npm run watch -- --watch-poll",
        "hot": "cross-env NODE_ENV=development node_modules/webpack-dev-server/bin/webpack-dev-server.js --inline --hot --config=node_modules/laravel-mix/setup/webpack.config.js",
        "prod": "npm run production",
        "production": "cross-env NODE_ENV=production node_modules/webpack/bin/webpack.js --no-progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js"
    },
    "devDependencies": {
        "axios": "^0.17",
        "babel-preset-react": "^6.23.0",
        "cross-env": "^5.1",
        "jquery": "^3.2",
        "laravel-mix": "^1.0",
        "lodash": "^4.17.4",
        "mocha": "^5.0.0",
        "react": "^15.4.2",
        "react-dom": "^15.4.2",
        "testing": "^1.1.1"
    },
    "dependencies": {
        "bootstrap": "^4.0.0",
        "popper.js": "^1.12.9",
        "react-redux": "^5.0.6",
        "redux": "^3.7.2"
    }
}

1 个答案:

答案 0 :(得分:0)

您可能需要提取mocha-webpackhttps://github.com/zinserjan/mocha-webpack),以便根据您的webpack配置预编译您的代码。 然后,您可以在package.json中创建一个指向您的webpack配置的测试脚本,如下所示:

"scripts": { "test": "mocha-webpack --webpack-config=webpack.config.js tests/*.js" }

运行npm test然后会正确预编译您的代码。希望它能指出你正确的方向。