2017-10-31 14 views
1

次の問題があります。 私は、角-cliのツールを使用して、サンプルプロジェクトを作成していると私はapp.component.ts内の次のコードは、package.jsonファイルでTypescript - モジュール内にコンストラクタメソッドが見つかりません

import { Component } from '@angular/core'; 
import * as Stomp from '@stomp/stompjs'; 
import * as SockJS from 'sockjs-client'; 

@Component({ 
    selector: 'app-root', 
    templateUrl: './app.component.html', 
    styleUrls: ['./app.component.css'] 
}) 
export class AppComponent { 
    stompClient: any = null; 

    constructor(){ 
     this.connect(); 
    } 

    connect() { 
     let socket: any = new SockJS('http://localhost:8083/gs-guide-websocket'); 
     this.stompClient = Stomp.over(socket); 
     this.stompClient.connect({}, (frame) => { 
      ... 
     }); 
    } 
} 

を提出している私は、この持っている:

"dependencies": { 
    "@angular/animations": "^4.2.4", 
    "@angular/common": "^4.2.4", 
    "@angular/compiler": "^4.2.4", 
    "@angular/core": "^4.2.4", 
    "@angular/forms": "^4.2.4", 
    "@angular/http": "^4.2.4", 
    "@angular/platform-browser": "^4.2.4", 
    "@angular/platform-browser-dynamic": "^4.2.4", 
    "@angular/router": "^4.2.4", 
    "@stomp/stompjs": "^3.1.1", 
    "core-js": "^2.4.1", 
    "rxjs": "^5.4.2", 
    "sockjs-client": "^1.1.4", 
    "websocket": "^1.0.25", 
    "zone.js": "^0.8.14" 
    }, 
    "devDependencies": { 
    "@angular/cli": "1.4.9", 
    "@angular/compiler-cli": "^4.2.4", 
    "@angular/language-service": "^4.2.4", 
    "@types/jasmine": "~2.5.53", 
    "@types/jasminewd2": "~2.0.2", 
    "@types/node": "~6.0.60", 
    "codelyzer": "~3.2.0", 
    "jasmine-core": "~2.6.2", 
    "jasmine-spec-reporter": "~4.1.0", 
    "karma": "~1.7.0", 
    "karma-chrome-launcher": "~2.1.1", 
    "karma-cli": "~1.0.1", 
    "karma-coverage-istanbul-reporter": "^1.2.1", 
    "karma-jasmine": "~1.1.0", 
    "karma-jasmine-html-reporter": "^0.2.2", 
    "protractor": "~5.1.2", 
    "ts-node": "~3.2.0", 
    "tslint": "~5.7.0", 
    "typescript": "~2.3.3" 
    } 

これをコードは正常に動作しています。サーバーとのクライアント通信が確立されます。

私は別のプロジェクト(角-CLIツールを使用して作成されていない)にが、私は次のエラーを取得するconnect()メソッドの呼び出し中に同じapp.component.tsファイルを追加しました:

ERROR TypeError: SockJS is not a constructor 
    at AppComponent.connect (sam.ts:26) 
    at new AppComponent (app.component.ts:22) 
    at createClass (provider.ts:359) 
    at createDirectiveInstance (provider.ts:181) 
    at createViewNodes (view.ts:341) 
    at callViewAction (view.ts:782) 
    at execComponentViewsAction (view.ts:700) 
    at createViewNodes (view.ts:358) 
    at createRootView (view.ts:197) 
    at Object.createProdRootView [as createRootView] (services.ts:103) 
zone.min.js:1 Unhandled Promise rejection: SockJS is not a constructor ; Zone: <root> ; Task: Promise.then ; Value: TypeError: SockJS is not a constructor 
    at AppComponent.connect (app.component.ts:26) 
    at new AppComponent (app.component.ts:22) 
    at createClass (provider.ts:359) 
    at createDirectiveInstance (provider.ts:181) 
    at createViewNodes (view.ts:341) 
    at callViewAction (view.ts:782) 
    at execComponentViewsAction (view.ts:700) 
    at createViewNodes (view.ts:358) 
    at createRootView (view.ts:197) 
    at Object.createProdRootView [as createRootView] (services.ts:103) TypeError: SockJS is not a constructor 

このプロジェクトは、以下のpackage.jsonがあります

"dependencies": { 
    "@angular/compiler-cli": "^4.3.1", 
    "@angular/platform-server": "^4.3.1", 
    "@types/protobufjs": "^6.8.0" 
    }, 
"devDependencies": { 
    "@angular/common": "^4.2.4", 
    "@angular/compiler": "^4.3.1", 
    "@angular/compiler-cli": "^4.3.1", 
    "@angular/core": "^4.3.1", 
    "@angular/forms": "^4.2.4", 
    "@angular/http": "^4.3.1", 
    "@angular/platform-browser": "^4.3.1", 
    "@angular/platform-browser-dynamic": "^4.3.1", 
    "@angular/platform-server": "^4.3.1", 
    "@angular/router": "^4.3.1", 
    "@ngtools/webpack": "1.1.2", 
    "@stomp/stompjs": "^3.1.1", 
    "@types/core-js": "0.9.34", 
    "@types/node": "6.0.41", 
    "long": "^3.2.0", 
    "angular2-template-loader": "0.6.2", 
    "awesome-typescript-loader": "^3.2.1", 
    "core-js": "2.4.1", 
    "protobufjs": "^6.8.0", 
    "raw-loader": "0.5.1", 
    "rxjs": "^5.4.2", 
    "sockjs-client": "^1.1.4", 
    "websocket": "^1.0.25", 
    "systemjs": "0.19.41", 
    "typescript": "^2.4.2", 
    "webpack": "3.3.0", 
    "zone.js": "0.8.14" 
    } 

をしても次があるsystemjs.config.jsのファイルがあります。

map: 
    { 
     ... 
     'sockjs-client': 'node_modules/sockjs-client', 
     '@stomp/stompjs': 'node_modules/@stomp/stompjs' 
    }, 
    packages: 
    { 
     ... 
     'node_modules/sockjs-client': { main: './dist/sockjs.js' }, 
     'node_modules/@stomp/stompjs': { main: './lib/stomp.js' } 
    } 

コンストラクタメソッドが見つからない理由を理解できません。 このエラーを理解して修正する助けとなることはありますか?

答えて

関連する問題