Question

我使用Angular模板创建了默认的ASP.NET核心Web应用程序（文件 - ＆gt;新项目 - ＆gt; Visual C＃ - ＆gt; .NET Core）。这是VS 2017中使用.NET Core 2的100％开箱即用模板，我没有任何更改。它在ClientApp / app / components / counter / counter.components.spec.ts中已有一个JS测试文件，我想让Chutzpah在这个项目上工作。

我是.NET Core和Webpack的新手（但不是Chutzpah或jasmine测试）。据我所知，在这个项目中，webpack从typescript文件在./wwwroot/dist/main-client.js生成一个捆绑的js文件，它在运行时而不是编译时执行。老实说，我对于webpack在运行时启动的原因感到困惑。

似乎几乎所有关于使用Chutzpah的常见示例和问题都涉及一个项目，其中每个.ts文件在同一文件夹中都有相应的.js编译文件。但是这个默认项目不会这样做;它在运行时将TS编译为JS，并将所有内容捆绑在一起进行无缝操作。我喜欢这种设置，真的不想摆脱它;它很干净。

但是对于我的生活，我甚至不能猜测如何编写一个chutzpah.json配置文件，它将在这种情况下工作。 我从哪里开始？我看过compilation samples from the chutzpah project，这个默认配置和样本正在做的事情之间存在很多差异，我不知道如何继续前进。

作为参考，测试文件component.spec.ts的内容如下所示。

/// <reference path="../../../../node_modules/@types/jasmine/index.d.ts" />
import { assert } from 'chai';
import { CounterComponent } from './counter.component';
import { TestBed, async, ComponentFixture } from '@angular/core/testing';

let fixture: ComponentFixture<CounterComponent>;

describe('Counter component', () => {
    beforeEach(() => {
        TestBed.configureTestingModule({ declarations: [CounterComponent] });
        fixture = TestBed.createComponent(CounterComponent);
        fixture.detectChanges();
    });

    it('should display a title', async(() => {
        const titleText = fixture.nativeElement.querySelector('h1').textContent;
        expect(titleText).toEqual('Counter');
    }));

    it('should start with count 0, then increments by 1 when clicked', async(() => {
        const countElement = fixture.nativeElement.querySelector('strong');
        expect(countElement.textContent).toEqual('0');

        const incrementButton = fixture.nativeElement.querySelector('button');
        incrementButton.click();
        fixture.detectChanges();
        expect(countElement.textContent).toEqual('1');
    }));
});

使用Chutzpah，其中WebPack将ts编译为单个js文件

0 个答案: