Question 74008 in Reactjs Question posted in
The new location for the React Documentation can be found here.

Warning: ReactDOM.render is no longer supported in React 18. Use createRoot instead. How should i go about with this – Reactjs

This is my index.js file

import React from 'react';

import React DOM from 'react-Dom ';

import {BrowserRouter as Router} from 'react-router-Dom ';

import App from './App';

import './index.css'

  React DOM .render();

I’m new to react so a bit confused on how to go about making the changes

Tags:

3

Answers


  1. 0

    You code should look like this (replace 'app' with 'root' or similar, whatever your <div> in index.html is)

    import React from 'react';
import { createRoot } from 'react-dom/client';
import {BrowserRouter as Router} from 'react-router-Dom ';
import App from './App';
import './index.css'

const container = document.getElementById('app');
const root = createRoot(container);
root.render(<App />);
    Login or Signup to reply.
  2. 0

    Change your index.js to this:

        import React from "react";
    import ReactDOM from "react-dom/client";
    import "./index.css";
    import App from "./App";
    import reportWebVitals from "./reportWebVitals";
    
    const root = ReactDOM.createRoot(document.getElementById("root"));
    root.render(
      <React.StrictMode>
        <App />
      </React.StrictMode>
    );
    
    reportWebVitals();
    Login or Signup to reply.
  3. 0 
    import React from "react";
import { createRoot } from "react-dom/client";
import { Provider } from "react-redux";
import App from "App";
import store from "store";

// style + assets
import "assets/scss/style.scss";
import refreshTokenMiddleware from "services/setupInterceptor";

const container = document.getElementById("root") as HTMLElement;
const root = createRoot(container);

root.render(
  <Provider store={store}>
    <App />
  </Provider>
);

    Replace your code with this in index.js/ts file

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search