Skip to content

Cannot use relative import paths with RequireJS #1567

Closed
@eschwartz

Description

@eschwartz

I am trying to convert a RequireJS project over to TypeScript, and I'm running into a problem with relative AMD module paths, where generated TypeScript files are not playing nicely with RequireJS.

TL;DR: RequireJS does not support using relative paths from more than one location. TypeScript only supports relative import paths.

Here's what I've got going on:

app/
- MyClass.ts
- MyClass.js
- AnotherClass.ts
- AnotherClass.ts
tests/
- MyClassTest.ts
- MyClassTest.js
// app/MyClass.ts
class MyClass = {
  // ...
}
export = MyClass;

// app/MyClass.js
define(["require", "exports"], function (require, exports) {
    var MyClass = (function () {
        function MyClass() {
        }

        // ...       

        return MyClass;
    })();
    return MyClass;
});

// app/AnotherClass.ts
import MyClass = ('./MyClass')
class AnotherClass = {
  // Do some stuff that uses MyClass...
}
export = AnotherClass;

// app/AnotherClass.js
define(["require", "exports", "./MyClass"], function (require, exports, MyClass) {
    var AnotherClass = (function () {
        function AnotherClass() {
        }

         // Do some stuff that uses MyClass ...

        return AnotherClass;
    })();
    return AnotherClass;
});

// tests/MyClassTest.ts
import MyClass = require('../app/MyClass');
/// some tests...

// tests/MyClassTest.js
define(["require", "exports", "../app/MyClass"], function (require, exports, MyClass) {
    // some tests...
});

When I run tests/MyClassTest.js I get a RequireJS timeout error `Load timeout for module 'app/MyClass'.

From what I can find, RequireJS does not support using relative paths in this way. @JBurke recommends to always use a paths config to specify aliases or root paths, so that all modules can be referenced with the exact same id. My experience with RequireJS confirms this -- I've had the same issue if I reference a module with inconsistent casing, if I use two different path aliases to reference the same module, or if I mix relative paths with aliased module IDs.

I've seen some discussion related to this (#293). But I'm wondering if anyone has found a way to work around this issue. I can't imagine I'm the only one trying to use TypeScript with RequireJS.

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions