typescript - 嘗試將 Stomp 加到 SockJS 到 Angular 應用:TS2307 找不到模組
我已經下載了一個可用的純 JavaScript 範例,用於連接到 WebSocket Spring 通道,但我在將此功能導入 Angular 2 應用程式時遇到困難。
我已經在 package.json 中添加了導入:
"dependencies": {
"@angular/common": "~2.2.1",
(...)
"stompjs": "2.3.3",
"sockjs-client": "1.1.1"
},
然後建議修改 systemjs.config.js:
(function (global) {
System.config({
paths: {
// paths serve as alias
'npm:': 'node_modules/'
},
// map tells the System loader where to look for things
map: {
// our app is within the app folder
app: 'app',
// angular bundles
'@angular/core': 'npm:@angular/core/bundles/core.umd.js',
(...)
'sockjs-client': 'npm:sockjs-client',
'stompjs': 'npm:stompjs'
},
// packages tells the System loader how to load when no filename and/or no extension
packages: {
(...)
'sockjs-client': {
defaultExtension: 'js'
},
stompjs: {
defaultExtension: 'js'
}
}
});
})(this);
但是當我添加導入時
import {Stomp} from "stompjs";
我收到 “TS2307: 找不到模組” 的錯誤訊息,並且程式碼編譯為:
var stompjs_1 = require("stompjs");
導致無效的 http 網址:
http://localhost/myapp/node_modules/stomp-client
而不是 JS 檔案的路徑。
我在這裡做錯了什麼?我已經查閱了許多 Stack Overflow 的答案,例如這裡:如何在 Angular 2 TypeScript 應用中使用 moment.js 庫?我也嘗試了做所有類似的操作。我還嘗試了其他的導入語法,比如:
import * as Stomp from 'stompjs';
但什麼都不起作用。
如何在 Angular2 中使用這兩個函式庫?
答案#1
你需要在 systemjs.config.js 中寫入你函式庫中 JavaScript 檔案的完整路徑:
例如,對於 stompjs,根據 Github 上的倉庫,它可能是:
map {
(...)
'stompjs': 'npm:stompjs/lib/stomp.min.js'
},
packages: {
// Remove stompjs from here, because you already have the full path
}
之後,你可以使用這個語法來使用你的程式庫:
import * as stomp from 'stompjs';
你仍然會遇到錯誤 error TS2307: Cannot find module,但至少它可以在你的瀏覽器中運作。
我希望這有幫助。
答案#2
這似乎為我解決了這個錯誤:
npm install --save-dev @types/sockjs-client
npm install stompjs
