Simple Import of Node Module in Angular 2 with Typings

Question

The head of my file looks like this:

/// <reference path="../../typings/index.d.ts" />
import * as c3 from 'c3';

But when I start the app I get this error:

http://localhost:3000/c3 Failed to load resource: the server responded with a status of 404 (Not Found)

c3 is included in package.json dependencies. typings.json looks like:

{
  "globalDependencies": {
    "d3": "registry:dt/d3#0.0.0+20160907005744",
    "c3": "registry:dt/c3#0.0.0+20160926143332",
    "core-js": "registry:dt/core-js#0.0.0+20160725163759",
    "node": "registry:dt/node#6.0.0+20160831021119"
  }
}

And typings/index.d.ts looks like:

/// <reference path="globals/d3/index.d.ts" />
/// <reference path="globals/c3/index.d.ts" />
/// <reference path="globals/core-js/index.d.ts" />
/// <reference path="globals/node/index.d.ts" />

tsconfig.json looks like:

{
  "compilerOptions": {
    "target": "es5",
    "module": "commonjs",
    "moduleResolution": "node",
    "sourceMap": true,
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "removeComments": false,
    "noImplicitAny": true,
    "suppressImplicitAnyIndexErrors": true
  },
  "files": [
    "typings/index.d.ts"
  ]
}

Any clues about what is misconfigured?

How are you loading your modules? Are you using SystemJS or Webpack or something else? — Dave V
– Dave V, Commented Oct 11, 2016 at 16:50
I believe I am using commonJS. From my tsconfig.json: "module": "commonjs", "moduleResolution": "node", — Michael Pell
– Michael Pell, Commented Oct 11, 2016 at 16:51
You are probably using something else to load the individual modules. That error actually has nothing to do with Typescript, it's failing to load the module itself (which isn't a TS thing). Can you show your index.html? That will probably point out what you are using — Dave V
– Dave V, Commented Oct 11, 2016 at 16:52
ah, I see a <script src="systemjs.config.js"></script> that file is here: gist.github.com/MichaelCPell/d4564b53b25faa3f41e1863e63976006 — Michael Pell
– Michael Pell, Commented Oct 11, 2016 at 16:54
You'll probably need to add the module to that. I haven't used SystemJS in a while, but if I remember right, you'll have to add it to the map object and the packages object — Dave V
– Dave V, Commented Oct 11, 2016 at 16:55

Dave V · Accepted Answer · 2016-10-11 17:01:26Z

1

Since you're using SystemJS you'll need to add the module to the systemjs.config.js file (or whatever you called it). You will need to add the module to the map and pakcages objects.

answered Oct 11, 2016 at 17:01

Dave V

1,97610 silver badges18 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Simple Import of Node Module in Angular 2 with Typings

1 Answer 1

Comments

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Related