Create bundle d.ts file

[SamVerschueren]

The TypeScript compiler creates a typedefinition file for every .ts file separately. When distributing the library, we need to generate one .d.ts file that describes all our modules. This file can then be added in the typings directory when developing with angular2-polyfill.

I guess it has to be distributed via DefinitelyTyped afterwards.

For example, the angular2-polyfill.d.ts file would look like this.

declare module "angular2-polyfill/core" {
    /**
     * Interfaces
     */
    export interface ComponentMetadata {
        selector?: string;
        exportAs?: string;
        template?: string;
        templateUrl?: string;
        directives?: any[];
        providers?: any[];
        pipes?: any[];
    }
    export interface PipeInterface {
        name: string;
        pure: boolean;
    }
    export interface OnInit {
        ngOnInit(): void;
    }
    export interface PipeTransform {
        transform(value: any, args: any[]): any;
    }
    /**
     * Decorators
     */
    export declare function Component(component: ComponentMetadata): (target: any) => void;
    export declare function Injectable(): (target: any) => void;
    export declare function Input(bindingPropertyName?: string): (target: any, propertyKey: string) => void;
    export declare function Pipe(pipe: PipeInterface): (target: any) => void;
}

declare module "angular2-polyfill/router" {
    export interface RouteDefinition {
        path?: string;
        component?: any;
        as?: string;
        name?: string;
        useAsDefault?: boolean;
    }
    /**
     * Decorators
     */
    export declare function RouteConfig(routes: RouteDefinition[]): (target: any) => void;
}

[ocombe]

You just need to create an angular2-polyfill.ts file at the root of your project that exports all of the other modules, like I did for ng2-translate: https://github.com/ocombe/ng2-translate/blob/master/ng2-translate.ts

Then when you call tsc it will generate angular2-polyfill.d.ts at the root, and people can then import all by using:

import {SomeModule} from "angular2-polyfill/angular2-polyfill"`

[SamVerschueren]

@ocombe Thanks for the suggestions. It seems that it works correctly when the module is installed via npm. If it is installed with JSPM, the user needs an extra bundled d.ts file. More info here:

microsoft/TypeScript#6012

[unional]

Referencing:
microsoft/TypeScript#4665

In that proposal declare module should be avoided for external modules.

[SamVerschueren]

@unional Not even for type definitions distributed via DefinitelyTyped? I'm not using declare module in my code and the type definitions are distributed via npm. The only downside on this is that the type definitions are not recognised when installed via jspm (see previously linked issue). So at the moment, I have to install angular2-polyfill once with npm and once with jspm. The npm version allows detection of the type definitions, the jspm version is used when running the application. This is not ideally but I don't think there is another solution at the moment.

[unional]

I'm using jspm and facing the same issue. I also create and consume modules written and export in ts under jspm so it is even a bigger problem for me.

To my understanding, yes. See the third paragraph in the Background section:

The way they dependency typing are authored today on definitely typed is using ambient external module declaration; this indicates that these typings exist in the global scope, and thus are susceptible to conflicts. The classic the diamond dependency issue (courtesy of @poelstra):

One way is go for the proper external module, adding typings in package.json.

It is an on-going discussion.

[ocombe]

Hmm interesting that it doesn't work with jspm, I need to take a look at that to find the proper setup that works for everything.
Bundling the typings is a tedious process imo, there should be a better way.

[SamVerschueren]

Bundling the typings is a tedious process imo, there should be a better way.

Jup, can't find a decent way of doing that other then manually bundle them...

[Ledragon]

TypeScript actually allows to compile its output in a single file. The gulp-typescript plugin allows to output declaration files independently. Therefore, I created a gulp task to output that file in the bundles folder (see PR #27 ). Hope this is what you were after.

[Ledragon]

Just realized the root module name is src and not angular2-polyfill.. This appears to be a new fature of TypeScript.

[SamVerschueren]

Thanks @Ledragon for looking into it!

[Ledragon]

My pleasure!