在 nodejs 服务器和 react web 客户端之间共享 javascript 类答案

【问题标题】：sharing javascript classes between nodejs server and react web client在 nodejs 服务器和 react web 客户端之间共享 javascript 类
【发布时间】：2018-07-31 15:03:58
【问题描述】：

我有一些在我的节点服务器中运行的 javascript 类，我希望在我的 react web 客户端中重用它们。问题（我认为）是节点代码使用 require 和 module.exports 语法，但客户端代码库使用 import 和导出...看来我不能将两者混合使用。

有没有一种明智的方法可以在我的客户端代码中包含一些这样的服务器端类而不重复？

[编辑] 我面临的问题与重用包含 module.export 和异步方法的代码无关。

【问题讨论】：

你也可以在node中使用import和export
您可以将import/export 与node 一起使用，问题是它对您如何使用它的方式固执己见，并希望您的所有JavaScript 都具有.mjs 扩展名。 It's also experimental。你使用的是 webpack 还是其他打包工具？
使用webpack.js.org 将包含import/export 的代码捆绑到服务器和客户端包中。
我想在客户端使用一点服务器代码。将我的所有服务器代码更改为 .mjs（使用导入/导出）目前不是一个选项，而且我认为它不会起作用，因为 react 无法识别导入 mjs 文件。

标签： javascript node.js reactjs

【解决方案1】：

CommonJS 模块和module.export 是 Node.js 和 React 客户端应用程序的共同点。

由于预计 React 应用程序将使用转译器 (Babel) 和捆绑工具 (Webpack) 构建，因此 ES 和 CommonJS 模块都可以由 Webpack 处理。共享的 CommonJS 模块可以在客户端 ES 模块中imported。他们不会以这种方式获得 ES 模块的好处，尤其是 tree-shaking。

【讨论】：

感谢您的回复。但我不明白你在说什么。我似乎无法在反应应用程序中使用为节点（使用 module.export）编写的类。它只是不编译。
您应该能够像往常一样导入它们。 “似乎无法”和“无法编译”是什么意思？您是否收到错误消息？这个问题没有说明问题。
嗯，它开始工作了。当我第一次尝试对包含节点代码的目录进行符号链接以使其出现在我的 react src 中时，我遇到了一堆错误。但是，当我再次尝试时，它只使用一两个文件就可以了。我猜目录中的一个文件包含一些 react 不喜欢的东西（对不起，我不再有错误了）。总之，您可以将旧式节点代码添加到 React 源代码树。
@pomo 总而言之，您可以将旧式节点代码添加到 React 源代码树。 - 这是正确的。您在 NPM 中使用的许多第三方库都用作 CommonJS（Node 样式）模块。当您的应用与 Webpack/Rollup/etc 捆绑在一起时，这应该不是问题。
对了，我终于回到了原来的错误。首先，由于某种原因，您不能在具有 model.exports 的代码中使用异步。删除所有这些后，我得到“TypeError：无法分配给对象的只读属性'exports'”，我在这里讨论过github.com/webpack/webpack/issues/4039

【解决方案2】：

如果你的节点版本不支持导入导出，你可以检查 babel 将其转换成你想要的 ES 版本。检查this example

【讨论】：

谢谢。我试过了，但是一旦我这样做了，我就得到了一个与我使用异步等待有关的错误。大约一两个小时后，我放弃了。