次の問題があります。 私は、角-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' }
}
を
コンストラクタメソッドが見つからない理由を理解できません。 このエラーを理解して修正する助けとなることはありますか?