ОШИБКА при попытке запустить тест кармы

Question

У меня проблемы с настройкой кармы с Angular 5.2.0 (без Cli)

Приложение Angular работает, но проблема в карме, когда я пытаюсь запустить тест, я получаю эту ОШИБКУ:

начало кармы Хэш: ccc4545dd1d9416a823b Версия: webpack 3.10.0 Время: 58 мс Веб-пакет: успешно скомпилирован. 13 01 2018 15:34:59.123: ПРЕДУПРЕЖДЕНИЕ [карма]: нет захваченного браузера, откройте http://localhost:9876/ 01 2018 15:34:59.134: ИНФОРМАЦИЯ [карма]: сервер Karma v2.0.0 запущен с http://0.0.0.0:9876/ 13 01 2018 15: 34: 59.136: INFO [launcher]: запуск браузера Chrome с неограниченным параллелизмом 13 01 2018 15:34:59.147:INFO [launcher]: запуск браузера Chrome 13 01 2018 15:35:00.726:INFO [Chrome 63.0.3239 (Windows 10 0.0.0)]: подключен к сокету 37NRWsbdgw5x2CTBAAAA с идентификатором 42149942 Chrome 63.0.3239 (Windows 10 0.0.0) ERROR { "message": "Uncaught SyntaxError: неожиданный токен {\nat src/app/app.component.spec.ts:2:8\n\nSyntaxError: неожиданный токен {", "str": "Uncaught SyntaxError: неожиданный токен {\ nat src / app / app.component.spec. ts: 2: 8 \ n \ nSyntaxError: неожиданный токен {" }

Сначала я получил эту ОШИБКУ с видео /mp2t, поэтому я добавил исправление MIME. И теперь я получил вышеупомянутую ОШИБКУ. Кажется, что карма не разрешает TS или что-то еще, потому что я проверил файл.spec.ts только с одним импортом и все еще получаю ту же ошибку.

app.component.spec.ts

import { TestBed, async } from '@angular/core/testing';
import { AppComponent } from './app.component';

describe('AppComponent', () => {
  beforeEach(async(() => {
    TestBed.configureTestingModule({
      declarations: [
        AppComponent
      ],
    }).compileComponents();
  }));

  it('should create the app', async(() => {
    const fixture = TestBed.createComponent(AppComponent);
    const app = fixture.debugElement.componentInstance;
    expect(app).toBeTruthy();
  }));


  it('should display the header text "Welcome to Momentz4Ever"', async(() => {
    const fixture = TestBed.createComponent(AppComponent);
    fixture.detectChanges();
    const compiled = fixture.debugElement.nativeElement;
    expect(compiled.querySelector('h1').textContent).toContain('Welcome to Momentz4Ever');
  }));
});

tsconfig.ts

{
    "compileOnSave": false,
    "compilerOptions": {
        "module": "commonjs",
        "target": "es5",
        "noImplicitAny": false,
        "sourceMap": true,
        "baseUrl": "src",
        "outDir": "./dist",
        "declaration": false,
        "emitDecoratorMetadata": true,
        "experimentalDecorators": true,
        "moduleResolution": "node",
        "typeRoots": [
            "node_modules/@types"
        ],
        "lib": [
            "es2016",
            "dom"
        ],
        "types": [
            "node",
            "jasmine"
        ]
    },
    "awesomeTypeScriptLoaderOptions": {
        "useWebpackText": true
    }
}

webpack.config.ts

const path = require('path');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const { ContextReplacementPlugin } = require('webpack');

module.exports = {
    entry: {
        main: './src/index.ts'
    },
    output: {
        path: path.join(__dirname, "../dist/"),
        filename: "[name].bundle.js",
    },
    resolve: {
        extensions: ['.js', '.ts', '.html']
    },
    devServer: {
        contentBase: path.join(__dirname, "../dist/"),
        port: 9000
    },
    devtool: 'inline-source-map',
    module: {
        loaders: [
            { test: /.ts$/, use: ['awesome-typescript-loader', 'angular2-template-loader'] },
            { test: /.html$/, use: 'raw-loader' }
        ]
    },
    plugins: [
        new HtmlWebpackPlugin({
            template: "./src/index.html",
            filename: "index.html",
            showErrors: true,
            title: "Webpack App",
            path: path.join(__dirname, "../dist/"),
            hash: true
        }),
        new ContextReplacementPlugin(            
            /\@angular(\\|\/)core(\\|\/)esm5/,
            path.resolve(__dirname, 'src')
        )

    ]
}

karma.conf.ts

module.exports = function(config) {
  config.set({    
    basePath: '',    
    frameworks: ['jasmine'],
    files: [      
      { pattern: './src/app/app.component.spec.ts' }
    ],
    plugins: [
      require('karma-jasmine'),
      require('karma-chrome-launcher'),
      require('karma-jasmine-html-reporter'),
      require('karma-webpack'),
      require('karma-sourcemap-loader'),
    ],        
    preprocessors: {
      './src/test.ts': ['webpack', 'sourcemap']
    },
    mime: {
      'text/x-typescript': ['ts','tsx']
    },    
    reporters: ['progress'],    
    port: 9876,
    colors: true,
    logLevel: config.LOG_INFO,
    autoWatch: true,
    browsers: ['Chrome'],
    singleRun: false,
    concurrency: Infinity
  })
}

package.json

{
  "name": "",
  "version": "0.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "test": "karma start",
    "build": "webpack-dev-server --config webpack.config.js"
  },
  "author": "",
  "license": "ISC",
  "dependencies": {
    "@angular/common": "^5.2.0",
    "@angular/compiler": "^5.2.0",
    "@angular/core": "^5.2.0",
    "@angular/forms": "^5.2.0",
    "@angular/http": "^5.2.0",
    "@angular/platform-browser": "^5.2.0",
    "@angular/platform-browser-dynamic": "^5.2.0",
    "@angular/router": "^5.2.0",
    "core-js": "^2.5.3",
    "rxjs": "^5.5.6",
    "zone.js": "^0.8.20"
  },
  "devDependencies": {
    "@types/jasmine": "^2.8.4",
    "@types/node": "^9.3.0",
    "angular2-template-loader": "^0.6.2",
    "awesome-typescript-loader": "^3.4.1",
    "css-loader": "^0.28.8",
    "extract-text-webpack-plugin": "^3.0.2",
    "file-loader": "^1.1.6",
    "html-webpack-plugin": "^2.30.1",
    "jasmine": "^2.8.0",
    "jasmine-core": "^2.8.0",
    "karma": "^2.0.0",
    "karma-cli": "^1.0.1",
    "karma-jasmine": "^1.1.1",
    "karma-sourcemap-loader": "^0.3.7",
    "karma-typescript": "^3.0.9",
    "karma-webpack": "^2.0.9",
    "node-sass": "^4.7.2",
    "raw-loader": "^0.5.1",
    "sass-loader": "^6.0.6",
    "style-loader": "^0.19.1",
    "ts-loader": "^3.2.0",
    "tslint": "^5.9.1",
    "typescript": "^2.6.2",
    "url-loader": "^0.6.2",
    "webpack": "^3.10.0",
    "webpack-dev-server": "^2.10.1"
  }
}