引用错误：Can'；t find变量：require-Angular 2 RC4+；因果报应+；茉莉花&x2B；幻影，

我已经成功地实现了一个概念验证工作应用程序，设置如下

ASP.NET核心+角度2 rc4

应用程序运行良好，所有角度2位都正常

然后我添加了Karma+Jasmine，以便在编写任何严肃的业务代码之前开始使用Angular 2的一些TDD

我的问题是因果报应+茉莉花（+幻影）

当我在没有使用Angular 2的情况下用TypeScript编写测试时，Karma+Jasmine工作得很好，在控制台上，我得到了通过或失败测试的列表

然而，我最近为Angular 2组件编写了一个单元测试，该组件使用服务。在单元测试中，我模拟了服务

Karma+Jasmine+PhantomJS现在输出到控制台

信息[karma]：karma v1.1.2服务器在…启动

信息[launcher]：以无限并发方式启动浏览器PhantomJS

信息[launcher]：启动浏览器PhantomJS

信息[PhantomJS 2.1.1（Windows 7 0.0.0）]：连接在插座上

PhantomJS 2.1.1（Windows 7 0.0.0）错误 ReferenceError:找不到变量：require 在wwwroot/js/tests/quote/quote.component.spec.js:2

当我查看单元测试的最小版本的传输代码时，我只是尝试让Angular 2注册提供程序来创建模拟，而不是其他

"use strict";
var testing_1 = require("@angular/core/testing");
var quote_service_ts_1 = require("../../app/quote/quote.service.ts");
var MockQuoteService = (function () {
    function MockQuoteService() {
        this.quote = "Quote from the mocked test QuoteService";
    }
    MockQuoteService.prototype.getQuote = function () {
        return this.quote;
    };
    return MockQuoteService;
}());
describe("Test Quote Component", function () {
    var builder;
    beforeEach(function () {
        testing_1.addProviders([
            { QuoteService: quote_service_ts_1.QuoteService, useClass: MockQuoteService },
        ]);
    });

    it("should pass", function () { return expect(false).toEqual(false); });
    it("should fail", function () { return expect(false).toEqual(true); });
});

我看到了幻影被卡住的地方

var testing_1 = require("@angular/core/testing");

我的tConfig

{
"compileOnSave": false,
"compilerOptions": {
    "noImplicitAny": true,
    "noEmitOnError": true,
    "removeComments": false,
    "sourceMap": true,
    "target": "es5",
    "module": "commonjs",
    "moduleResolution": "node",
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "outDir": "./wwwroot/js"       
},
"exclude": [
    "node_modules",
    "wwwroot",
    "typings",
    "typings/globals",
    "typings/modules",
    "typings/index.d.ts"
]

}

我指示TypeScript传输到ES5，我假设这就是为什么上面的单元测试在将Angular 2拉入图片时使用require对象的原因。 单元测试的类型脚本如下所示

 import {
    inject,
    // async,
    addProviders,
    // fakeAsync,
    // tick,
    ComponentFixture,
    TestComponentBuilder,
} from "@angular/core/testing";
import {QuoteComponent} from "../../app/quote/quote.component.ts";
import {QuoteService} from "../../app/quote/quote.service.ts";

class MockQuoteService {

    public quote: string = "Quote from the mocked test QuoteService";

    public getQuote() {
        return this.quote;
    }
}

describe("Test Quote Component", function () {

    let builder: TestComponentBuilder;

    beforeEach(() => {
        addProviders([
            { QuoteService, useClass: MockQuoteService },
        ]);
    });
it("should pass",
        () => expect(false).toEqual(false)
    );

    it("should fail",
        () => expect(false).toEqual(true)
    );

});

这是我的karma.conf.js

// Karma configuration
// Generated on Thu Aug 04 2016 15:44:51 GMT+0100 (GMT Daylight Time)

module.exports = function(config) {
  config.set({

    // base path that will be used to resolve all patterns (eg. files, exclude)
    basePath: '',


    // frameworks to use
    // available frameworks: https://npmjs.org/browse/keyword/karma-adapter
    frameworks: ['jasmine'],


    // list of files / patterns to load in the browser
    files: [
     "wwwroot/js/tests/**/*.js"
    ],


    // list of files to exclude
    exclude: [
      '**/*.swp'
    ],


    // preprocess matching files before serving them to the browser
    // available preprocessors: https://npmjs.org/browse/keyword/karma-preprocessor
    preprocessors: {
    },


    // test results reporter to use
    // possible values: 'dots', 'progress'
    // available reporters: https://npmjs.org/browse/keyword/karma-reporter
    reporters: ['progress'],


    // web server port
    port: 9876,


    // enable / disable colors in the output (reporters and logs)
    colors: true,


    // level of logging
    // possible values: config.LOG_DISABLE || config.LOG_ERROR || config.LOG_WARN || config.LOG_INFO || config.LOG_DEBUG
    logLevel: config.LOG_INFO,


    // enable / disable watching file and executing tests whenever any file changes
    autoWatch: true,


    // start these browsers
    // available browser launchers: https://npmjs.org/browse/keyword/karma-launcher
    //browsers: ['Chrome'],
    browsers: ['PhantomJS'],


    // Continuous Integration mode
    // if true, Karma captures browsers, runs the tests and exits
    singleRun: false,

    // Concurrency level
    // how many browser should be started simultaneous
    concurrency: Infinity
  })
}

PhantomJS找不到require-好的，我明白了

我如何通过因果报应告诉幻影在哪里找到“需要”

我应该安装类似的东西吗

因果报应

然后按照这样的方式

?

我说得对吗

我的Angular 2 RC4使用Karma+Jasmine+PhantomJS（或其他浏览器）和TDD的方法正确吗

将上面的单元测试传输到引用所需的JavaScript是正确的吗

坦白地说，我有点困惑整个事情应该如何正确地设置和一起工作，因为没有一个明确的食谱，我可以从中复制。我通过反复试验来解决问题，在一步一步地解决问题的同时，尽可能少地使用所需的资源来完成工作

最后一件事。假设告诉PhantomJS在哪里可以找到requirejs，我怀疑karma.config.js应该变成 跟随

// frameworks to use
// available frameworks: https://npmjs.org/browse/keyword/karma-adapter
frameworks: ['jasmine', 'requirejs'],


// list of files / patterns to load in the browser
files: [
 ....some angular 2 references from the node_modules\@angular ????
 "wwwroot/js/tests/**/*.js"
],

这是正确的吗

我需要对节点\ U模块\ angular的哪些引用（Angualr 2 rc4）

---

非常感谢

你找到答案了吗？我也有同样的问题。。。