New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

react-native doesn't handle the /index.js in browser fields #1813

Merged
merged 1 commit into from Dec 5, 2016

Conversation

Projects
None yet
4 participants
@dantman
Contributor

dantman commented Nov 30, 2016

No description provided.

@elhigu

This comment has been minimized.

Collaborator

elhigu commented Dec 3, 2016

@dantman could you explain me a bit more what is this and why it is needed?

@dantman

This comment has been minimized.

Contributor

dantman commented Dec 3, 2016

@elhigu React Native has its own packager based on browserify responsible for bundling the JS code for native iOS/Android apps. It handles the "browser" field in package.json as well as a "react-native" field with React Native specific overrides to "browser".

React Native isn't a browser or server environment, but it's similar to a browser environment. No node.js runtime, fs, etc... like the browser except no dom and other browser features but some react-native-* packages providing access to native iOS/Android features like native hardware, App storage, Android/iOS sqlite databases, etc...

So when you require knex in a react-native project (say, so you can either use the query builder/toSQL or write your own knex driver for an Android/iOS Sqlite database) it fails in the same way that it fails in the browser. But the browser handling doesn't behave 100% the same as browserify. React Native matches ../migrate in lib/util/make-knex.js against "./lib/migrate" instead of "./lib/migrate/index.js" like the handler browserify uses.

@elhigu

This comment has been minimized.

Collaborator

elhigu commented Dec 5, 2016

Sounds good, thanks 👍

@elhigu elhigu merged commit 9e7b57e into tgriesser:master Dec 5, 2016

1 check passed

continuous-integration/travis-ci/pr The Travis CI build passed
Details
@coppercash

This comment has been minimized.

coppercash commented Feb 14, 2017

Hi, @dantman.
I am trying to run Knex on React Native, and currently facing a lot of react-native-is-not-a-real-node issues.
I built the node environment on React Native by following this repo ReactNativify, but got stuck on an exception related to require.
It seems that you have succeeded running Knex on react native.
Could you share the way you built the node environment with me?

@dantman dantman deleted the dantman:react-native branch Feb 14, 2017

@dantman dantman restored the dantman:react-native branch Feb 14, 2017

@dantman

This comment has been minimized.

Contributor

dantman commented Feb 14, 2017

@coppercash You don't build a node environment. React Native is not a node.js environment so treat it like a browser one.

For missing built-in packages, install the equivalent browser polyfill from npm (eg: If stream is missing, then npm install --save stream the browser polyfill). And for missing node.js global variables use react-native-browser-builtins (eg: If a package requires the missing process global, import 'react-native-browser-builtins/react-native/process'; near the start of your code). I load that stuff in a polyfill.js file required at the top of both my index.android.js and index.ios.js file.

@coppercash

This comment has been minimized.

coppercash commented Feb 14, 2017

That sounds really inspiring.
Could you share the dependencies filed of your package.json which makes Knex work properly?
According to Knex's dependencies list, I am afraid that it would take horribly long time to collect every needed polyfill.

@dantman

This comment has been minimized.

Contributor

dantman commented Feb 14, 2017

@coppercash I don't know which of my deps are related to knex, bookshelf, or something else entirely.

All I did was fix errors. Just run your project and when you get a require error for one of the built-in modules, install the npm version for that. Rinse and repeat until you don't get an error anymore.

@tslater

This comment has been minimized.

tslater commented Jul 19, 2017

@dantman, I'm stuck on:

 undefined is not an object (evaluating 'argv.indexOf')

<unknown>
    index.js:4:22
loadModuleImplementation
    require.js:174:12
<unknown>
    index.js:6:4
loadModuleImplementation
    require.js:174:12
<unknown>
    helpers.js:46:4
loadModuleImplementation
    require.js:174:12
<unknown>
    raw.js:33:23
loadModuleImplementation
    require.js:174:12
<unknown>
    index.js:15:19
loadModuleImplementation
    require.js:174:12
<unknown>
    knex.js:8:25
loadModuleImplementation
    require.js:174:12
<unknown>
    try-knex.js:1:13
loadModuleImplementation
    require.js:174:12
<unknown>
    App.js:3
loadModuleImplementation
    require.js:174:12
<unknown>
    crna-entry.js:27:19
loadModuleImplementation
    require.js:174:12
guardedLoadModule
    require.js:119:45
global code
    <unknown file>:0

I think my import 'react-native-browser-builtins/react-native/process' is failing. Any tips?

@dantman

This comment has been minimized.

Contributor

dantman commented Jul 19, 2017

@tslater try the Debug JS in Browser option and set Chrome to pause on error. That'll get you directly into the context where the error is and you can debug exactly what argv is, hints of where it's defined, and what methods are available on it.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment