0

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. Am I missing something?

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

1 Answer 1

1

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.

webpack.config.js

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

   output: {
      path:'./',
      filename: 'index.js',  # the file you should be including in HTML
   },
3
  • Still getting that same error. Installed webpack. set the entry in webpack config to ./MyApp/static/MyApp/react/dashboard.js and output to ./MyApp/static/MyApp/bundles. Ran the command webpack. Successfully created the folder bundles. In my HTML I have, <script type="text/babel" src="{% static 'MyApp/react/dashboard.js' %}"></script> . Opening the browser and seeing the same error "require not defined". Aug 8, 2016 at 4:01
  • 1
    why <script type="text/babel">? If you're using webpack, you should configure it to run Babel for you and output plain ES5 that you include as text/javascript. Also you shouldn't include dashboard.js in your HTML. Include the bundle instead.
    – Kos
    Aug 8, 2016 at 7:58
  • Thanks a lot.. Done!!! Actually I had messed up the directory structure of my project. Aug 8, 2016 at 9:41

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.