Node.js环境下MyScriptJS XMLHttpRequest未定义问题的技术咨询

我之前也碰到过类似的Node.js环境下适配浏览器端库的情况，你的临时修复思路完全正确，咱们来逐个解决你的三个问题：

1. 是否应创建Issue/PR，将引入语句添加到MyScript的Node包中？ #

非常建议你先创建Issue反馈这个问题，因为MyScriptJS原本定位是浏览器端图形库，其"No UI"示例可能未充分考虑Node.js环境的兼容性（浏览器原生自带XMLHttpRequest，但Node.js中没有全局的该对象）。

如果要提交PR的话，不建议直接硬加require语句——这会导致浏览器环境下报错（浏览器不支持require）。更合理的做法是在MyScript的代码中添加环境判断逻辑，只有在检测到当前是Node.js环境（或XMLHttpRequest未定义时），才动态引入依赖：

if (typeof XMLHttpRequest === 'undefined') {
  XMLHttpRequest = require("xmlhttprequest").XMLHttpRequest;
}

这样既解决了Node.js环境的问题，又不会影响浏览器/React等前端场景的正常使用。

2. 有没有办法在我的应用中引入该依赖，使其对import * as MyScript from "myscript"导入的MyScript生效？ #

有的，你可以在导入MyScript之前，将XMLHttpRequest挂载到Node.js的全局对象上，这样MyScript内部调用XMLHttpRequest时会自动使用全局的这个实例：

// 必须放在导入MyScript的代码之前
global.XMLHttpRequest = require("xmlhttprequest").XMLHttpRequest;

// 之后正常导入MyScript
import * as MyScript from "myscript";

这种方式不需要修改MyScript的源码，就能快速解决你的问题。

3. 有没有条件引入该包的方法，避免在React应用中冗余引入？ #

当然有，你可以通过环境判断来区分Node.js后端和浏览器/React前端场景：

// 判断当前是否为Node.js环境（浏览器中window对象存在，Node.js中不存在）
if (typeof window === 'undefined') {
  // 仅在Node.js环境下引入并挂载XMLHttpRequest
  global.XMLHttpRequest = require("xmlhttprequest").XMLHttpRequest;
}

// 统一导入MyScript
import * as MyScript from "myscript";

另外，你还可以在package.json中将xmlhttprequest标记为optionalDependencies，这样在前端构建时（比如React的webpack打包）会自动忽略这个依赖，不会增加包体积。

内容的提问来源于stack exchange，提问作者Sigex