simonaco simonaco - 2 years ago 1916
Javascript Question

How to import in a angular 2 application?

I want to include in my angular 2 application. First I installed, installed typings:

npm install --save
typings install --save --ambient

Next step was to include into my index.html:

<script src="node_modules/"></script>

In my component, I am importing

import * as io from ''

And then using it:

var socket = io('http://localhost:3000');
socket.on('event', function(data:any){

This fails with:

zone.js:101 GET http://localhost:3001/ 404 (Not Found)
(index):18 Error: Error: XHR error (404 Not Found) loading http://localhost:3001/

Any ideas?

Answer Source

In order to register the module so you can import it, you need to include it in you SystemJS configuration.

    packages: {
        "": {"defaultExtension": "js"}
    map: {
        "": "node_modules/"

And change your import to:

import io from '';
import * as io from "

Also, you don't need the import in the script tag anymore, so remove:

<script src="node_modules/"></script>

Finally, if you like to add the typings, add in your typings.json:

  "ambientDependencies": {

P.S. Int the future, change the hash in the typings to the latest commit hash.

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download