从React中的文件夹导入索引（.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文件＃34;导入文件夹＆＃34;。

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，这些文件将在导入时处理打字稿中的转换。