facebook / metro

🚇 The JavaScript bundler for React Native
https://metrobundler.dev
MIT License
5.21k stars 621 forks source link

Cannot require 'ohm-js' module in react native projects #96

Open alexpelan opened 6 years ago

alexpelan commented 6 years ago

Do you want to request a feature or report a bug? Bug

What is the current behavior? The bundler fails to pull in the ohm-js npm module - the app doesn't even run.

The stack trace ends up here: https://github.com/harc/ohm/blob/master/src/main.js#L377 and then this seems to return undefined, which causes the next line to throw an error: https://github.com/harc/ohm/blob/master/dist/built-in-rules.js#L1

If the current behavior is a bug, please provide the steps to reproduce and a minimal repository on GitHub that we can yarn install and yarn test. You can git clone this repo: https://github.com/alexpelan/metrobundlerissue.git Then yarn && yarn run ios, you should see it fail to build

I created that using create react native app, I just did yarn add ohm-js and then added the line const ohm = require('ohm-j') to app.js

What is the expected behavior? The app should run.

Please provide your exact metro-bundler configuration and mention your metro-bundler, node, yarn/npm version and operating system. OS: Mac OS 10.12.6 node: v8.6.0 yarn: v0.16.1 metro-bundler: react-native 0.50.3 which has ^0.22.1

Let me know if you need any more information or if this is an issue with the ohm-js package - the require ('..') behavior does seem a little strange.

jonczeck commented 6 years ago

This issue is still there. It comes down to the line in main.js:Grammar.BuiltInRules = require('../dist/built-in-rules');

Inside built-in-rules.js it includes the ohm module with var ohm = require('..'); That runs this algorithm node.js has for figuring out how to resolve it. (edit: No it doesn't. React-native has its own and has problems with cyclical dependencies.) That falls back to looking at main.js again. Perhaps node.js then detects a possible infinite recursion and does not actually include the file. Thus, ohm is undefined in built-in-rules.js.

I tried using ohm in a regular node.js project and a 'hello world' usage of ohm worked just fine. So, that narrows it down to some way that react-native is different from a regular node.js project.

WillyLiaoWH commented 6 years ago

Thanks to the thought of @jonczeck , in dist/built-in-rules.js, dist/ohm-grammar.js, dist/operations-and-attributes.js I modified var ohm = require('..'); to import ohm from '..'; in src/main.js module.exports = { createNamespace.... } to export default { createNamespace... } and it works