如何在 React JS 中使用 NodeJS npm 包

问题描述 投票：0回答：0

我正在尝试使用带有 React 的 

websocket-stream
npm 包通过 websocket 流式传输麦克风音频，但它是使用 NodeJS 核心模块实现的，因此文档建议使用 Browserify 来打包模块以供浏览器使用，但我该怎么做这？我正在使用 Vite 作为我的构建工具和开发服务器，但是我可以将 Browserify 与 Vite 一起使用吗？

我已经尝试使用此命令将所有内容与 Browserify 捆绑在一起：

browserify --extensions=.jsx -t [ babelify --extensions .jsx --presets [@babel/preset-env @babel/preset-react ] ] src/main.jsx -o build/app.js

成功构建了 app.js 文件，但每当我运行开发服务器时，我都会继续收到这些错误：

Uncaught TypeError: Cannot read properties of undefined (reading 'from') at node_modules/websocket-stream/node_modules/safe-buffer/index.js

Uncaught ReferenceError: React is not defined

我想这是因为缓冲区是 NodeJS 的核心模块。我已将 

app.js
包含在我的 
index.html
文件中，如下所示：

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <link rel="icon" type="image/svg+xml" href="/vite.svg" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Vite + React</title>
  </head>
  <body>
    <div id="root"></div>
    <script type="module" src="/src/main.jsx"></script>
    <script src="/build/app.js"></script>
  </body>
</html>

这是我的

main.jsx
文件：

import React from "react";
import ReactDOM from "react-dom/client";
import App from "./App.jsx";

ReactDOM.createRoot(document.getElementById("root")).render(<App />);

我的处理方式正确吗？

javascript node.js reactjs websocket browserify
最新问题
© www.soinside.com 2019 - 2025. All rights reserved.