在 TypeScript Expo 应用程序中导入和使用react-native-gifted-charts 时遇到问题

Question

我最近使用 Expo CLI 和使用 TypeScript 模板的命令

expo init appName

设置了一个简单的 TypeScript 应用程序。该应用程序运行良好，直到我尝试集成react-native-gifted-charts库以包含条形图。不幸的是，我遇到了一个无法解决的问题。

这是我尝试使用react-native-gifted-charts中的BarChart组件的代码片段：

import { BarChart } from "react-native-gifted-charts";
...
...

<View style={styles.chartContainer}>
          <BarChart
            data={Data}
            width={300}
            height={200}
            chartConfig={{
              backgroundGradientFrom: "#1E2923",
              backgroundGradientTo: "#08130D",
              fillShadowGradient: "#45E355",
              fillShadowGradientOpacity: 0.8,
              color: (opacity = 1) => `rgba(255, 255, 255, ${opacity})`,
              labelColor: (opacity = 1) => `rgba(255, 255, 255, ${opacity})`,
              style: {
                borderRadius: 16,
              },
            }}
            style={{
              marginVertical: 8,
              borderRadius: 16,
            }}
          />
        </View>

当我尝试使用上述代码时，遇到一条指向 NativeModules.js 文件的错误消息。然而，在检查 NativeModules.js 文件时，我注意到它似乎包含 TypeScript 内容，即使其文件扩展名是 .js。这种差异让我感到困惑，并导致文件中出现多个错误行。

我不确定我是否错误地使用了 BarChart 组件，或者是否发生了其他情况。我正在寻求以下几点的澄清：

如何在基于 TypeScript 的 Expo 应用程序中正确集成和使用 React-native-gifted-charts 库，特别是 BarChart 组件？

为什么会自动生成带有 .js 文件扩展名的 NativeModules.js 文件，同时包含类似 TypeScript 的内容？ 对于解决 NativeModules.js 文件的问题和相关错误有什么建议吗？

Answer 1

我是 react-native-gifted-charts 的作者和维护者。您的问题与expo无关，而是与react-native-gifted-charts有关。图书馆从一开始就存在一些与 type 相关的问题。 值得庆幸的是，从

1.4.23

版本开始，库中不再存在与 type 相关的问题。截至今天的最新版本是

1.4.28

。该库之前导出了原始打字稿。现在它导出已编译的 javascript 文件和类型声明（

.d.ts

文件）。这已经解决了与打字稿相关的所有问题。

Answer 2

expo 文档进行开发构建