14
Vote

simpler AMD modules for existing libs

description

TypeScript has so much potential, but it's SO HARD to get it working correctly with AMD and existing libraries.

Let's say I'm using jquery.d.ts from https://github.com/borisyankov/DefinitelyTyped (or any other one, really). Then let's say I have a file called main.ts. The way I would expect it to work if I put jquery.d.ts into "./somefolder" is:

import $ = require("somefolder/jquery")

The problem is currently that the only way to do this is to add this to the ambient declarations file

declare module "somefolder/jquery" {}

You string you have to put in there has to exactly match the folder structure. That's lame because everyone will want to put them in different files.

I'm just hoping you guys have a way to make AMD with existing modules easier, because right now it's super hard.

(EDIT) Proposal --

A really easy way to solve this is to make it possible to declare a module as an instance of interface. Something like this:

///<reference path="../components/DefinitelyTyped/Definitions/jquery-1.8.d.ts"/>

// any of these would make some kind of sense
declare module "lib/jquery" JQueryStatic
declare module "lib/jquery": JQueryStatic
declare module "lib/jquery" extends JQueryStatic {}

Then I could just use the global jquery.d.ts and make my own jquery.ts file anywhere I wanted, then set the module name to match.

comments

seanhess wrote Nov 8, 2012 at 5:51 AM

I've thought more about this. A really easy way to solve this is to make it possible to declare a module as an instance of interface. Something like this:

///<reference path="../components/DefinitelyTyped/Definitions/jquery-1.8.d.ts"/>

// any of these would make some kind of sense
declare module "lib/jquery" JQueryStatic
declare module "lib/jquery": JQueryStatic
declare module "lib/jquery" extends JQueryStatic {}

Then I could just use the global jquery.d.ts and make my own jquery.ts file anywhere I wanted, then set the module name to match.

ajorkowski wrote Nov 8, 2012 at 6:01 AM

I agree with sean. If you can declare a module as a type then it will solve any AMD issues with libs like jquery, knockout etc.

ajorkowski wrote Nov 8, 2012 at 6:15 AM

Btw... for the interest of others... There is a workaround you can do for this. In your def file you can do:

///<reference path="../components/DefinitelyTyped/Definitions/jquery-1.8.d.ts"/>
declare module "jquery" {
// Take a single random property (otherwise the module is ignored)
() : JQuery;
}

Then in your dependant file

///<reference path="../defs/jquery.d.ts"/>
import jquery = require("jquery");
var $ = <JQueryStatic>jquery;

'jquery' will be imported using define and $ will be correctly typed. It is nearly there but just needs the final push!

microants wrote Dec 14, 2012 at 11:58 PM

Why not change how imports works? Imagine this:

Main.ts looking like:
/// <reference path="../DefinitelyTyped/knockback/knockback-0.16.d.ts" />
import Knockback = module("knockback") as Knockback;

when knockback-0.16.d.ts looks like:
declare module Knockback {
export interface EventWatcherOptions {
//clipped for purposes of example
}

I would also want it to allow any string to be passed into the module() function when you are casting it as a type, as it will allow you to either use your server paths:
import Knockback = module("../libs/knockback") as Knockback;

Or use a shim name that you might have declared using requirejs.config[2]:
import Knockback = module("knockback") as Knockback;

Or potentially use the require.js text file plugin [1]
import myStuff = module("text!some/path") as string;

[1]http://requirejs.org/docs/1.0/docs/api.html#text
[2]http://requirejs.org/docs/api.html#config-shim

just my $0.02.....

czb wrote Jan 7 at 6:52 AM

I would definitely vote for microants solution. Requirejs, Dojo, Boilerplatejs and others use amd plugins ("text!some/path") and it is a pity that we cannot use them...

blittle wrote Feb 14 at 8:02 PM

I am having similar issues with TypeScript and AMD. 1+

blittle wrote Feb 14 at 8:02 PM

I am having similar issues with TypeScript and AMD. 1+

Sign in to add a comment or to set email notifications