24

I know VSCode supports auto import for JavaScript.

For some reason, it does not work with React Native. There is even a dedicated section on the VSCode website for this. But it only answers how to fix this problem for Typescript (using allowSyntheticDefaultImports). I want it for JavaScript (ES6).

I tried explicitly setting "javascript.suggest.autoImports": true, in my settings.json but that wouldn't change anything, since true is the default anyways.

How to get auto imports for React Native with JavaScript in VSCode?

PS: This plugin (suggested in this similar question) is also only for TypeScript. Besides that, since VSCode includes auto import out of the box there should be a solution without an extension for RN and JS.

J. Hesters
  • 13,117
  • 31
  • 133
  • 249

4 Answers4

0

You might have the 'Auto Imports' option disabled.
In VSCode go to Settings and search for 'Auto Imports' option, it should be something like this:

enter image description here

Just activate it if it's disabled and you'll be fine.

Yunnosch
  • 26,130
  • 9
  • 42
  • 54
Mohamed Abkal
  • 11
  • 2
0

  1. Install Auto Imports VSC extension, and enable Auto-imports options(for JS) in the VSC settings (File -> Preferences -> Settings).

  2. You may try ctrl+space (for example, after placing the cursor inside the <Text> element) and select the import element from the displayed options.

Abilash Ananthula
  • 1
  • 1
0

For me the issue was neither the plug in nor VSCode.

I tried selecting suggestions with library name besides it and it worked for me. i.e if I want component then I will select Componet react from the suggestion and it worked.

Iva
  • 2,447
  • 1
  • 18
  • 28
0

If you have already checked and enabled 'Javascript: Auto Import' in the User setting but it still doesn't work, it might still be some other causes that you hadn't aware of:

  • Check higher priority preference which's Workspace setting, in the tab next to User in the Setting window. In case you prefer configuration in the script. There's a file setting.json resides in the .vscode folder

Additional information: In your project/workspace root folder, look for the folder with the name ".vscode" and the "setting.json" file, in there storing preferences that affect to only what's inside the workspace. Look for anything that may cause the unintended settings and update it following your demand.

If you can not find anything like that. Then try re-install whatever "Auto import" extension you are using. Reload the editor and try again. Most of my editor errors were fixed by just simply reloading the editor.

Hope that might help!

ndnam198
  • 21
  • 5