Angular-cli: Socket.io Errors in Angular-CLI Project

Created on 21 Dec 2016  路  5Comments  路  Source: angular/angular-cli

I am in the process of creating an Angular 2 app using the Angular-CLI, which is basically a clone project of something I've already been building in Angular 2, but without the CLI.

I've got everything transferred over, but I'm getting a couple of errors pertaining to socket.io. I have socket.io-client included in my package.json, but ended up with errors. At first I had three errors, which were:

  • "Cannot find module 'socket.io-client'
  • "Cannot find namespace 'SocketIOClient'
  • Property 'isNullOrEmpty' does not exist on type 'StringConstructor'

All three errors pertain to socket.io. Now I read on a stackoverflow thread that I needed to add the following to my typings.d.ts file :

    declare module 'socket.io-client' {
      var e: any;
      export = e;
    }

I did that, and the first error went away. So now I'm left with these remaining errors:

  • "Cannot find namespace 'SocketIOClient'
  • Property 'isNullOrEmpty' does not exist on type 'StringConstructor'

What else do I need to configure to resolve this?

By the way, for reference, here is my package.json file:

    {
      "name": "cli-abs",
      "version": "0.0.1",
      "license": "MIT",
      "angular-cli": {},
      "scripts": {
        "start": "ng serve",
        "lint": "tslint \"src/**/*.ts\"",
        "test": "ng test",
        "pree2e": "webdriver-manager update",
        "e2e": "protractor"
      },
      "private": true,
      "dependencies": {
        "@angular/common": "2.2.3",
        "@angular/compiler": "2.2.3",
        "@angular/core": "2.2.3",
        "@angular/forms": "2.2.3",
        "@angular/http": "2.2.3",
        "@angular/platform-browser": "2.2.3",
        "@angular/platform-browser-dynamic": "2.2.3",
        "@angular/router": "3.2.3",
        "angular-in-memory-web-api": "~0.1.15",
        "angular2-chartjs": "^0.1.6",
        "chart.js": "^2.4.0",
        "ng2-charts": "^1.4.1",
        "core-js": "^2.4.1",
        "rxjs": "5.0.0-beta.12",
        "socket.io-client": "^1.4.8",
        "ts-helpers": "^1.1.1",
        "zone.js": "^0.6.23"
      },
      "devDependencies": {
        "@angular/compiler-cli": "2.2.3",
        "@types/jasmine": "2.5.38",
        "@types/node": "^6.0.42",
        "angular-cli": "1.0.0-beta.22-1",
        "codelyzer": "~2.0.0-beta.1",
        "jasmine-core": "2.5.2",
        "jasmine-spec-reporter": "2.5.0",
        "karma": "1.2.0",
        "karma-chrome-launcher": "^2.0.0",
        "karma-cli": "^1.0.1",
        "karma-jasmine": "^1.0.2",
        "karma-remap-istanbul": "^0.2.1",
        "protractor": "4.0.9",
        "ts-node": "1.2.1",
        "tslint": "^4.0.2",
        "typescript": "~2.0.3",
        "typings": "^1.3.2",
        "webdriver-manager": "10.2.5"
      }
    }

Additional Info:

  • I am running this on a MacBook, running OS X El Capitan V. 10.11.6
  • I am using version 1.0.0-beta.22-1 of the Angular-CLI
more info

Most helpful comment

@darrenbrett
I'm using socket-io fine in my angular-cli app.

1) Installed types: @types/socket.io-client
2) Imported like: import * as io from 'socket.io-client';
3) Used like: this.socket = io('somewhere');

All 5 comments

We will need more information to investigate this issue. Could you provide an example project? Or at least an example of how you use the SocketIO? Do you import * as socketIo from 'socket.io-client'?

Hansl, thanks. Actually, I got the first two errors resolved. My last remaining error is this:

Property 'isNullOrEmpty' does not exist on type 'StringConstructor'

Not sure why this is appearing here on a CLI project, when it wasn't an issue on my original Angular 2 app (not built with the Angular-CLI).

@darrenbrett
I'm using socket-io fine in my angular-cli app.

1) Installed types: @types/socket.io-client
2) Imported like: import * as io from 'socket.io-client';
3) Used like: this.socket = io('somewhere');

Closing this as fixed.

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_This action has been performed automatically by a bot._

Was this page helpful?
0 / 5 - 0 ratings