我正在尝试关注如何使用this的Spring
websockets
教程。我使用webpack
捆绑我的代码和babel
从ES6
转换它。我试图用正常的sockjs
声明引入import
。
import SockJS from 'sockjs'
但是当webpack
运行时,我会丢失模块错误,
ERROR in ./~/stompjs/lib/stomp-node.js
Module not found: Error: Cannot resolve module 'net' in /Users/name/Developer/cubs-stack-4/cubs-webapp/node_modules/stompjs/lib
@ ./~/stompjs/lib/stomp-node.js 14:8-22
ERROR in ./~/websocket/package.json
Module parse failed: /Users/name/Developer/cubs-stack-4/cubs-webapp/node_modules/websocket/package.json Line 2: Unexpected token :
You may need an appropriate loader to handle this file type.
| {
| "_args": [
| [
| "websocket@latest",
@ ./~/websocket/lib/version.js 1:17-43
主要是因为它期待在Node
上运行。
我有两个问题。
首先,如何使用stompjs
语句将import/require
放入浏览器端代码?
其次,如何在教程中,他们可以在stompjs
中删除HEAD
并且它不会在浏览器中爆炸,但是当我通过webpack
运行“相同”代码时它会这样做吗?
似乎Spring的文档中引用的stompjs库已经不再开发了,但是有一个fork维护,并提供了如何将它添加到项目中的说明:https://github.com/stomp-js/stomp-websocket
以下是我用来解决此问题以及在Spring后端的带有websockets的React应用程序中工作的步骤:
# Add sockjs and stompjs dependencies
npm install sockjs-client --save
npm install @stomp/stompjs --save
然后将其导入您的应用:
import SockJS from "sockjs-client"
import Stomp from "@stomp/stompjs"
您现在应该能够成功使用Spring文档中的前端代码。
你必须在package.json中导入"sockjs-client": "^1.0.3"
。
然后你可以导入它
import SockJS from 'sockjs-client'
我的webpack.config.js
包含库'sockjs-client'
。另外,我添加了以下conf,以便忽略丢失的net
模块。
node: {
net: 'empty',
tls: 'empty',
dns: 'empty'
}
资料来源:https://github.com/hapijs/joi/issues/665#issuecomment-113713020
安装'net'依赖解决了我的问题
npm i sockjs-client --save
npm i stompjs --save
npm i net
并像这样导入
import * as SockJS from 'sockjs-client';
import * as Stomp from 'stompjs';
要在浏览器中使用stompjs,只需打开文件your_path/node_modules/stompjs/index.js
,注释如下:
var Stomp = require('./lib/stomp.js');
// var StompNode = require('./lib/stomp-node.js');
module.exports = Stomp.Stomp;
// module.exports.overTCP = StompNode.overTCP;
// module.exports.overWS = StompNode.overWS;