React Native - ExpoSQLite cannot open DB on iOS

Question

I'm trying to load a pre-existing database using expo-sqlite. It works perfectly fine on Android, however on iOS I'm having a few problems.

My code for opening the DB is as follows:

return (
    <>
        <SQLiteProvider databaseName="@/data/products.db" assetSource={{ assetId: require('@/data/products.db') }}>
            <ResultRenderer profile={profile} />
            <Text>{buildSQLquery(profile)}</Text>
        </SQLiteProvider>
    </>
);

However, on iOS, this just throws:

ERROR  Error: The file “ExponentAsset-171a7c1e81bf6393675b790dec0140a7.db” doesn’t exist.
 
This error is located at:
    in SQLiteProviderNonSuspense (created by SQLiteProvider)
    in SQLiteProvider (created by RenderScreen)
    in RenderScreen
    in Unknown (created by Route((results)/results))
    in Suspense (created by Route((results)/results))
    in Route (created by Route((results)/results))
    in Route((results)/results) (created by SceneView)
    in StaticContainer
    in EnsureSingleNavigator (created by SceneView)
    in SceneView (created by SceneView)
    in RCTView (created by View)
    in View (created by DebugContainer)
    in DebugContainer (created by MaybeNestedStack)
    in MaybeNestedStack (created by SceneView)
    in RCTView (created by View)
    in View (created by SceneView)
    in RNSScreen (created by Animated(Anonymous))
    in Animated(Anonymous) (created by InnerScreen)
    in Suspender (created by Freeze)
    in Suspense (created by Freeze)
    in Freeze (created by DelayedFreeze)
    in DelayedFreeze (created by InnerScreen)
    in InnerScreen (created by Screen)
    in Screen (created by SceneView)
    in SceneView (created by NativeStackViewInner)
    in Suspender (created by Freeze)
    in Suspense (created by Freeze)
    in Freeze (created by DelayedFreeze)
    in DelayedFreeze (created by ScreenStack)
    in RNSScreenStack (created by ScreenStack)
    in ScreenStack (created by NativeStackViewInner)
    in NativeStackViewInner (created by NativeStackView)
    in RCTView (created by View)
    in View (created by SafeAreaProviderCompat)
    in SafeAreaProviderCompat (created by NativeStackView)
    in NativeStackView (created by NativeStackNavigator)
    in PreventRemoveProvider (created by NavigationContent)
    in NavigationContent
    in Unknown (created by NativeStackNavigator)
    in NativeStackNavigator
    in Unknown (created by RootLayout)
    in ThemeProvider (created by RootLayout)
    in RootLayout
    in Unknown (created by Route())
    in Suspense (created by Route())
    in Route (created by Route())
    in Route() (created by ContextNavigator)
    in RNCSafeAreaProvider (created by SafeAreaProvider)
    in SafeAreaProvider (created by wrapper)
    in wrapper (created by ContextNavigator)
    in EnsureSingleNavigator
    in BaseNavigationContainer
    in ThemeProvider
    in NavigationContainerInner (created by ContextNavigator)
    in ContextNavigator (created by ExpoRoot)
    in ExpoRoot (created by App)
    in App (created by ErrorOverlay)
    in ErrorToastContainer (created by ErrorOverlay)
    in ErrorOverlay (created by withDevTools(ErrorOverlay))
    in withDevTools(ErrorOverlay)
    in RCTView (created by View)
    in View (created by AppContainer)
    in RCTView (created by View)
    in View (created by AppContainer)
    in AppContainer
    in main(RootComponent), js engine: hermes

I don't quite know where this filename is coming from, however I'm wondering how to fix this.

I already tried opening the DB using this code:

const db = SQLite.openDatabaseSync("@/data/products.db", {});
const result = db.getAllSync("SELECT * from products")
console.log(result);

That weirdly throws another error:

ERROR  Error: FunctionCallException: Calling the 'initSync' function has failed (at ExpoModulesCore/SyncFunctionDefinition.swift:87)
→ Caused by: ArgumentCastException: The 1st argument cannot be cast to type SharedObject<NativeDatabase> (at ExpoModulesCore/JavaScriptUtils.swift:61)
→ Caused by: NativeSharedObjectNotFoundException: Unable to find the native shared object associated with given JavaScript object (at ExpoModulesCore/DynamicSharedObjectType.swift:58)
 
This error is located at:
    in IntroScreen
    in Unknown (created by Route((intro)/index))
    in Suspense (created by Route((intro)/index))
    in Route (created by Route((intro)/index))
    in Route((intro)/index) (created by SceneView)
    in StaticContainer
    in EnsureSingleNavigator (created by SceneView)
    in SceneView (created by SceneView)
    in RCTView (created by View)
    in View (created by DebugContainer)
    in DebugContainer (created by MaybeNestedStack)
    in MaybeNestedStack (created by SceneView)
    in RCTView (created by View)
    in View (created by SceneView)
    in RNSScreen (created by Animated(Anonymous))
    in Animated(Anonymous) (created by InnerScreen)
    in Suspender (created by Freeze)
    in Suspense (created by Freeze)
    in Freeze (created by DelayedFreeze)
    in DelayedFreeze (created by InnerScreen)
    in InnerScreen (created by Screen)
    in Screen (created by SceneView)
    in SceneView (created by NativeStackViewInner)
    in Suspender (created by Freeze)
    in Suspense (created by Freeze)
    in Freeze (created by DelayedFreeze)
    in DelayedFreeze (created by ScreenStack)
    in RNSScreenStack (created by ScreenStack)
    in ScreenStack (created by NativeStackViewInner)
    in NativeStackViewInner (created by NativeStackView)
    in RCTView (created by View)
    in View (created by SafeAreaProviderCompat)
    in SafeAreaProviderCompat (created by NativeStackView)
    in NativeStackView (created by NativeStackNavigator)
    in PreventRemoveProvider (created by NavigationContent)
    in NavigationContent
    in Unknown (created by NativeStackNavigator)
    in NativeStackNavigator
    in Unknown (created by RootLayout)
    in ThemeProvider (created by RootLayout)
    in RootLayout
    in Unknown (created by Route())
    in Suspense (created by Route())
    in Route (created by Route())
    in Route() (created by ContextNavigator)
    in RNCSafeAreaProvider (created by SafeAreaProvider)
    in SafeAreaProvider (created by wrapper)
    in wrapper (created by ContextNavigator)
    in EnsureSingleNavigator
    in BaseNavigationContainer
    in ThemeProvider
    in NavigationContainerInner (created by ContextNavigator)
    in ContextNavigator (created by ExpoRoot)
    in ExpoRoot (created by App)
    in App (created by ErrorOverlay)
    in ErrorToastContainer (created by ErrorOverlay)
    in ErrorOverlay (created by withDevTools(ErrorOverlay))
    in withDevTools(ErrorOverlay)
    in RCTView (created by View)
    in View (created by AppContainer)
    in RCTView (created by View)
    in View (created by AppContainer)
    in AppContainer
    in main(RootComponent), js engine: hermes

I'm very puzzled by this - do you know a way to fix this?

The error does also occur when compiling the app for iOS. So apparently, the file either never gets bundled or is simply not found. I would highly appreciate any help! :) — apioltk
– apioltk, Commented Aug 29, 2024 at 12:04
I have found this help page where it is explained that you need to add the db extension to the Metro bundler. This does not fix the issue, though. — apioltk
– apioltk, Commented Aug 29, 2024 at 13:02

apioltk · Accepted Answer · 2024-08-30 07:48:22Z

I have been able to fix the problem.

This is what you need to do if you encounter it:

create the file "metro.config.js" if it does not already exist
write this code into the file or somehow add the "db" string (or whatever you use as database extension) into the module export resolver.assetExts array:

const { getDefaultConfig } = require("expo/metro-config");

const config = getDefaultConfig(__dirname);

config.resolver.assetExts.push(
    // Adds support for `.db` files for SQLite databases
    "db"
);

module.exports = config;

make sure your database is located inside of the assets folder of your project
change the value databaseName to the filename ONLY - not an entire path! With my example, it would look like this:

<SQLiteProvider databaseName="products.db" assetSource={{ assetId: require('@/assets/databases/products.db') }}>
    <ResultRenderer parsedProfile={parsedProfile} parsedFilter={parsedFilter} />
</SQLiteProvider>

I hope this helps someone else.

Collectives™ on Stack Overflow

React Native - ExpoSQLite cannot open DB on iOS

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related