Question

我正在开发一个在后期采用Browserify的项目。

＆＃xA;＆＃xA;

我们手动包含许多React组件及其依赖项，如＆lt; script＆gt; 标记需要它们的地方，包括少数文件，包括常见的React组件。

＆＃xA;＆＃xA;

 ＆lt;！ - 包括ComponentA和依赖项，包括React  - ＆gt;＆＃xA;＆lt; script src =“/ js / browserify-bundle.js”＆gt;＆lt; / script＆gt;＆＃xA;＆＃xA;＆lt; script src =“/ js / react.min.js”＆gt;＆lt; / script＆gt; ＆lt;！ -  React也包括在这里 - ＆gt;＆＃xA;＆lt; script src =“/ js / react-dom.min.js”＆gt;＆lt; / script＆gt;＆＃xA;＆lt;！ - ...更多依赖项...  - ＆gt;＆＃xA;＆lt; script src =“/ js / common-components.js”＆gt;＆lt; / script＆gt; ＆＃xA;＆lt ;!  -  ...更多组件/脚本包括...  - ＆gt;＆＃xA;

＆＃xA;＆＃xA;

我是处理第一个被编写为ES6模块的React组件，但由于我们的情况，模块依赖性最终被加载两次;首先来自脚本标签中给出的手动依赖，然后来自Browserify捆绑包。

＆＃xA;＆＃xA;

删除包含React的脚本标记会破坏公共组件，但将其保留在原因中会导致React < a href =“https://facebook.github.io/react/warnings/refs-must-have-owner.html"rel =”nofollow“>这样的重复错误因为那里有两个Reacts浮动。

＆＃xA;＆＃xA;

这是否意味着暂时无法通过（例如）告诉Browserify使用手册React include来弥补这一差距？有了这个，我们可以开始使用Browserify零碎。是否绝对有必要将所有组件/脚本都放入ES6模块中并使所有内容都使用Browserify来避免这种情况？

＆＃xA;

Answer 1

也许您可以根据自己的情况使用browserify-shim。它允许你声明已从全局范围中获得模块。

在package.json：

中

"browserify-shim": {
  "react": "global:React"
},
"browserify": {
  "transform": [ "browserify-shim" ]
}

希望这可以让你暂时缩小差距。

我可以将Browserify捆绑/模块脚本与<script src =“”>包含的脚本混合使用吗？

1 个答案: