Missing Definition file for UMD module

[hrajchert]

I've downloaded and compiled the project building for all targets, and noticed that the umd/global distribution is missing the .d.ts definition files.

I've played around a little, and the closest I got was to compile to amd using outFile instead of outDir, that generates a single .d.ts, but its missing the Global name "Rx",
for example, its generating

declare module "Subscription" {
    export class Subscription {
        static EMPTY: Subscription;
        isUnsubscribed: boolean;
        constructor(_unsubscribe?: () => void);
        unsubscribe(): void;
        add(subscription: Subscription | Function | void): void;
        remove(subscription: Subscription): void;
    }
    export class UnsubscriptionError extends Error {
        errors: any[];
        constructor(errors: any[]);
    }
}

Where I think it should create

declare module "Rx.Subscription" {

Sadly the project Im building now needs the umd version and I can't get typings :(

[david-driscoll]

There's supposed to be a better way to flatten the results coming in the near future ( see microsoft/TypeScript#5332 )

If you can get it to build with outDir, it may be possible to post-process the file and shiv the declarations in such that declare module " -> declare module "rxjs/, though that would be nasty and painful.

[hrajchert]

Thanks for the soon reply. I'm no expert in typescript, so I don't fully understand the difference, but when compiling with outDir and module like es6, the declaration files start like this

export { Subject } from './Subject';
export { Observable } from './Observable';
import './add/observable/bindCallback';
import './add/observable/bindNodeCallback';
import './add/observable/combineLatest';
import './add/observable/concat';
...

My first attempt was to create a folder only using the .d.ts files, and made my tsd.d.ts file to point to the Rx.d.ts, but it complaint about the export saying it wasn't part of the compilation process or something like that.

The weird part is that, every module I download with tsd or even RxJs 4.x has declares and this creates imports and exports. I assume its because its meant to be used with a module loader, and that would in turn really use ES6 import (thus providing the Rx namespace implicitly).

But as I said sadly I need to use an umd/global approach for now.

I've also noticed that the umd is created from the cjs using browserify... Is there a tool that converts cjs ts into tsd like ts? In other words, change all the imports/exports with ///reference and declares

[kwonoj]

umd is created from the cjs using browserify

RxJS build doesn't use browserify to create its output. Do you mean your build configuration?

converts cjs ts into tsd like ts?

Would you elaborate bit more? Is this mean using ts source as input and generate some sort of type output? or convert type definition from original into something else?

[hrajchert]

@kwonoj The package.json has a task called build_global that uses make-umd-bundle to create the global/umd dist file, which I think is the one used in the CDN. That tool uses browserify to generate umd code from the cjs one.

The "convertion" between cjs ts into tsd is badly phrased because of my lack of knowledge in the subject. But what I mean is this:

When I use tsd to download the type definition for a non-typescript project, like angular 1, I get a .d.ts file that has a lot of declare keywords, like this (taken from rxjs4 .d.ts):

declare module Rx {

    // Type alias for observables and promises
    export type ObservableOrPromise<T> = IObservable<T> | Observable<T> | Promise<T>;

    export type ArrayLike<T> = Array<T> | { length: number;[index: number]: T; };

    // Type alias for arrays and array like objects
    export type ArrayOrIterable<T> = ArrayLike<T>;

    /**
     * Promise A+
     */
    export interface Promise<T> {
        then<R>(onFulfilled: (value: T) => R|Promise<R>, onRejected: (error: any) => Promise<R>): Promise<R>;
        then<R>(onFulfilled: (value: T) => R|Promise<R>, onRejected?: (error: any) => R): Promise<R>;
    }

    /**
     * Promise A+
     */
    export interface IPromise<T> extends Promise<T> { }

    /**
    * Represents a push-style collection.
    */
    export interface IObservable<T> { }

And if I compile rxjs5 using something like this:

tsc ./typings/main.d.ts ./dist/sherman/src/Rx.ts ./dist/sherman/src/Rx.KitchenSink.ts ./dist/sherman/src/Rx.DOM.ts ./dist/sherman/src/add/observable/of.ts -m amd   --outFile ./dist/sherman/umd.js  --target ES5 -d --diagnostics --pretty --noImplicitAny --suppressImplicitAnyIndexErrors

where I use outFile instead of outDir and the module is amd instead of umd (as umd doesn't support outFile), I get a similar result, but without the Rx namespace.

declare module "Subscription" {
    export class Subscription {
        static EMPTY: Subscription;
        isUnsubscribed: boolean;
        constructor(_unsubscribe?: () => void);
        unsubscribe(): void;
        add(subscription: Subscription | Function | void): void;
        remove(subscription: Subscription): void;
    }
    export class UnsubscriptionError extends Error {
        errors: any[];
        constructor(errors: any[]);
    }
}

The cjs or es6 dist instead has a .d.ts like this:

export { Subject } from './Subject';
export { Observable } from './Observable';
import './add/observable/bindCallback';
import './add/observable/bindNodeCallback';
import './add/observable/combineLatest';
import './add/observable/concat';
...

Where instead of declare, it uses import and export.

My first approach was to use the CDN file and include all the es6 or cjs .d.ts files (mantaining file structure) inside the typings folder, along side other external tools. But that didn't worked and I assume it's because the way I'm working. I'm not using a module loader yet, so I don't do imports in my files, I have a ///reference file, and I think that requires the .d.ts to use files with declare instead of import/export.

[kwonoj]

The package.json has a task called build_global that uses make-umd-bundle to create the global/umd dist file, which I think is the one used in the CDN.

: Oops yes, I oversighted that. apologizes.

[hrajchert]

Thats the one I could use, as I'm not using a module loader any time soon. So far I'm using rxjs version 4 installed with bower and I would like to upgrade to version 5, but I can't if I loose typing

[kwonoj]

I have a ///reference file, and I think that requires the .d.ts to use files with declare instead of import/export.

I see. For external modules, you may not ambient reference to external module definition (/// reference). What tsd provides is ambient type definition while type definitions for external modules are not published as ambient declaration. You may refer some of explanantions at angular/angular#5248 (comment) how type definition is being published. In short, there isn't straight conversion of external type definition into ambient (so far I know, maybe I'm incorrect. Bit off topic note, all of ambient declaration in definitelyTyped what you can get via tsd is all hand-crafted, and it is being deprecated in favor of external definition via typings https://github.com/typings/typings).

It is still issue umd bundle does not have correct type definition though, it's somewhat different to your approach to try load it as ambient way. Honestly I haven't played with umd bundles much so may need to see how to make correct type definitions to be included.

[kwonoj]

Also meanwhile, this angular/angular#5796 (comment) might interest you @hrajchert . It's not exactly same illustration, but somewhat similar. As an immediate workaround, this may help you.

[hrajchert]

@kwonoj Great explanation! I think I understand a little bit more of the problem now. I did not know about typings existance, I was using tsd. My question is, can I use typings without using a module loader? If so, I should be able to use RxJs from CDN and still have type definition from typings, right?

Right now Im not using one, so I don't think I can use something like

import Rx from 'rxjs/Rx';

Not sure what I could take from the second comment you mention, I think it is the result of using the outFile flag, that seems to create ambient definition files.

[benlesh]

@kwonoj can you label this as a bug if it's a bug, or if it's just something that needs work, add PRs Welcome?

[kwonoj]

Yes, will do after couple of try on my end. Should be labeled no later than tomorrow.

[kwonoj]

I'm labeling this related to type output but not as a bug for now, since we never had published type definition for global bundles. Honestly, at this moment I'm not exactly aware how to achieve this with current pipelines, may need some investigations.

@hrajchert , for your questions of importing global bundle and using type definition for other builds - I haven't tried it by my own yet. (Apologizes, since I usually work with moduled build all time). If I have anything, I'll update here.

[hrajchert]

Thanks! I'll try to investigate on my own as well :)