2015-08-20 52 views
4

我正在嘗試使用strophe.jsrelay-starter-kit。我檢出了relay-starter-kit,加了"strophe": "^1.2.2"package.json並跑npm install如何使用requirejs導入strophe?

我無法找到如何導入strophe沒有得到錯誤。如果我只是嘗試import Strophe from 'strophe';,則會收到webpack無法解析的錯誤strophe-polyfill。我添加了一個指向主strophe.js文件的解析別名,但這沒有幫助(我只是得到一個控制檯消息Uncaught ReferenceError: Strophe is not defined)。

它看起來像strophe有一些奇怪的模塊系統(它在github中提到AMD,但我認爲這意味着我可以只是require它,但顯然不是)。我見過的所有例子都將它導入到HTML文件中,並使全局名稱空間混亂。我需要從反應中使用它,所以我認爲這不會起作用。

如何導入strophe以在我的es6文件中使用?

回答

4

因爲我浪費了我對這種生活的時間,這裏的答案:

  1. 包括與HTML文件的strophe:

  2. 編輯server.js做出的WebPack暴露的strophe爲靜態路徑:

    app.use('/ node_modules/strophe',express.static('node_modules/strophe'));

  3. 在反應組件中,不需要導入strophe,因爲它現在是全局可用的。取而代之的是連接,例如:

    var connection = new Strophe.Connection(「ws://」+ server +「:5280/websocket /」);

+0

感謝您抽出寶貴下跌。我也遇到了這個問題,並希望有一個更清晰的解決方案,涉及一些神奇的Webpack配置來解決這個問題。 – danyim

0

嘗試使用import * as XMPP from strophe.js然後調用

var connection = new XMPP.Strophe.Connection(BOSH_SERVICE)連接服務器