Uncaught ReferenceError React is not defined

Question

I am trying to make ReactJS work with rails using this tutorial  I am getting this error       Uncaught ReferenceError  React is not defined  But I can access the React object in browser console I also added public dist turbo-react min js as described here and also added     require components line in application js as described in this answer to no luck  Additionally  var React   require  react   gives the error  Uncaught ReferenceError  require is not defined    Can anyone suggest me on how to resolve this    EDIT 1  Source code for reference  This is my comments js jsx file     var Comment   React createClass     render  function          return          lt div className  comment  gt           lt h2 className  commentAuthor  gt             this props author           lt  h2 gt             this props comment         lt  div gt                    var ready   function        React renderComponent       lt Comment author  Richard  comment  This is a comment    gt       document getElementById  comments              document  ready ready     And this is my index html erb      lt div id  comments  gt  lt  div gt

User · Answer

I got this error because in my code I misspelled a component definition with lowercase react createClass instead of uppercase React createClass

User · Answer

I was able to reproduce this error when I was using webpack to build my javascript with the following chunk in my webpack config json   externals         react    React       This above configuration tells webpack to not resolve require  react   by loading an npm module  but instead to expect a global variable  i e  on the window object  called React  The solution is to either remove this piece of configuration  so React will be bundled with your javascript  or load the React framework externally before this file is executed  so that window React exists

User · Answer

I was facing the same issue  I resolved it by importing React and ReactDOM like as follows  import React from  react   import ReactDOM from  react-dom

User · Answer

Possible reasons are 1  you didn t load React JS into your page  2  you loaded it after the above script into your page  Solution is load the JS file before the above shown script   P S   Possible solutions     If you mention react in externals section inside webpack configuration  then you must load react js files directly into your html before bundle js   Make sure you have the line import React from  react

User · Answer

If you re using TypeScript  make sure that your tsconfig json has  quot jsx quot    quot react quot  within  quot compilerOptions quot

User · Answer

import React    Component  PropTypes   from  react     This may also work

User · Answer

If you are using Babel and React 17  you might need to add  quot runtime2   quot automatic quot  to config           quot presets quot     quot  babel preset-env quot     quot  babel preset-react quot              quot runtime quot    quot automatic quot

User · Answer

If you are using Webpack  you can have it load React when needed without having to explicitly require it in your code   Add to webpack config js   plugins       new webpack ProvidePlugin          React    react               See http   webpack github io docs shimming-modules html plugin-provideplugin

User · Answer

Try to add  import React from  react  import   render   from  react-dom  window React   React  before the render   function  This sometimes prevents error to pop-up returning   React is not defined  Adding React to the window will solve these problems

User · Answer

The displayed error  after that import react  Finally import react-dom  if error is react is not define please add    import React from  react    if error is reactDOM is not define please add    import ReactDOM from  react-dom

User · Answer

I got this error because I was using   import ReactDOM from  react-dom    without importing react  once I changed it to below   import React from  react   import ReactDOM from  react-dom     The error was solved

User · Answer

Adding to Santosh    You can load React by   import React from  react

[javascript] Uncaught ReferenceError: React is not defined

Examples related to javascript

Examples related to ruby-on-rails

Examples related to reactjs