导入索引(.ts|.js) 文件中的文件夹

Question

我有以下文件夹结构：

src/
   Foo/
      index.ts
   Bar/
      index.ts
   index.ts

我想在我的 src/index.ts 文件中导入这样的模块 Foo import Foo from "./Foo";。 这是怎么做到的？因为当我想"导入文件夹"时，webpack 不会从 Foo/和 Bar/ 自动导入 index.ts 文件。

Answer 1

您不必像您提到的那样导入folder。它实际上是通过webpack决心完成的 https://webpack.js.org/configuration/resolve/#resolve-extensions

默认情况下，webpack 正在寻找.js和.json扩展，这意味着当您导入import Foo from './Foo'时，它将尝试查找./Foo/index.js或./Foo/index.json如果找到，它会自动导入。如果您需要将其扩展到打字稿，则需要指定

resolve: {
 extensions: ['.js', '.json', '.ts']
}

当然，通过这种方式，您必须指定ts-loader来处理打字稿文件 https://github.com/TypeStrong/ts-loader 这将在导入时处理从打字稿的转译。