我有以下问题。 我使用angular-cli工具创建了一个示例项目，我在app.component.ts文件中有以下代码
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) => {
...
});
}
}
在package.json文件中我有：
"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"
}
此代码工作正常。建立客户端与服务器的通信。
我已将相同的app.component.ts文件添加到另一个项目（不是使用angular-cli工具创建），但在调用connect（）方法期间，我收到以下错误：
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' }
}
我无法弄清楚为什么它找不到构造函数方法。 有任何帮助来理解和修复此错误吗？