Question

我的Karma cannont加载角度2组件。删除此错误：

Min()

我用角度2测试教程做任何事情（我只修改了业力路径）所以问题必须在路径中。但我不知道如何解决它。

我的道路：

[web-server] :404 : /base/src/client/app/container/container.component

container.component.ts

src
|    |client
|    |   |container
|    |   |   |container.component.ts
|    |   |   |container.component.spec.ts
|karma.conf.js
|karma-test-shim.js

container.component.spec.ts

import { Component, OnInit } from '@angular/core';
import { UserService } from '../user/user.service';
import { User } from '../user/user';
//import { FacebookLogin } from '../facebook/fb-login';
//import { Facebook } from '../facebook/facebook';

@Component({
    selector: 'app-container',
    //templateUrl: '../../views/content.html',
    template: `Hello World`,
    providers: [UserService]
})
export class ContainerComponent implements OnInit{
     user: User;
    // constructor(private userService: UserService) {
    //     this.loadUser();
    //     if(typeof FB == 'undefined') {console.log("NULL");}
    // }


    // loadUser() {
    //     this.userService.getMockUser().then(userData => 
    //     {
    //         this.user = userData
    //         console.log("User data: " + userData.email);
    //     });
    // }

    ngOnInit(){

    }


}

karma.conf.js

import { ComponentFixture, TestBed, async } from '@angular/core/testing';
import { By } from '@angular/platform-browser';
import { DebugElement } from '@angular/core';

import { ContainerComponent } from './container.component';

let comp: ContainerComponent;
let fixture: ComponentFixture<ContainerComponent>;
let de: DebugElement;
let el: HTMLElement;

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

    //     fixture = TestBed.createComponent(ContainerComponent);
    //     comp = fixture.componentInstance;

    // }));

    beforeEach(() => {
        TestBed.configureTestingModule({
            declarations: [ContainerComponent], // declare the test component
        });



    });

});

Answer 1

我最近遇到了同样的问题，我得出的结论是SystemJS负责默认扩展（应该是'js'）。确保您的ng2 app文件夹与systemjs.config文件正确连接。

(function (global) {
  System.config({
    paths: {
      // paths serve as alias
      'npm:': 'node_modules/'
    },
    // map tells the System loader where to look for things
    map: {
      // app is within the app folder
      app: 'app', <<<<<<<------ HERE

      '@angular/core': 'npm:@angular/core/bundles/core.umd.js',
      '@angular/common': 'npm:@angular/common/bundles/common.umd.js',
      '@angular/compiler': 'npm:@angular/compiler/bundles/compiler.umd.js',
      '@angular/platform-browser': 'npm:@angular/platform-browser/bundles/platform-browser.umd.js',
      '@angular/platform-browser-dynamic': 'npm:@angular/platform-browser-dynamic/bundles/platform-browser-dynamic.umd.js',
      '@angular/http': 'npm:@angular/http/bundles/http.umd.js',
      '@angular/router': 'npm:@angular/router/bundles/router.umd.js',
      '@angular/forms': 'npm:@angular/forms/bundles/forms.umd.js',
      '@angular/upgrade': 'npm:@angular/upgrade/bundles/upgrade.umd.js',

      // other libraries
      'rxjs':                       'npm:rxjs',
      'angular-in-memory-web-api':  'npm:angular-in-memory-web-api'
    },
    packages: {
      app: { <<<<<<<------ HERE
        main: './main.js',
        defaultExtension: 'js' <<<<<<----- Important!!
      },
      rxjs: {
        defaultExtension: 'js'
      },
      'angular-in-memory-web-api': {
        main: 'server/server.js',
        defaultExtension: 'js'
      }
    }
  });
})(this);

如果这是正确的并且仍然存在问题，那么您的业力网络服务器和节点服务器如何为您的客户端文件提供服务的方式可能不一致。您可以在karma.conf文件中添加代理...

proxies: {
  // required for component assets fetched by Angular's compiler
  "/app/": "/base/client/app/"
},

希望这有帮助！ C：

Karma无法加载Angular 2 Component

1 个答案: