使用文件夹名称解析 Typescript 文件答案

【问题标题】：Resolve Typescript file by using folder name使用文件夹名称解析 Typescript 文件
【发布时间】：2018-06-04 21:35:40
【问题描述】：

我正在将我的代码从 ES6 移植到 .TS / .TSX

给定这样的文件夹结构：

Table/Tables.tsx

从 ES6 中的另一个 react 组件导入我曾经能够做到这一点：

import Table from '../Table'

即按文件夹名称解析导入会足够聪明。现在我已经切换到 Typescript，我必须更详细地导入（从另一个 .tsx 文件）；

import Table from '../Table/Table'

我正在使用带有 React Starter Kit 的 Webpack。

【问题讨论】：

【解决方案1】：

在您要导入的每个文件夹中，都有一个 index.ts 文件，其中包含该文件夹的所有导出。然后您将能够通过仅指定文件夹路径来导入单个组件

import {table} from ../table/

【讨论】：

【解决方案2】：

我实际上发现了同样的问题，问的有点不同here

package.json 修改对我不起作用，所以我只是将约定更改为在每个子文件夹中命名组件 Index.tsx。

【讨论】：