User_Targaryen User_Targaryen - 1 year ago 374
React JSX Question

Uncaught ReferenceError: require is not defined React.js

I am writing the following in my React code:

var React = require('react');

I followed the React setup from tutorialspoint. I installed all the things at /Desktop/reactApp/.
The React code is being run from /GitProjects/DjangoProjects/MyProj/MyApp/static/react/dashboard.js. I keep on getting the error Uncaught ReferenceError. Please help. Am I missing something?

Note: an HTML file at /GitProjects/DjangoProjects/MyProj/MyApp/templates/dashboard.html is calling my dashboard.js code.

Kos Kos
Answer Source

It sounds like you're trying to include a file dashboard.js in HTML.

If this file contains code like require('react'); then it means that you need to first compile it using a build tool that will actually find react and bundle it together with your own code.

In case of the tutorial you're linking, the build tool used is webpack. Your HTML should include the file generated by webpack (index.js, or whatever you have in output section of webpack config), rather than dashboard.js alone.


var config = {
   entry: './main.js',  # the main code of your app that require()s other files

   output: {
      filename: 'index.js',  # the file you should be including in HTML
Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download