TypeError：index_1.Xはコンストラクタではありません - カルマ - ジャスミン - Webpack

Question

私は、ジャスミンとカルマを使ってangular2 + webpackで簡単な単体テストを実行しようとしています。以下は私のテストで：

it('my test',() => { 
    let myObject = new MyObject(); 
    myObject.name = 'My Name'; 
    expect(myObject.name).toBe('My Name'); 
}); 

私は次のエラーが表示され実行している場合：で

it('my test',() => { 
    let myObject = { 
     name = 'My Name', 
     hairColor = HairColor.Brown 
    } 
    expect(myObject.name).toBe('My Name'); 
}); 

：

TypeError: index_1.MyObject is not a constructor 

また、私は私のプロジェクトで定義された列挙型を持つシンプルなjavascriptの種類を試してみましたこの場合、次のエラーが表示されます。

TypeError: Cannot read property 'Brown' of undefined 

そのWebPACKのはカルマに正しい出力のjsファイルを提供しないよう

export class MyObject { 
    name: string; 
    family: string; 
    hairColor: HairColor; 
} 

export enum HairColor { 
    Brown, 
    Black 
} 

が見える：

これは私のオブジェクトと列挙型です。

webpack.test.js

var webpack = require('webpack'); 
var helpers = require('./helpers'); 

module.exports = { 
    devtool: 'inline-source-map', 

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

    module: { 
    rules: [ 
     { 
     test: /\.ts$/, 
     loaders: [ 
      { 
      loader: 'awesome-typescript-loader', 
      options: { configFileName: helpers.root('src', 'tsconfig.json') } 
      } , 'angular2-template-loader', 'angular-router-loader' 
     ] 
     }, 
     { 
     test: /\.html$/, 
     loader: 'html-loader' 

     }, 
     { 
     test: /\.(png|jpe?g|gif|svg|woff|woff2|ttf|eot|ico)$/, 
     loader: 'null-loader' 
     }, 
     { 
     test: /\.css$/, 
     exclude: helpers.root('src', 'app'), 
     loader: 'null-loader' 
     }, 
     { 
     test: /\.css$/, 
     include: helpers.root('src', 'app'), 
     loader: 'raw-loader' 
     } 
    ] 
    }, 

    plugins: [ 
    new webpack.ContextReplacementPlugin(
     // The (\\|\/) piece accounts for path separators in *nix and Windows 
     /angular(\\|\/)core(\\|\/)(esm(\\|\/)src|src)(\\|\/)linker/, 
     helpers.root('./src'), // location of your src 
     {} // a map of your routes 
    ) 
    ] 
} 

karma.config.js

var webpackConfig = require('./webpack.test'); 

module.exports = function (config) { 
    var _config = { 
    basePath: '', 

    frameworks: ['jasmine'], 

    files: [ 
     {pattern: './karma-test-shim.js', watched: false} 
    ], 

    preprocessors: { 
     './karma-test-shim.js': ['webpack', 'sourcemap'] 
    }, 

    webpack: webpackConfig, 

    webpackMiddleware: { 
     stats: 'errors-only' 
    }, 

    webpackServer: { 
     noInfo: true 
    }, 

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

    config.set(_config); 
}; 

カルマ・テストshim.js

：以下は私の設定ファイルがあります

Error.stackTraceLimit = Infinity; 

require('core-js/es6'); 
require('core-js/es7/reflect'); 

require('zone.js/dist/zone'); 
require('zone.js/dist/long-stack-trace-zone'); 
require('zone.js/dist/proxy'); 
require('zone.js/dist/sync-test'); 
require('zone.js/dist/jasmine-patch'); 
require('zone.js/dist/async-test'); 
require('zone.js/dist/fake-async-test'); 

var appContext = require.context('../src', true, /\.spec\.ts/); 

appContext.keys().forEach(appContext); 

var testing = require('@angular/core/testing'); 
var browser = require('@angular/platform-browser-dynamic/testing'); 

testing.TestBed.initTestEnvironment(browser.BrowserDynamicTestingModule, browser.platformBrowserDynamicTesting()); 

Answer 1

問題は、私がバレルからMyObjectとHairColorをインポートしていたことでした！次のように：

import { HairColor } from '../index'; 

自分のファイルからインポートするように変更しました。問題は解決しました。

import { HairColor } from '../enums/hair-color.enum';