加入收藏 | 设为首页 | 会员中心 | 我要投稿 李大同 (https://www.lidatong.com.cn/)- 科技、建站、经验、云计算、5G、大数据,站长网!
当前位置: 首页 > 综合聚焦 > 服务器 > 安全 > 正文

获得Karma使用SystemJS,Angular2和Typescript的问题

发布时间:2020-12-17 07:37:25 所属栏目:安全 来源:网络整理
导读:我正面临着获得Karma与SystemJS,Angular2和Typescript一起工作的问题. 这是我的karma.conf.js: 'use strict';module.exports = function (config) { config.set({ // base path,that will be used to resolve files and exclude basePath: '.',// framework
我正面临着获得Karma与SystemJS,Angular2和Typescript一起工作的问题.

这是我的karma.conf.js:

'use strict';
module.exports = function (config) {
    config.set({

        // base path,that will be used to resolve files and exclude
        basePath: '.',// frameworks to use
        frameworks: ['systemjs','jasmine'],plugins: ['karma-systemjs','karma-jasmine','karma-phantomjs-launcher'],files: [
            'node_modules/reflect-metadata/Reflect.js','app/**/*.spec.ts',//'jspm_packages/system-polyfills.js','karma-test-shim.js'
        ],systemjs: {
            configFile: "systemjs.config.js",config: {
                //baseURL: ".",transpiler: "typescript",paths: {
                    "systemjs": "jspm_packages/system.js","system-polyfills": "jspm_packages/system-polyfills.js","typescript": "node_modules/typescript/lib/typescript.js"
                },packages: {
                    'app': {
                        defaultExtension: 'ts'
                    }
                }
            },includeFiles: [
                'node_modules/reflect-metadata/Reflect.js'
            ],serveFiles: [
                'app/**/*.ts','main-bundle.js'
            ]
        },// proxied base paths
        proxies: {
            // required for component assets fetched by Angular's compiler
            "/app/": "/base/app/","/jspm_packages/": "/base/jspm_packages/","/node_modules/": "/base/node_modules/"
        },// list of files to exclude
        exclude: [],// 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_DEBUG,// enable / disable watching file and executing tests whenever any file changes
        autoWatch: false,// Start these browsers,currently available:
        // - Chrome
        // - ChromeCanary
        // - Firefox
        // - Opera
        // - Safari (only Mac)
        // - PhantomJS
        // - IE (only Windows)
        browsers: ['PhantomJS'],// If browser does not capture in given timeout [ms],kill it
        captureTimeout: 60000,// Continuous Integration mode
        // if true,it capture browsers,run tests and exit
        singleRun: true
    });
};

我的karma-test-shim.js:

/*global jasmine,__karma__,window*/
Error.stackTraceLimit = Infinity;
jasmine.DEFAULT_TIMEOUT_INTERVAL = 1000;

__karma__.loaded = function () {
};


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

function isSpecFile(path) {
    return path.slice(-8) == '.spec.js';
}

function isBuiltFile(path) {
    var builtPath = '/base/app/';
    return isJsFile(path) && (path.substr(0,builtPath.length) == builtPath);
}

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

// Load our SystemJS configuration.
System.config({
    baseURL: '/base'
});

System.config(
    {
        map: {
            'rxjs': 'node_modules/rxjs','@angular': 'node_modules/@angular','app': 'app'
        },packages: {
            'app': {
                main: 'main.js',defaultExtension: 'js'
            },'@angular/core': {
                main: 'index.js','@angular/compiler': {
                main: 'index.js','@angular/common': {
                main: 'index.js','@angular/platform-browser': {
                main: 'index.js','@angular/platform-browser-dynamic': {
                main: 'index.js','rxjs': {
                defaultExtension: 'js'
            }
        }
    });

Promise.all([
    System.import('@angular/core/testing'),System.import('@angular/platform-browser-dynamic/testing')
]).then(function (providers) {
    var testing = providers[0];
    var testingBrowser = providers[1];

    testing.setBaseTestProviders(testingBrowser.TEST_BROWSER_DYNAMIC_PLATFORM_PROVIDERS,testingBrowser.TEST_BROWSER_DYNAMIC_APPLICATION_PROVIDERS);

}).then(function() {
    // Finally,load all spec files.
    // This will run the tests directly.
    return Promise.all(
        allSpecFiles.map(function (moduleName) {
            return System.import(moduleName);
        }));
}).then(__karma__.start,__karma__.error);

我的systemjs.config.js:

(function (global) {

    // map tells the System loader where to look for things
    var map = {
        'app': 'app',// 'dist','rxjs': 'node_modules/rxjs','angular2-in-memory-web-api': 'node_modules/angular2-in-memory-web-api','crypto': '@empty'// this fixed my last issue
    };

    // packages tells the System loader how to load when no filename and/or no extension
    var packages = {
        'app': {main: 'main.js',defaultExtension: 'js'},'rxjs': {defaultExtension: 'js'},'angular2-in-memory-web-api': {defaultExtension: 'js'}
    };

    var packageNames = [
        '@angular/common','@angular/compiler','@angular/core','@angular/http','@angular/platform-browser','@angular/platform-browser-dynamic','@angular/router','@angular/upgrade'
    ];

    // add package entries for angular packages in the form '@angular/common': { main: 'index.js',defaultExtension: 'js' }
    packageNames.forEach(function (pkgName) {
        packages[pkgName] = {main: 'index.js',defaultExtension: 'js'};
    });

    var config = {
        map: map,packages: packages
    };

    // filterSystemConfig - index.html's chance to modify config before we register it.
    if (global.filterSystemConfig) {
        global.filterSystemConfig(config);
    }

    System.config(config);

})(this);

当我使用karma启动karma.conf.js进行测试时,我的测试位于主要的ts文件旁边.

我得到这个错误:

11 05 2016 17:02:24.306:DEBUG [web-server]: serving (cached): /Users/julien/Documents/projects/bignibou/bignibou-site/bignibou-client/node_modules/typescript/lib/typescript.js
PhantomJS 2.1.1 (Mac OS X 0.0.0) ERROR
  Error: eval code
    eval@[native code]
    F@/Users/julien/Documents/projects/bignibou/bignibou-site/bignibou-client/jspm_packages/system-polyfills.js:4:12217
    H@/Users/julien/Documents/projects/bignibou/bignibou-site/bignibou-client/jspm_packages/system-polyfills.js:4:11846
    when@/Users/julien/Documents/projects/bignibou/bignibou-site/bignibou-client/jspm_packages/system-polyfills.js:4:15520
    run@/Users/julien/Documents/projects/bignibou/bignibou-site/bignibou-client/jspm_packages/system-polyfills.js:4:14559
    _drain@/Users/julien/Documents/projects/bignibou/bignibou-site/bignibou-client/jspm_packages/system-polyfills.js:4:3250
    drain@/Users/julien/Documents/projects/bignibou/bignibou-site/bignibou-client/jspm_packages/system-polyfills.js:4:1667
    Evaluating /Users/julien/Documents/projects/bignibou/bignibou-site/bignibou-client/karma-test-shim.js
    Error loading /Users/julien/Documents/projects/bignibou/bignibou-site/bignibou-client/karma-test-shim.js


11 05 2016 17:02:24.316:DEBUG [karma]: Run complete,exiting.
11 05 2016 17:02:24.316:DEBUG [launcher]: Disconnecting all browsers
11 05 2016 17:02:24.324:DEBUG [launcher]: Process PhantomJS exited with code 0
11 05 2016 17:02:24.324:DEBUG [temp-dir]: Cleaning temp dir /var/folders/1p/pcqq7s0x58l_s7ds52gxt_fw0000gp/T/karma-62098834
11 05 2016 17:02:24.329:DEBUG [launcher]: Finished all browsers
npm ERR! Test failed.  See above for more details.

有人可以帮忙吗?

我可以看到你做了什么的几个问题.

首先我认为你配置了两次SystemJS:

>在test-shim-karma.js文件中一次
>一次在karma.conf.js一个通过SystemJS的karma插件.

然后,您不配置将在规范文件中使用的源模块:

packages['base/app'] = {
  defaultExtension: 'js',format: 'cjs',map: Object.keys(window.__karma__.files).filter(onlyAppFiles).reduce(createPathRecords,{})
};

你多次调用System.config方法.

我还会在您的karma.conf.js文件的文件部分中添加一些条目:

files: [
  // Paths loaded by Karma
  {pattern: 'node_modules/es6-shim/es6-shim.min.js',included: true,watched: true},{pattern: 'node_modules/reflect-metadata/Reflect.js',{pattern: 'node_modules/zone.js/dist/zone.js',{pattern: 'node_modules/zone.js/dist/async-test.js',{pattern: 'node_modules/systemjs/dist/system-polyfills.js',{pattern: 'node_modules/systemjs/dist/system.src.js',{pattern: 'node_modules/rxjs/**/*.js',included: false,watched: false},{pattern: 'node_modules/@angular/**/*.js',{pattern: 'karma-test-shim.js',// Paths loaded via module imports
  {pattern: 'app/**/*.js',// Paths to support debugging with source maps in dev tools
  {pattern: 'app/**/*.ts',{pattern: 'app/**/*.js.map',watched: false}
],

您可以看一下这个项目,使用Angular2 RC1和TypeScript进行Karma的工作配置:

> https://github.com/templth/geo-open-data-viz/tree/v2

(编辑:李大同)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

    推荐文章
      热点阅读