Programming Tutorials

'import' and 'export' may only appear at the top level - React Native

By: Mary in React-Native Tutorials on 2023-04-17  

This error message usually occurs when an import or export statement is placed inside a block or a function, instead of being placed at the top level of a file.

In JavaScript modules, import and export statements can only appear at the top level of a file, not inside functions, loops, or conditionals. If you need to conditionally import a module or dynamically load a module, you can use a dynamic import statement.

Here is an example of how to use a dynamic import statement to conditionally load a module:

async function loadModule(condition) {
  if (condition) {
    const module = await import('./module.js');
    return module;
  } else {
    return null;

It could also mean that accidentally you removed a } or forgot to close a function. So double check your code for missing }.

Make sure that your import and export statements are placed at the top level of your file, outside of any functions, loops, or conditionals.

Add Comment

* Required information


No comments yet. Be the first!

Most Viewed Articles (in React-Native )

Latest Articles (in React-Native)

Session variables in React Native - Expo

use axios in Expo to call APIs

Start background location tracking after login in expo react native

set up a global error handler in React Native (expo)

SafeAreaView in React Native

Some dependencies are incompatible with the installed expo version:

disable the back arrow in the header of a screen in a React Navigation Stack Navigator

react-native-android-location-services-dialog-box alternative in expo

Error Handling in TextInput - React Native

react-native-background-job alternative in expo app

'import' and 'export' may only appear at the top level - React Native

OpenType (OTF) vs TrueType (TTF)

loadAsync() vs useFonts() in expo - react native

expo-secure-store vs expo-file-system in expo - react native

Send push notifications to android/ios sample code using expo - react native