什么是进口角嘲笑

Question

版本

typescript: 2.1.4
systemjs: 0.19.41
angular: 1.5.10
angular-mocks: 1.5.10

问题

我试图加载angular-mocks与正确的方法打字稿2.0项目中的。

如果我使用以下它的作品，但我得到一个TS错误和{module}也被标记为webstorm中的错误。

import {module} from 'angular-mocks'; 

describe('someClass', function() { 
    'use strict'; 

    beforeEach(module('someModule')); 

    ... 
}); 

error TS2305: Module '"/node_modules/@types/angular-mocks/index"' has no exported member 'module'.

我最初试图简单地导入angular-mocks，但进口angular对象不具有mock属性（即使window.angular.mock定义），所以它抛出一个错误。

import * as angular from 'angular'; 
import 'angular-mocks'; 

describe('someClass', function() { 
    'use strict'; 

    beforeEach(angular.mock.module('someModule')); 

    ... 
}); 

Uncaught TypeError: Cannot read property 'module' of undefined

Systemjs配置

System.config({ 
    transpiler: 'typescript', 
    paths: { 
     'src:*': '/src/*', 
     'npm:*': '/node_modules/*' 
    }, 
    map: { 
     'angular': 'npm:angular/angular.js', 
     'angular-mocks': 'npm:angular-mocks/angular-mocks.js', 
     'lib': 'src:lib', 
     'typescript': 'npm:typescript/lib/typescript.js', 
     'systemjs': 'npm:systemjs/dist/system.src.js' 
    }, 
    packages: { 
     lib: { 
      defaultExtension: 'js' 
     } 
    }, 
    meta: { 
     angular: { 
      format: 'global', 
      exports: 'angular' 
     }, 
     'angular-mocks': { 
      format: 'global', 
      deps: ['angular'] 
     } 
    } 
}); 

问题

任何想法是正确的方法导入这是什么？

更新

这是我目前使用的解决方案，与mock进口全角度对象正确地分配给它。

import * as angular 'angular-mocks'; 

describe('someClass', function() { 
    'use strict'; 

    beforeEach(module('someModule')); 

    ... 
}); 

注意添加exports: 'angular'到angular-mocks元，以便它正确导入全角度对象：

System.config({ 
    ... 
    meta: { 
     angular: { 
      format: 'global', 
      exports: 'angular' 
     }, 
     'angular-mocks': { 
      format: 'global', 
      exports: 'angular', 
      deps: ['angular'] 
     } 
    } 
} 

这仍然产生了TS错误，但在这一点上是最短的之一，因此更容易从其他错误区分...

error TS2304: Cannot find name 'module'. 

Answer 1

正确的方法导入angular-mocks和使用（注意beforeEach()）：

import * as angular from 'angular'; 
import 'angular-mocks'; 

describe('some component',() => { 

    beforeEach(() => { 
     angular.mock.module('someModule'); 
    }); 

}); 

这是因为angular-mocks不出口任何东西。它增加了角度对象。

下面是它的声明是怎样的。请注意0​​属性，该属性被添加到IAngularStatic接口中。

import * as angular from 'angular'; 

/////////////////////////////////////////////////////////////////////////////// 
// ngMock module (angular-mocks.js) 
/////////////////////////////////////////////////////////////////////////////// 

declare module 'angular' { 

    /////////////////////////////////////////////////////////////////////////// 
    // AngularStatic 
    // We reopen it to add the MockStatic definition 
    /////////////////////////////////////////////////////////////////////////// 
    interface IAngularStatic { 
    mock: IMockStatic; 
    } 

    ... 

    interface IMockStatic { 
    ... 

    inject: IInjectStatic 

    // see https://docs.angularjs.org/api/ngMock/function/angular.mock.module 
    module: { 
     (...modules: any[]): any; 
     sharedInjector(): void; 
    } 

    ... 
    } 
    ... 
} 

完整声明：https://github.com/DefinitelyTyped/DefinitelyTyped/blob/master/types/angular-mocks/index.d.ts