Question

我正在使用Webpack进行应用和测试（使用https://github.com/webpack/karma-webpack）。该应用程序使用打字稿和Babel中的测试。

在测试中从独立模块导入内容（使用import { cleanHTML, fromHTML, toHTML } from "../../app/utils/text.ts";，即我需要提及.ts扩展名，否则会失败）。

当我实际尝试导入一个导入另一个文件中的组件的React组件时，我收到以下错误： Module not found: Error: Cannot resolve 'file' or 'directory' ./blocks/paragraph。

目录树如下：

src/
  app/
    components/
      blocks/
        paragraph.ts
    main.ts
  tests/
    components/
       main_tests.js
    utils/

并且main.ts导入了像import { ParagraphBlockComponent } from "./blocks/paragraph";

这样的paragraph.ts

正常编译有效但不是测试。这是业力配置：

var path = require('path');

module.exports = function (config) {

config.set({
    basePath: 'src',
    singleRun: true,
    frameworks: ['mocha', 'chai'],
    reporters: ['dots'],
    browsers: ['Firefox'],
    files: [
        'tests/index.js'
    ],
    preprocessors: {
        'tests/index.js': ['webpack']
    },
    webpack: {
        noInfo: true,
        module: {
            loaders: [
                {
                    test: /\.ts$/,
                    loaders: ['awesome-typescript-loader']
                },
                {
                    test: /\_tests.js$/,
                    loaders: ['babel-loader']
                }
            ]
        }
    },
    webpackMiddleware: {
        noInfo: true,
        stats: {
            color: true,
            chunkModules: false,
            modules: false
        }
    }
});

};

我错过了什么吗？

Answer 1

将以下内容添加到karma webpack配置中为我修复了

resolve: {
    extensions: ['', '.js', '.ts']
},

Webpack Karma无法解析本地导入

1 个答案: