Failed to compile.

[reactnewb]

Describe the bug
I'm following this guide https://guide.meteor.com/react-native.html. But when I use @meteorrn/core package as below.

import Meteor, { Mongo, withTracker } from '@meteorrn/core';

I receive the following error.

/Users/rx/rn/ex-items-app/node_modules/react-native/Libraries/Components/TextInput/TextInputState.js
Module not found: Can't resolve '../../Utilities/Platform' in '/Users/rx/rn/ex-items-app/node_modules/react-native/Libraries/Components/TextInput'

And when I don't use this package this error goes away.

List of dependency from package.json file

"dependencies": {
    "@meteorrn/core": "^2.1.0",
    "@react-native-async-storage/async-storage": ">=1.8.1",
    "@react-native-community/netinfo": "^5.9.10",
    "expo": "~40.0.0",
    "expo-status-bar": "~1.0.3",
    "react": "16.13.1",
    "react-dom": "16.13.1",
    "react-native": "https://github.com/expo/react-native/archive/sdk-40.0.1.tar.gz",
    "react-native-web": "~0.13.12"
  },

To Reproduce
Steps to reproduce the behavior:

1. expo init ex-items-app
2. npm install --save @meteorrn/core @react-native-community/netinfo @react-native-async-storage/async-storage@>=1.8.1
3. use package in your App.js file import Meteor, { Mongo, withTracker } from '@meteorrn/core';
4. Save.
5. Run expo start

Device (please complete the following information):

• React Native and MeteorRN versions: [e.g. https://github.com/expo/react-native/archive/sdk-40.0.1.tar.gz, 2.1.0]

Thanks

[TheRealNate]

Hi @reactnewb,

Are you using React Native web? Is it possible your issue is related to this one?

Thanks!

[reactnewb]

Hi @TheRealNate,

Thank you for the response.
Yes, I'm using React Native Web. And it seems like the issue that you mention is very similar to what I'm experiencing.

I'll try solutions mention on that issue and report back. Mean while would it be a good idea to keep this issue open?

Thanks.

[TheRealNate]

Hey @reactnewb, yes, let's leave it open. Please keep me posted if these solutions help you or not. I've never used react-native-web myself, but I'm happy to help you with anything on the meteor-react-native side.

[reactnewb]

Hi @TheRealNate, I tried solutions mentioned in that thread and none of it worked for me. I'm new to react eco-system not sure how to debug this.

Thanks.

[TheRealNate]

Hey @reactnewb,

What is the command you are using to run react native web? Have you tried running with this EXPO_DEBUG=true expo build:web and seeing if you are getting any more info?

Thanks

[reactnewb]

I was using expo start. which opens a Metro bundler in the browser.
From there I'm selecting run in the web browser option from left sidebar.

And output of EXPO_DEBUG=true expo build:web is as below.

Bundling the project in debug mode.

● Expo Webpack █████████████████████████ building (62%) 438/477 modules 39 act
ive
 ...9m node_modules/react-native-web/dist/exports/StyleSheet/createReactDOMSty
le.js

Failed to compile.

./node_modules/react-native/Libraries/ReactPrivate/ReactNativePrivateInterface.js
Cannot find module: '../Utilities/Platform'. Make sure this package is installed.

You can install this package by running: npm install ../Utilities/Platform.
Error: ./node_modules/react-native/Libraries/ReactPrivate/ReactNativePrivateInterface.js
Cannot find module: '../Utilities/Platform'. Make sure this package is installed.

You can install this package by running: npm install ../Utilities/Platform.

My best guess is there is something missing from the react-native project in itself. Because there are only Platform.android.js and Platform.ios.js files are present in node_modules/react-native/Libraries/Utilities. So I'm just thinking that there might be a Platform.web.js files is missing. and this is not working on the web.

[reactnewb]

I think Expo web is not yet for me. So I'm closing this issue.

Thanks.

[andy-clapham]

Closed issue I know, but seems to be resolved for me by adding a webpack.config.js to locate the relative reference to Utilities/Platform used from within various rn libraries:

const createExpoWebpackConfigAsync = require('@expo/webpack-config');

module.exports = async function (env, argv) {
  const config = await createExpoWebpackConfigAsync(env, argv);
  // Customize the config before returning it.
  // Resolve relative reference ../Utilities/Platform as react-native-web
  config.resolve.alias['../Utilities/Platform'] = 'react-native-web/dist/exports/Platform';
  return config;
};