业力打字稿未加载模板和样式

时间:2019-04-25 18:45:47

标签: angular typescript karma-jasmine karma-typescript

karma-typescript不会像webpack那样编译我的玉器或Sass文件。如何获得要编译的模板以便可以测试?

获取以下两个文件:

messages.ts

import { Component }     from '@angular/core';

@Component({
  selector: 'messages',
  template: require('./messages.jade'),
  styles: [require('./messages.scss').toString()],
})
export class MessagesComponent {

  constructor() {}

}

mesages.spec.ts

import { TestBed, async, inject, ComponentFixture } from '@angular/core/testing';
import { RouterTestingModule } from '@angular/router/testing';
import { MessagesComponent } from './messages'

describe('MessagesComponent', () => {
    let component: MessagesComponent;
    let fixture:   ComponentFixture<MessagesComponent>;

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

      fixture = TestBed.createComponent(MessagesComponent);
      component = fixture.componentInstance;

    }));

    it('should be defined', () => {
        expect(component).toBeDefined();
    })
  });

我的 webpack.config.js 具有以下规则:

    rules: [
      { test: /\.ts$/, use: ['ts-loader', 'angular2-template-loader'] },
      { test: /\.html$/, use: 'html-loader' },
      { test: /\.(png|jpe?g|gif|svg|woff|woff2|ttf|eot|ico)$/, use: 'null-loader' },
      { test: /\.css$/, use: 'css-loader' },
      { test: /\.jade$/, use: ['html-loader', 'jade-html-loader'] },
      { test: /\.scss$/, use: ['style-loader', 'css-loader', 'resolve-url-loader', 'sass-loader'] }
    ]

运行karma时,出现以下错误:

Failed: This test module uses the component MessagesComponent which is using a "templateUrl" or "styleUrls", but they were never compiled. Please call "TestBed.compileComponents" before your test.

0 个答案:

没有答案