Question

遵循这个要点 https://gist.github.com/ryanflorence/daafb1e3cb8ad740b346

我能够使用Webpack的'resolve.modulesDirectories'为一个非常复杂的应用程序设置一个很酷的文件夹结构 - 我可以通过模块类型导入来引用共享组件：

import MyModule from 'modules/MyModule';

文件在

中

src/app/modules/Foo/modules/Bar/modules/Baz/component.jsx

和MyModule在

src/app/shared/modules/MyModule

问题是，当我尝试运行测试时

mocha --compilers js:babel-core/register $(find src/app -name *.test.jsx)

Babel编译器抛出说它在'modules / MyModule'中找不到任何东西......

Babel编译器配置中是否存在类似于Webpack的“modulesDirectories”？

Answer 1

您应该能够使用Babel的resolveModuleSource选项来重写导入路径，但您需要使用编程API来执行此操作。因此，不要使用Mocha的--compilers选项，而是使用--require加载调用Babel的require hook的脚本并传递resolveModuleSource选项。如果您正在使用Babel v6，请使用babel-register软件包，它看起来像：

require("babel-register")({
  resolveModuleSource: function (source, filename) {
    return filename.replace(/^modules\/.+/, "/abs/path/to/src/app/shared/$0");
  },
});

Answer 2

您必须使用webpack编译测试： https://webpack.github.io/docs/testing.html

如何使用webpack样式的“modulesDirectories”来编译Babel？

2 个答案: