Does Atom/Nuclide provide auto-import for react-native components

Question

Is there a way to have Atom generate import statements for components I add to my react-native files?

When adding a standard react-native component (like a Navigator) while editing react-native code in the Atom/Nuclide editor, I find I need to manually write import statements. Is this expected?

In the traditional native IDE world (Android Studio, XCode), import statements are auto-generated by the IDE. Is there an atom package for this?

Example:

import React, { Component } from 'react'
import { AppRegistry } from 'react-native'

class TestProject extends Component {
  render() {
    return (
      <Navigator
      ...

In the above, line 2 should become:

import { AppRegistry, Navigator } from 'react-native'

Answer 1

For React-Native app development, Atom works as an editor only. The feature you are asking about isn't provided with Atom yet. Let's hope we will get an update in future which will include this feature.

But till then, give a shot to Visual Studio Code, where you'll need to install a an extension of React-Native Tools.

VSCode with React-Native Tools extension provides this functionality, where the import statements are generated automatically. We also get suggestions of available classes and methods at the time of development, which is really useful from developer's perspective. We can also debug and run the project directly from VSCode without console or native IDE like Android Studio or Xcode.