reactjs/react-rails

Setup instructions unclear about supported versions of React

chrismanderson opened this issue · 2 comments

chrismanderson commented

Help us help you! Have you looked for similar issues? Do you have reproduction steps? Contributing Guide

Steps to reproduce

  1. Followed the steps on the readme to set up a fresh install (https://github.com/reactjs/react-rails#3-install-react-and-some-other-required-npm-packages).

  2. Specifically, ran

$ yarn add react react-dom @babel/preset-react prop-types \
  css-loader style-loader mini-css-extract-plugin css-minimizer-webpack-plugin

as listed here.

Expected behavior

Following the setup instructions, I should have a working installation.

Actual behavior

I get an error message in the JS console saying

You are importing createRoot from "react-dom" which is not supported.

This apparently is due to yarn add react installing React 18, which is the latest published release.

While the readme lists various versions of libraries of Webpacker and Sprockets react-rails supports, I don't actually see the current supported version of React on that list, which seems like the most important of all of them! Additionally, if there is a supported version of React in this library, the setup instructions should be pinned to that version.

It doesn't seem like the rails generate react:install command configures the proper version of React. I also see that there are some various PRs in this repo about supporting React 18, but they've been open for a while now.

If this library does have a hard dependency on a specific React version, it should be called out in the readme and made part of the set up instructions, right?

ahangarha commented

Thanks for reporting.
We are preparing for a new release in the coming weeks, and we try to address such issues.

It would be great if you can share a repo so we can reproduce the issue.

ahangarha commented

For clarification, I made a project from scratch to ensure it uses React 18. I don't see any error, but there is a warning in the browser console:

Warning: You are importing createRoot from "react-dom" which is not supported. You should instead import it from "react-dom/client".

I close this issue since there has been not report of incompatibility so far. Please let us know if you face with any incompatibility. In that case, please share a repo where we reproduce the issue.

P.S. @justin808
It would be good to have a procedure to customize the setup for React 18+. If you agree, we add this improvement to our milestones