diff --git a/docs/install-cra.mdx b/docs/install-cra.mdx
index f016c5a49..a207768f2 100644
--- a/docs/install-cra.mdx
+++ b/docs/install-cra.mdx
@@ -80,7 +80,7 @@ Put the below code in your App.js
 import React from 'react';
 import { NativeBaseProvider, Box } from 'native-base';
 
-function App() {
+export default function App() {
   return (
     <NativeBaseProvider>
       <Box>Hello world</Box>
diff --git a/docs/install-expo.mdx b/docs/install-expo.mdx
index 99a117f78..08b909648 100644
--- a/docs/install-expo.mdx
+++ b/docs/install-expo.mdx
@@ -62,7 +62,7 @@ Put the below code in your App.js
 import React from 'react';
 import { NativeBaseProvider, Box } from 'native-base';
 
-function App() {
+export default function App() {
   return (
     <NativeBaseProvider>
       <Box>Hello world</Box>
diff --git a/docs/install-rn.mdx b/docs/install-rn.mdx
index ca4746850..88d0e5010 100644
--- a/docs/install-rn.mdx
+++ b/docs/install-rn.mdx
@@ -56,7 +56,7 @@ Put the below code in your App.js
 import React from 'react';
 import { NativeBaseProvider, Box } from 'native-base';
 
-function App() {
+export default function App() {
   return (
     <NativeBaseProvider>
       <Box>Hello world</Box>