Nozbe / WatermelonDB

🍉 Reactive & asynchronous database for powerful React and React Native apps ⚡️
https://watermelondb.dev
MIT License
10.62k stars 600 forks source link

SyntaxError: Strict mode does not allow function declarations in a lexically nested statement #138

Closed sonikro closed 6 years ago

sonikro commented 6 years ago

Hello everyone,

First of all, thanks for this awesome project.

I'm trying to use WatermelonDB in my React-native project, however I've been facing an error related to strict-mode:

image This error only shows up when I import SQLiteAdapter, and try to create it

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

import { mySchema } from '../model/schema'
import { Customer } from '../model/Customer';

const adapter = new SQLiteAdapter({
    schema: mySchema,
})

const database = new Database({
    adapter,
    modelClasses: [
        Customer
    ],
});

If I comment the SQLiteAdapter part, the project runs normally (of course, the Database wont work, because of the missing adapter, but I won't run into this strict mode error)

This is my package.json

{
  "name": "battlefield_app",
  "version": "0.0.1",
  "private": true,
  "scripts": {
    "start": "node node_modules/react-native/local-cli/cli.js start",
    "test": "jest"
  },
  "dependencies": {
    "@babel/plugin-proposal-decorators": "^7.1.2",
    "@nozbe/watermelondb": "^0.7.0",
    "babel-plugin-transform-remove-console": "^6.9.4",
    "es6-symbol": "^3.1.1",
    "mobx": "4.x.x",
    "mobx-persist": "^0.4.1",
    "mobx-react": "^5.3.6",
    "mobx-react-form-fields": "^1.0.0-beta.12",
    "moment": "^2.22.2",
    "react": "16.6.0-alpha.8af6728",
    "react-native": "^0.57.4",
    "react-native-elements": "^0.19.1",
    "react-native-navigation": "1.x.x",
    "react-native-vector-icons": "^6.0.2",
    "rxjs": "^6.2.2"
  },
  "devDependencies": {
    "@babel/plugin-transform-block-scoped-functions": "^7.0.0",
    "@types/jest": "^23.3.8",
    "@types/react": "^16.4.18",
    "@types/react-native": "^0.57.7",
    "@types/react-native-navigation": "1.x.x",
    "@types/react-native-vector-icons": "^4.6.4",
    "@types/react-test-renderer": "^16.0.3",
    "babel-jest": "23.6.0",
    "babel-plugin-transform-remove-strict-mode": "^0.0.2",
    "jest": "23.6.0",
    "metro-react-native-babel-preset": "0.48.3",
    "react-native-typescript-transformer": "^1.2.10",
    "react-test-renderer": "16.6.0-alpha.8af6728",
    "ts-jest": "^23.10.4",
    "typescript": "^3.1.4"
  },
  "jest": {
    "preset": "react-native",
    "moduleFileExtensions": [
      "ts",
      "tsx",
      "js"
    ],
    "transform": {
      "^.+\\.(js)$": "<rootDir>/node_modules/babel-jest",
      "\\.(ts|tsx)$": "<rootDir>/node_modules/ts-jest/preprocessor.js"
    },
    "testRegex": "(/__tests__/.*|\\.(test|spec))\\.(ts|tsx|js)$",
    "testPathIgnorePatterns": [
      "\\.snap$",
      "<rootDir>/node_modules/"
    ],
    "cacheDirectory": ".jest/cache"
  }
}

Does anyone have any idea what might be going on ?

EDIT1: I dont get this error, if Im debugging the app. Edit2: I tried implementing watermelonDB in a clean app (react-native init), and I got the same error. I even tried using RN 0.56.0, but the same thing happened....

radex commented 6 years ago
  1. show me a snippet of compiled JS around the line mentioned in the comment (you can open the URL in your browser)
  2. show me your babel config
sonikro commented 6 years ago

Hello @radex , thanks for the reply.

I created a sample project, where we can reproduce this problem -> https://github.com/sonikro/watermelontest

Just clone the repo, yarn, and react-native run-android.

The babel config of my original project is this:

{
  "presets": [
    "module:metro-react-native-babel-preset"
  ],
  "env": {
    "production": {
      "plugins": [
        "transform-remove-console"
      ]
    }
  },
  "plugins": [
    [
      "@babel/plugin-proposal-decorators",
      {
        "legacy": true
      }
    ]
  ]
}

Regarding the snippet of the code generated by the bundler,I got this... (The exact character is inside the performanceNow(), but I got some text before, and some after.

f(type === 'setTimeout' || type === 'setInterval' || type === 'setImmediate') { \n        callback(); \n } else if (type === 'requestAnimationFrame') { \n        callback(performanceNow()); \n } else if (type === 'requestIdleCallback') { \n        callback({ \n          timeRemaining: function timeRemaining() { \n            return Math.max(0, FRAME_DURATION - (performanceNow() - frameTime)); \n }, \n          didTimeout: !!didTimeout\n        }); \n      } else { \n        console.error('Tried to call a callback with invalid type: ' + type); \n } \n    } catch (e) { \n      if (!errors) { \n        errors = [e]; \n } else { \n        errors.push(e); \n } \n } \n\n    if (__DEV__) { \n      Systrace.endEvent(); \n } \n  }\n\n  function _callImmediatesPass() { \n    if (__DEV__) { \n      Systrace.beginEvent('callImmediatesPass()'); \n } \n\n    if (immediates.length > 0) {
radex commented 6 years ago

ok will try to check tomorrow

sonikro commented 6 years ago

Hello @radex , I managed to find a workaround for the issue.

The problem was due to the old version of JSC that is shipped by default.

I've installed jsc-android@236355.0.0, and everything worked.

However, I believe that jsc-android is now mandatory for WatermelonDB to work properly.

Thanks for the library, and keep up the good work

radex commented 6 years ago

Interesting!

However, I believe that jsc-android is now mandatory for WatermelonDB to work properly.

Hm, that's not good! I guess there's a missing babel transformation maybe?

radex commented 6 years ago

@sonikro is this something that worked before the latest release of 🍉 or did you encounter this the first time you wanted to use 🍉 ?

radex commented 6 years ago

This is the problematic part (adapters/sqlite/index):

              function $If_3() {
                return $If_2.call(this);
              }
            }

            function $If_2() {
              return $return();
            }

is a regression, because that's new code. Huh. Maybe a fast-async bug… or a missing transformation?

For now, I'll just note this in docs as a workaround, since I use jsc-android and it's fine. Would very much appreciate if someone contributed to the 🍉 babel config to fix this

radex commented 6 years ago

OK, nevermind, I made an experimental NPM build which replaces fast-async with default async thing.

@sonikro Could you please test if the 0.8.0-5-fix-android build works for you correctly (with or without jsc-android)? I'd very much appreciate it

sonikro commented 6 years ago

@sonikro is this something that worked before the latest release of or did you encounter this the first time you wanted to use ?

I encountered it the first time. I started using Watermelon DB this week.

I'll test it today, and will let you know of the results.

radex commented 6 years ago

thanks!

sonikro commented 6 years ago

@radex , the version 0.8.0-5-fix-android is working in both scenarios, with the updated JSC and without it. Thanks :)

radex commented 6 years ago

Great, released. Closing.