[Tutorial] Cannot read property 'initialize' of undefined

I followed the instructions for creating the db tutorial. I got the following error Unhandled JS Exception: TypeError: Cannot read property 'initialize' of undefined. Thinking I did something wrong, I recreated it. Same error. I’ve scoured the internet for a solution without success.

My environment package.json

{
  "name": "movie_directory",
  "version": "0.0.1",
  "private": true,
  "scripts": {
    "android": "react-native run-android",
    "ios": "react-native run-ios",
    "start": "react-native start",
    "test": "jest",
    "lint": "eslint ."
  },
  "dependencies": {
    "@nozbe/watermelondb": "^0.16.1",
    "@nozbe/with-observables": "^1.0.5",
    "native-base": "^2.13.12",
    "rambdax": "^3.7.0",
    "react": "16.11.0",
    "react-native": "0.62.2",
    "react-native-fullwidth-image": "^0.1.3",
    "react-native-gesture-handler": "^1.6.1",
    "react-navigation": "^4.3.9"
  },
  "devDependencies": {
    "@babel/core": "^7.6.2",
    "@babel/plugin-proposal-decorators": "^7.8.3",
    "@babel/runtime": "^7.6.2",
    "@react-native-community/eslint-config": "^0.0.5",
    "babel-jest": "^24.9.0",
    "eslint": "^6.5.1",
    "jest": "^24.9.0",
    "metro-react-native-babel-preset": "^0.58.0",
    "react-test-renderer": "16.11.0"
  },
  "jest": {
    "preset": "react-native"
  }
}

The error occurs in the index.js file when it can’t initialize the SQLiteAdapter. Is there any known issues with using Watermelon with the latest react-native version? This is a blocker because the app does not compile.

Here is the index.js file // index.js

import {AppRegistry} from 'react-native';
import App from './App';
import {name as appName} from './app.json';

import {Database} from '@nozbe/watermelondb';
import SQLiteAdapter from '@nozbe/watermelondb/adapters/sqlite';
import {mySchema} from './src/models/schema';
import {dbModels} from './src/models/index.js';

// First, create the adapter to the underlying database:
const adapter = new SQLiteAdapter({
  dbName: 'WatermelonDemo',
  schema: mySchema,
});

// Then, make a Watermelon database from it!
const database = new Database({
  adapter,
  modelClasses: dbModels,
});

AppRegistry.registerComponent(appName, () => App);

[mjstelly]

I’m reopening because the issue still exists when working from a fresh install. Thanks, @jdnichollsc for assistance. But your app is written in Typescript which I don’t use. I followed the tutorial verbatim except for passing the database object to the navigation handler. I don’t need it for this PoC. Also, I factored db ops into it’s own component.

Database.js

import {Database} from '@nozbe/watermelondb';
import SQLiteAdapter from '@nozbe/watermelondb/adapters/sqlite';

import {mySchema} from '../models/schema';
import {Post, Comment} from '../models/Post';

// First, create the adapter to the underlying database:
const adapter = new SQLiteAdapter({
  mySchema,
});

// Then, make a Watermelon database from it!
const HomeeDb = new Database({
  adapter,
  modelClasses: [Post, Comment],
  actionsEnabled: true,
});

export default HomeeDb;

I import this into App.js with import {HomeeDb} from './services/Database'; Then call it with const db = HomeeDb();. The app crashes when trying to initialize the adapter. I tried to step through it but it’s crashing in the node module.

[mjstelly]

Thanks, @jdnichollsc, your demo may come in handy.