我使用webpack + babel。我有三个模块看起来像这样：
// A.js
// some other imports here
console.log('A');
export default 'some-const';
// B.js
import someConst from './A';
console.log('B', someConst);
export default 'something-else';
// main.js
import someConst from './A';
import somethingElse from './B';
console.log('main', someConst);当执行main.js时，我看到以下内容：
B undefined
A
main some-const如果我交换main.js中的导入，B成为第一个，我得到：
A
B some-const
main some-const为什么B.js会得到undefined而不是第一个版本中的一个模块？
3条答案
按热度按时间xam8gpfp1#
经过几乎一整天的缩小问题（又名拔头发），我终于意识到我有一个循环依赖。
在
// some other imports here中，A导入另一个模块C，C又导入B。A首先导入到main.js中，因此B最终成为“圆圈”中的最后一个链接，Webpack（或者任何类似于CommonJS的环境，比如Node）只是通过返回A的module.exports（仍然是undefined）来短路它。它变得等于some-const，但是B中的同步代码最终处理的是undefined。通过将
C依赖的代码移出B，消除循环依赖，已经解决了这个问题。希望Webpack能以某种方式警告我这一点。**编辑：**最后一点，正如@cookie，there's a plugin for circular dependency detection所指出的，如果你想避免[再次]遇到这个问题。
mpgws1up2#
这个plugin（指向上面）也为我解决了这个问题。
我建议设置此标志以避免将来添加其他循环依赖项。
还有一个eslint plugin可以解决这个问题。
6mw9ycah3#
在我的例子中，通过在webpack配置中将输出libraryTarget更改为commonjs2，问题得到了解决：