Require custom module with npm and typescript

Question

Lets play with 2 projects: main-project and lib-project both of them are written in typescript, and then using gulp compiled to common javascript.
Our goal is require lib-project in main-project.

lib-project

|-- package.json
|-- gulpfile.js
|-- dist
   |-- index.js
   |-- a.js
| src
   |-- index.ts
   |-- a.ts

We have created those js compiling them from their ts; lets take a quick look to them (we have index because we'll want eventually so many exports)

index.ts

import a = require('./a');
module.exports = {A: a.A};

a.ts

export class A {
  field: string;
  constructor(aField: string) {this.field = aField;}
  toString() : string {return `A: ${this.field}`;}
}

index.js

var a = require('./a');
module.exports = { A: a.A };

a.js

var A = (function () {
    function A(aField) {
        this.field = aField;
    }
    A.prototype.toString = function () {
        return "A: " + this.field;
    };
    return A;
})();
exports.A = A;

That was the introduction; now, I push it to a git repo and require it as a dependency in the package.json and run npm install, our main-project is:

main-project

|-- package.json
|-- gulpfile.js
|-- node_modules
    |--lib-project
       |-- dist
         |-- index.js
         |-- a.js
    |--node
       |...
 |--src
    |--app.ts

Is in app.ts where this is failing: cannot find module lib-project

app.ts

import a = require('lib-project');
var foo = new a.A('HELLO');
console.log(foo.toString());

What have I tried?

move the index.js of the lib-project to the root folder
In the package.json, set the field "main": "dist/index.js"
import a = require('node_modules/lib-project/dist/index');
import a = require('../node_modules/lib-project/dist/index');
Multiple version of the tsc (typescript compiler)

Any help appreciated :)

EDIT

package.json

{
  "name": "lib-project",
  "version": "0.1.0",
  "description": "description here",
  "main": "dist/index.js",
  "scripts": {},
  "author": "",
  "license": "MIT",
  "dependencies": {
  }
}

Brocco Brocco · Accepted Answer · 2015-08-26T10:13:58

I believe what you're missing is a lib-project.d.ts file in the root of the lib project. This will fill the role of what you already have in index.ts, but you'll need to tweak it slightly to fill this role

|-- package.json
|-- gulpfile.js
|-- lib-project.d.ts <-- formerly index.ts
|-- dist
   |-- a.js
| src
   |-- a.ts

Where lib-project.d.ts would look like this:

declare module 'lib-project' {
  import a = require('./a');
  export = {A: a.A};
}

Then when consuming this you can use:

import {A} from 'lib-project';

You can reference what I've done here for exporting: https://github.com/Brocco/ng-bridge

And importing too: https://github.com/Brocco/ng-bridge-samples/blob/master/app/app.ts#L1

Require custom module with npm and typescript

2 Answers