使用karma-webpack插件

时间:2017-02-06 13:13:24

标签: typescript webpack karma-runner karma-webpack

我正在尝试使用karma-webpack来构建我的打字稿测试以用于业力。

最近我的测试已停止运行。在开发人员控制台中,有这样的行,对应于包含我的测试的每个文件:

  

来自“http://localhost:9876/base/tests/testFile.ts?[HASH]”的脚本由于不允许的MIME类型而被阻止

这样的脚本标签是由业力生成的:

<script type="text/javascript" src="/base/tests/testFile.ts?[HASH]" crossorigin="anonymous"></script>

(在这两种情况下,[HASH]对应一个时间戳)

如果我查看与错误消息相关的文件,看起来编译成功 - 每个文件都包含typescript编译器生成的JS,以及所有与webpack相关的东西。

我的业力配置如下:

module.exports = function (config) {
    config.set({
        plugins: [
            require('karma-firefox-launcher'),
            require('karma-webpack'),
            require('karma-tap')
        ],

        basePath: '',
        frameworks: ['tap'],
        files: ['tests/**/*.ts'],

        preprocessors: {
            'tests/**/*.ts': ['webpack']
        },

        webpack: {
            module: {
                rules: [
                    {
                        test: /\.tsx?$/,
                        exclude: /node_modules/,
                        use: [
                            "babel-loader",
                            "ts-loader"
                        ]
                    }
                ]
            },
            resolve: {
                extensions: [".webpack.js", ".web.js", ".js", ".ts", ".tsx", ".css"]
            },
            node: {
                fs: 'empty'
            }
        },

        reporters: ['progress'],
        port: 9876,
        colors: true,
        logLevel: config.LOG_INFO,
        autoWatch: true,
        browsers: ['Firefox'],
        singleRun: false
    });
};

我尝试过使用Chromium而不是Firefox但是我遇到了类似的错误,所以我猜这个问题不是特定于浏览器的。

如何阻止脚本被阻止并让我的测试再次运行?

包装版本:

"karma": "1.4.1",
"karma-firefox-launcher": "1.0.0",
"karma-tap": "3.1.1",
"karma-webpack": "2.0.2",
"ts-loader": "2.0.0",
"typescript": "2.2.0",
"webpack": "2.2.1",

1 个答案:

答案 0 :(得分:5)

我找到了couple issues,建议将其添加到karma配置文件中:

mime: {
    "text/x-typescript": ["ts", "tsx"]
}

现在我的测试在Firefox和Chrome中再次运行。