Angular 2单元测试编译失败茉莉花/业力

Question

有人可以提供他们对angular2项目编译单元测试错误的想法吗？

14 04 2017 22:32:56.591:WARN [karma]: No captured browser, open http://localhost:9876/ 
14 04 2017 22:32:56.627:INFO [karma]: Karma v1.6.0 server started at http://0.0.0.0:9876/ 
14 04 2017 22:32:56.628:INFO [launcher]: Launching browser Chrome with unlimited concurrency 
14 04 2017 22:32:56.678:INFO [launcher]: Starting browser Chrome 
14 04 2017 22:33:00.850:INFO [Chrome 57.0.2987 (Windows 10 0.0.0)]: Connected on socket g9NBqcx7uGTZdJXBAAAA with id 58214193 
14 04 2017 22:33:01.748:WARN [web-server]: 404: /base/systemjs.config.extras.js 
14 04 2017 22:33:03.178:WARN [web-server]: 404: /base/node_modules/rxjs/RX.js 
Chrome 57.0.2987 (Windows 10 0.0.0) ERROR 
    { 
    "originalErr": {} 
    } 

我的配置是：

卡玛测试shim.js

// #docregion 
// /*global jasmine, __karma__, window*/ 
Error.stackTraceLimit = 0; // "No stacktrace"" is usually best for app testing. 

// Uncomment to get full stacktrace output. Sometimes helpful, usually not. 
//Error.stackTraceLimit = Infinity; 

jasmine.DEFAULT_TIMEOUT_INTERVAL = 1000; 

var builtPath = '/base/'; 

__karma__.loaded = function() { }; 

function isJsFile(path) { 
    return path.slice(-3) == '.js'; 
} 

function isSpecFile(path) { 
    return /\.spec\.(.*\.)?js$/.test(path); 
} 

function isBuiltFile(path) { 
    return isJsFile(path) && (path.substr(0, builtPath.length) == builtPath); 
} 

var allSpecFiles = Object.keys(window.__karma__.files) 
    .filter(isSpecFile) 
    .filter(isBuiltFile); 

System.config({ 
    baseURL: 'base', 
    // Extend usual application package list with test folder 
    packages: { 'testing': { main: 'index.js', defaultExtension: 'js' } }, 

    // Assume npm: is set in `paths` in systemjs.config 
    // Map the angular testing umd bundles 
    map: { 
    '@angular/core/testing': 'npm:@angular/core/bundles/core-testing.umd.js', 
    '@angular/common/testing': 'npm:@angular/common/bundles/common-testing.umd.js', 
    '@angular/compiler/testing': 'npm:@angular/compiler/bundles/compiler-testing.umd.js', 
    '@angular/platform-browser/testing': 'npm:@angular/platform-browser/bundles/platform-browser-testing.umd.js', 
    '@angular/platform-browser-dynamic/testing': 'npm:@angular/platform-browser-dynamic/bundles/platform-browser-dynamic-testing.umd.js', 
    '@angular/http/testing': 'npm:@angular/http/bundles/http-testing.umd.js', 
    '@angular/router/testing': 'npm:@angular/router/bundles/router-testing.umd.js', 
    '@angular/forms/testing': 'npm:@angular/forms/bundles/forms-testing.umd.js', 
    }, 
}); 

System.import('systemjs.config.js') 
    .then(importSystemJsExtras) 
    .then(initTestBed) 
    .then(initTesting); 

/** Optional SystemJS configuration extras. Keep going w/o it */ 
function importSystemJsExtras(){ 
    return System.import('systemjs.config.extras.js') 
    .catch(function(reason) { 
    console.log(
     'Warning: System.import could not load the optional "systemjs.config.extras.js". Did you omit it by accident? Continuing without it.' 
    ); 
    console.log(reason); 
    }); 
} 

function initTestBed(){ 
    return Promise.all([ 
    System.import('@angular/core/testing'), 
    System.import('@angular/platform-browser-dynamic/testing') 
    ]) 

    .then(function (providers) { 
    var coreTesting = providers[0]; 
    var browserTesting = providers[1]; 

    coreTesting.TestBed.initTestEnvironment(
     browserTesting.BrowserDynamicTestingModule, 
     browserTesting.platformBrowserDynamicTesting()); 
    }) 
} 

// Import all spec files and start karma 
function initTesting() { 
    return Promise.all(
    allSpecFiles.map(function (moduleName) { 
     return System.import(moduleName); 
    }) 
) 
    .then(__karma__.start, __karma__.error); 
} 

karma.conf.js

// Karma configuration 

module.exports = function(config) { 
    var appBase = 'app/';  // transpiled app JS and map files 
    var appSrcBase = 'app/';  // app source TS files 
    var appAssets = '/base/app/'; // component assets fetched by Angular's compiler. all assets served up at http://localhost/base/ 


    config.set({ 
    basePath: '', 

    frameworks: ['jasmine'], 

    plugins: [ 
     require('karma-jasmine'), 
     require('karma-chrome-launcher'), 
    ], 

    files: [ 
     'node_modules/systemjs/dist/system.src.js', 

     // Polyfills 
     'node_modules/core-js/client/shim.js', 
     'node_modules/reflect-metadata/Reflect.js', 

     // zone.js 
     'node_modules/zone.js/dist/zone.js', 
     'node_modules/zone.js/dist/long-stack-trace-zone.js', 
     'node_modules/zone.js/dist/proxy.js', 
     'node_modules/zone.js/dist/sync-test.js', 
     'node_modules/zone.js/dist/jasmine-patch.js', 
     'node_modules/zone.js/dist/async-test.js', 
     'node_modules/zone.js/dist/fake-async-test.js', 

     // RxJs 
     { pattern: 'node_modules/rxjs/**/*.js', included: false, watched: false }, 
     { pattern: 'node_modules/rxjs/**/*.js.map', included: false, watched: false }, 

     // Paths loaded via module imports: 
     // Angular itself 
     { pattern: 'node_modules/@angular/**/*.js', included: false, watched: false }, 
     { pattern: 'node_modules/@angular/**/*.js.map', included: false, watched: false }, 

     { pattern: 'systemjs.config.js', included: false, watched: false }, 
     'karma-test-shim.js', 

     // transpiled application & spec code paths loaded via module imports 
     { pattern: appBase + '**/*.js', included: false, watched: true }, 

     // Asset (HTML & CSS) paths loaded via Angular's component compiler 
     // (these paths need to be rewritten, see proxies section) 
     { pattern: appBase + '**/*.html', included: false, watched: true }, 
     { pattern: appBase + '**/*.css', included: false, watched: true }, 

     // Paths for debugging with source maps in dev tools 
     { pattern: appSrcBase + '**/*.ts', included: false, watched: false }, 
     { pattern: appBase + '**/*.js.map', included: false, watched: false }, 
    ], 

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

    exclude: [ 
    ], 

    preprocessors: { 
    }, 

    reporters: ['progress'], 
    port: 9876, 
    colors: true, 
    logLevel: config.LOG_INFO, 
    autoWatch: true, 
    browsers: ['Chrome'], 
    singleRun: false, 
    concurrency: Infinity 
    }) 
} 

systemjs.config.js

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

     // angular bundles 
     '@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', 

     // other libraries 
     'rxjs': 'npm:rxjs' 
    }, 
    // packages tells the System loader how to load when no filename and/or no extension 
    packages: { 
     app: { 
     main: './main.js', 
     defaultExtension: 'js' 
     }, 
     rxjs: { 
     defaultExtension: 'js' 
     } 
    } 
    }); 
})(this); 

如果我试图编写组件测试，我收集上面的错误。谢谢。

Answer 1

尝试在代理对象中添加以下属性，以便您可以使用在其之前添加的基准别名nodeModules文件夹。

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