Javascript 如何让babel正确识别导入路径的es6模块名称

我的董事结构如下：

js\
富吧\
abc.js
index.js

在abc.js

中，我有：

导出默认类ABC{..}

在
index.js中我有：

从“foo-bar/ABC”导入ABC
导出{ABC}

我正在使用WebPack进行构建，我有以下规则：

module.exports={
条目：“富吧”，
模块：{
规则：[
{
测试：/\.js$/,，
排除：/node_模块/，
使用：{
加载器：“巴别塔加载器”
}
}
]
}
}

但是，当我尝试构建时，我在使用
babel loader
时遇到以下错误：

./foo-bar/index.js（../node_-modules/babel-loader/lib.//foo-bar/index.js）中出错
未找到模块：错误：无法解析“/Users/myname/projects/my app/assets/js/foo bar”中的“foo bar/abc”
@./foobar/index.js（../node_modules/babel loader/lib！。/foobar/index.js）194:0-40197:0-38

如何让babel识别在同一项目中导入的正确模块名？我希望避免相对路径。
import
语句中的路径总是相对于当前模块目录（
\u dirname
）

尝试以下操作：
从“ABC”导入ABC

此外，由于您使用的是命名导入/导出，我建议您仅使用命名导入/导出，原因有很多。特别是为了改善建造时的树木晃动

因此，最好写下：

类ABC{..}；
出口{ABC}；

从“ABC”导入{ABC}；
出口{ABC}；

假设您正在从
index.js
文件重新导出多个模块

编辑：

由于您正在使用Webpack进行捆绑，因此如果需要，可以使用绝对路径，方法是在路径前面加上
/
。看

但是，
/
解析为文件系统的根

您可以按如下方式更改您的网页包配置：

const{resolve}=require（'path'）；
module.exports={
条目：“富吧”，
决心：{
root:path.resolve（'./js'）//或指向“js”目录的任何路径。
},
模块：{
规则：[
{
测试：/\.js$/,，
排除：/node_模块/，
使用：{
加载器：“巴别塔加载器”
}
}
]
}
}

然后尝试：
从“foo-bar/ABC”导入ABC（不带前导的
/
）