Questions tagged [react-dom]

React package for working with the DOM.

npm install react react-dom

This package serves as the entry point of the DOM-related rendering paths. It is intended to be paired with the isomorphic React, which will be shipped as react to npm.

Usage

In the browser

var React = require('react');
var ReactDOM = require('react-dom');
 
class MyComponent extends React.Component {
  render() {
    return <div>Hello World</div>;
  }
}
 
ReactDOM.render(<MyComponent />, node);

On the server

var React = require('react');
var ReactDOMServer = require('react-dom/server');
 
class MyComponent extends React.Component {
  render() {
    return <div>Hello World</div>;
  }
}
 
ReactDOMServer.renderToString(<MyComponent />);
1131 questions
41
votes
6 answers

Failed to set an indexed property on 'CSSStyleDeclaration': Index property setter is not supported

I am getting above error in my react project when chrome version is updated to 74 (latest version).
Bhumi Thakkar
  • 411
  • 1
  • 4
  • 3
40
votes
12 answers

Cannot resolve module 'react-dom'

I've seen few posts related to this type of error. But couldn't resolve in mine. My package.json: "react": "~0.14.7", "webpack": "^1.12.13", "react-hot-loader": "^3.0.0-beta.6", . . I'm getting following error on webpack: ERROR in…
User1230321
  • 1,435
  • 4
  • 23
  • 39
35
votes
1 answer

Unknown at rule @tailwind CSS in reactjs

cant able to resolve this error while compiling the code ..! In fact I've tried many other ways of implementation //Index.css @tailwind base; @tailwind components; @tailwind utilities;
K S Sabarinathan
  • 491
  • 1
  • 6
  • 11
30
votes
15 answers

TS2786 'Component' cannot be used as a JSX component

I have a React Typescript application that won't compile. Many components have a render method that is typed to return React.ReactNode or React.ReactElement. On compile, many errors similar to the following are reported: TS2786: 'MessagesWidget'…
andypaxo
  • 6,171
  • 3
  • 38
  • 53
25
votes
8 answers

ReactJS Module build failed: SyntaxError: Unexpected token - ReactDOM.render

Why am I getting this error below? My statement ReactDOM.render(, container); is 100% legit code. My github repo: https://github.com/leongaban/react_starwars The app.js file import react from 'react' import ReactDom from 'react-dom' import…
Leon Gaban
  • 36,509
  • 115
  • 332
  • 529
25
votes
2 answers

Uncaught ReferenceError: React is not defined

Hi I know this type of question has been asked quite a few times but I couldn't get the answer. I am trying to write a React hello world example. I have only two files one app.jsx and another homepage.jsx. I am using webpack to bundle the files. But…
Aniket
  • 4,926
  • 12
  • 41
  • 54
24
votes
3 answers

Is it necessary to call `unmountComponentAtNode` if the component's container is removed?

I render a React component SettingsTab within a wrapper called TeamView. Its API looks something like class TeamView { constructor() { this.el = document.createElement('div'); } render() { ReactDOM.render(, this.el); …
Jeffrey Wear
  • 1,155
  • 2
  • 12
  • 24
24
votes
10 answers

`requestAnimationFrame` polyfill error in Jest tests

Got this error after upgrading to React when I ran my Jest unit tests: React depends on requestAnimationFrame. Make sure that you load a polyfill in older browsers. How do I fix it? I'm using Jest 18.1.0.
Yangshun Tay
  • 49,270
  • 33
  • 114
  • 141
24
votes
1 answer

TypeScript and ReactDOM.render method doesn't accept component

TL;DR I'm using TypeScript and React. I've defined my AppContainer.tsx component, exported it as default. I'm consuming this in the file app.ts where ReactDOM lives to render it to the targetted dom element. But there I receive the following errors…
Yves Schelpe
  • 3,343
  • 4
  • 36
  • 69
22
votes
3 answers

What does flushSync() do in React?

I saw Dan Abramov's demo project at JSConf Iceland, but I didn't understand why he used flushSync in this code: import { flushSync } from 'react-dom'; debouncedHandleChange = _.debounce(value => { if (this.state.strategy === 'debounced') { …
Mohamad Shiralizadeh
  • 8,329
  • 6
  • 58
  • 93
22
votes
7 answers

Detect React/ReactDOM development/production build

React development build behaves differently than production build, e.g. error handling. It can be figured out which one is used from the environment but only in modular environment, due to how process.env.NODE_ENV is used by React package: if…
Estus Flask
  • 206,104
  • 70
  • 425
  • 565
22
votes
1 answer

Should I use ref or findDOMNode to get react root dom node of an element?

I'm on a situation where I want to make some dom-node size calculations (top, bottom and size properties of the rendered DOM node) What I'm doing right now, on the componentDidUpdate method is to call findDOMNode on this: componentDidUpdate() { …
Danielo515
  • 5,996
  • 4
  • 32
  • 66
22
votes
15 answers

npm ERR! tarball.destroy is not a function

Hi I'm having issue while installing react-dom module. I'm able install other modules like react express modules, on windows 10. 64 bit machine npm install react-dom npm WARN package.json -panel-client@1.0.0 No description npm WARN package.json…
Ningappa
  • 1,279
  • 4
  • 16
  • 26
21
votes
5 answers

"React must be in scope when using JSX" (react/react-in-jsx-scope with "window.React = React" on index.js)

I am following Chapter 5, "React with JSX", of "Learning React" from O'Reilly. I wrote the Recipes App using create-react-app as the base. index.js import React from 'react'; import ReactDOM from 'react-dom'; import './index.css'; import App from…
ohkts11
  • 2,581
  • 2
  • 21
  • 17
17
votes
1 answer

Ignore certain console errors / warnings in React?

I have a huge number of console errors like this appearing in my app: Warning: React does not recognize the textStyle prop on a DOM element. If you intentionally want it to appear in the DOM as a custom attribute, spell it as lowercase textstyle…
Evanss
  • 23,390
  • 94
  • 282
  • 505
1
2
3
75 76