組件無法從 React Native 中的 index.d.ts 文件自動導入類型

Question

我有一個名為 ColorBox 的組件，在它的文件夾中，我有組件本身、它的樣式和一個索引文件以及我的類型的index.d.ts文件：

  ColorBox
   |- Colorbox.tsx
   |- index.ts
   |- styles.ts
   |- index.d.ts

這是我的index.d.ts文件：

export interface IProps {
  colorName: string;
  colorHex: string;
}

export interface IBGColor {
  backgroundColor: string;
}

這是我的ColorBox.tsx組件：

import React from 'react';
import { View, Text, StyleSheet } from 'react-native';

import styles from './styles';

const ColorBox: React.FC<IProps> = ({ colorName, colorHex }) => {
  const boxColor: IBGColor = {
    backgroundColor: colorHex,
  };

  return (
    <View style={[styles.box, boxColor]}>
      <Text style={styles.boxText}>{colorName}</Text>
    </View>
  );
};

export default ColorBox;

問題是IProps和IBGColor類型不會從index.d.ts文件自動導入，它是如何工作的，我一直在閱讀有關 TypeScript 的文章，有人提到如果將index.d.ts文件放入其中的模塊中，TypeScript 將依賴它並嘗試從該文件中查找類型，但為什么它在我的組件中不起作用？

我應該在我的模塊中顯式導入使用過的類型嗎？ 如果是這樣，那么index.d.ts文件為我們提供了什么好處？

此外，我使用常規的 react-native init 項目，而不是任何其他花哨的樣板！

Answer 1

index.d.ts用於聲明全局類型，因為這些類型在你的整個項目中都是可用的，所以你不需要在你的組件中導入它，或者在index.d.ts文件中導出它，只需使用它.