RequireJS: Cannot find module 'domReady'

Question

I have quite an annoying, but probably simple, problem that I just cannot figure out.

In a TypeScript file I have defined the following line:

import test1 = require('domReady');

This "domReady" module is defined in a main.js file that is loaded as the entry point for RequireJS. The definition is as followed:

require.config({    
    paths: {      
        'domReady': '../domReady',
    }

However... in my TypeScript file I simply get a "cannot find module 'domReady'" and it is driving me insane, as I have double checked the pathing to the file and it is indeed in the correct location with the correct name. Additionally, I am fairly certain that the domReady.js file IS AMD compatible, so it should define an external module just fine! (domReady GitHub Link).

I seriously can't understand why the module can't be found in the import statement. Does anyone have any ideas to what the problem may be?

EDIT 1

The directory structure is as follows:

.
+--App
| +--main.js
| +--dashboard.js
+--domReady.js

The import statement takes place in the "dashboard.js" file, and the config for require.js happens in "main.js".

C Snover C Snover · Accepted Answer · 2015-12-17T20:24:19

In order for TypeScript to find a module, you must actually provide module information to TypeScript.

TypeScript doesn’t yet support AMD-style paths configuration, it doesn’t ever use calls within your JavaScript code (like require.config()) to configure itself, and it won’t treat JavaScript files on disk as modules when compiling. So right now, you aren’t doing anything to actually give the compiler the information it needs to successfully process the import statement.

For your code to compile without error, you have to explicitly declare an ambient declaration for the module you’re importing within the compiler, in a separate d.ts file:

// in domReady.d.ts
declare module 'domReady' {
  function domReady(callback: () => any): void;
  export = domReady;
}

Then, include this d.ts in the list of files you pass to the compiler:

tsc domReady.d.ts App/main.ts App/dashboard.ts

Any other third party JavaScript code that you import also needs ambient declarations to compile successfully; DefinitelyTyped provides d.ts files for many of these.

RequireJS: Cannot find module 'domReady'

2 Answers