如何在浏览器中集成遗留的JavaScript和NodeJS

假设的传统scheme:

假设我有4个脚本,它们被简单地连接在一起作为一个单独的脚本进行部署,以在浏览器中提供一个全局命名空间的实用程序库。 然后我有一个单独的应用程序脚本,利用该库。 就像是:

<script src="library.js"></script> <script src="app.js"></script> 

在我的app.js脚本中,通过名称空间调用库方法

 var id = lib.id(prefix); 

我发现4个库脚本中的1个是我想要变成Node模块的一个有用的工具。 我复制它并创build一个包并将其发布到npm以用于新的开发。

问题:现在我有两个版本的脚本来维护 – 一个用于Node,一个用于旧版库。

有一种方法可以在节点模块和旧版库中包含一个公用文件吗? 还是我坚持维护两个版本的文件,直到我们逐步淘汰遗留代码?

附加信息:

我看着浏览器和webpack,认为它们可能是有用的,但都有一个问题,我不知道如何解决。 除非最终模块定义了全局variables,否则我不能在传统代码中使用该模块,因为没有可用的命令。 换句话说,我不能浏览一个Node模块,然后把它放到一个旧网页中,并在我现有的app.js中使用它,因为我不能调用var mymodule = require('mymodule') 。 有没有什么办法让browserify或者webpack定义和公开一个require函数让我从旧的代码库访问我的新Node模块? 当然,这不是一个独特的场景。

最好的办法是使用UMD模式来确保模块既可以用作全局的,也可以用于普通的(即节点)系统。

最适合你的模式是returnExports 。 这可以确保所有导出的属性都应用于全局对象(即窗口)或节点中的模块对象。

既然你没有使用AMD,你可以在某种程度上简化模式,并删除第18行和第42行的if语句的第一部分。

这将需要您重新组织您的代码,以便它符合模式。

还有其他的模式可以使用,比如commonJsStrictGlobal ,但是我个人更喜欢returnExports。