Example of next.js and lerna

[kmalakoff]

I have spent quite a bit of time trying various things to get react-native-web working with next.js and lerna, but haven't been able to crack it.

1. the proposed babel plugin and preset
2. webpack aliases
3. adding the lerna modules following a approaches like: Support for React Native Web? vercel/next.js#858
4. babel module aliasing

No dice...does anyone have a working version of react-native-web with next.js and lerna (for shareable components across web and mobile).

[necolas]

There's a babel plugin for RNW as mentioned in the docs. You should use that. I don't know much about next.js but it looks like you can make your own renderer as that thread describes, and using the APIs documented both here and in next.js.

I don't see how lerna is related to this.

[kmalakoff]

Lerna shouldn't have an impact, but unfortunately it does causing the instructions in the documents using the babel-loader plugin & preset to unfortunately not work with next.js and lerna. It seems like a more common use case so just seeing if anyone has cracked this...I spent around 5 hours yesterday trying to get them to work together unsuccessfully which is why I am reaching out to the community for help.

Does anyone have a working next.js project with react-native-web and lerna? If so, please respond to this thread with a link to an example project or instructions for configuring. Thank you!

[dcalhoun]

@kmalakoff I've added a react-native-web example to the Next.js repository.

[kmalakoff]

Thank you @dcalhoun.

Unfortunately, getting Next.js and react-native-web working together isn't a problem for me. It's the lerna piece that throws the spanner into the works.

You can see here what I tried, but I ended up giving up on lerna and going with straight webpack.