react-native - WebStorm 自动完成和自动导入不起作用

Question

我在 WebStorm 中研究 React-Native。

问题 1

我有一些课程，我想使用 WebStorm 的自动导入功能，它适用于某些课程，但不适用于所有课程。

当我输入 name 并点击Ctrl + Space时，它不会自动导入类。

我也试过Alt + Enter了，列表中没有导入建议。

问题 2

然后我手动导入了这个类，现在 WebStorm 无法显示自动完成的方法建议，当我按下 时Ctrl + Space，我的方法没有在那里列出。

实用程序.js

export function alertMessage(alertMessage) {
  Alert.alert(
    "Alert",
    alertMessage,
    [{ text: "OK", onPress: () => console.log("OK Pressed") }],
    { cancelable: false }
  );
}

是否有一些我缺少的 WebStorm 设置。我想提高我的生产力。

Answer 1

在开发任何（不仅仅是反应）应用程序时实现正确代码完成的最简单方法是通过 IDE 本身添加对所需类型脚本库的支持。假设您使用Web StormIDE 进行开发：

• 去Settings (Ctrl + Alt + S) -> Languages & Frameworks

• 展开 JavaScript-> 库

• 使用react时，建议添加：（react; react-dom; react-native用于移动应用开发）

• Apply完成后点击

Answer 2

您正在使用命名导出语法 ( export function alertMessage()) 导出函数，但将其导入为默认值，并将其别名为Utility; IDE 不知道是什么Utility，因此没有提供完成/自动导入。将导出更改为默认值，或使用命名导入语法导入函数

Answer 3

只需安装即可@types/react-native获得建议、输入提示和自动导入。

Npm

npm install @types/react-native

纱

yarn add @types/react-native

在 Webstorm 中对我来说就像魅力一样 :) 在它不是之前。