8

I am new to Express, so forgive me if this is a simple one. I have a React project and I am trying to add Express to it. I have added a .js file that begins with the following line to import express:

var express = require('express');

However, this throws an error.

Error

request.js:31 Uncaught TypeError: Cannot read property 'prototype' of undefined
    at Object.<anonymous> (request.js:31)
    at __webpack_require__ (bootstrap 2c79a52…:555)
    at fn (bootstrap 2c79a52…:86)
    at Object.<anonymous> (express.js:20)
    at __webpack_require__ (bootstrap 2c79a52…:555)
    at fn (bootstrap 2c79a52…:86)
    at Object.<anonymous> (index.js:11)
    at __webpack_require__ (bootstrap 2c79a52…:555)
    at fn (bootstrap 2c79a52…:86)
    at Object.<anonymous> (myNewFile.js:1)

Note: line 1 of myNewFile.js is var express = require('express');

I did try npm install express so I should have access to express and it should be up to date, but it seems that I still get this error.

How can I resolve this error and why is it occurring?

Thanks.

Rbar
  • 3,740
  • 9
  • 39
  • 69
  • 1
    Possible duplicate of https://stackoverflow.com/questions/38191695/express-uncaught-typeerror-cannot-read-property-prototype-of-undefined-req – Mahesh Singh Chouhan Jun 01 '17 at 20:11
  • *When* do you get the error? Is it in your package.json? How are you bundling all this? I mean, Express is back-end, ReactJS is front-end--why together in the same project? – Dave Newton Jun 01 '17 at 20:13
  • Possible duplicate https://stackoverflow.com/questions/44292704/cannot-find-module-fs-using-simple-json-loader – oklas Jun 01 '17 at 20:19
  • @DaveNewton when I run `npm start` my terminal shows as if there are no errors, but when I go to my localhost in my browser, the page is blank and I see the error above in the browser debug console – Rbar Jun 01 '17 at 20:20
  • @MaheshSinghChouhan thanks for the link but after reading it looks like that issue had to do with `app.get()` rather than `require('express')`. I am not using `app.get()` in my file at the moment so I don't believe it is the same issue – Rbar Jun 01 '17 at 20:22
  • @DaveNewton as for why the same project, I am trying to accomplish something similar to this https://github.com/mrpatiwi/routed-react. I have a each piece (React Router and Express) working individually; now I just need the two to work as one rather than two separate projects – Rbar Jun 01 '17 at 20:35
  • @Rbar, did you figure out how to fix this? I'm new aswell to ReactJs, NodeJs and ExpressJs. I didn't made any call yet i just called var express = require('express') – user1149244 Mar 18 '20 at 15:21
  • 1
    @user1149244 I ended up realizing I needed Express on my backend but was making the mistake of trying to add it to the front end. If you (like me) stumbled upon this issue through trying to set up this react router + express project (github.com/mrpatiwi/routed-react), I'd recommend using this project instead (https://github.com/supasate/connected-react-router). Hope this helps! – Rbar Mar 18 '20 at 22:41

1 Answers1

5

You need to specify target in webpack config:

target: 'node'

And this will work only on server side as node.js program.

oklas
  • 7,935
  • 2
  • 26
  • 42
  • 1
    thanks for the suggestion. I just added this to my `webpack.config.js` file but am still getting the same error – Rbar Jun 01 '17 at 20:29
  • How you run the bundle in browser or as node program. It will work as node program like this `node server.js`. Not from browser. – oklas Jun 01 '17 at 20:32
  • You need to know what you build. Some things may work only in browser and you need `target 'web'`. Another things may work only on server and need `target 'node'` – oklas Jun 01 '17 at 20:34
  • i can put a code in a external js just only using `target 'node'` and it run on server? if is true i just only need to install webpack for CLI and make the configuration¿? – Gawey Jul 20 '17 at 13:00
  • Hey Gawey. I can not understand your question. May be you need to create question with more details and eamples of configuration. – oklas Jul 21 '17 at 09:02
  • @oklas what if i don't have webpack config file and i have only package.json – Akshay Shrivastav Mar 26 '20 at 11:08
  • Webpack uses compiler/preprocessor (babel) which does some transformation and code generation. If you have such problem it mean you uses some another way to transform/compile other then webpack. Or you use some library or tool which use webpack internally (for example react-scripts installed by cra) – oklas Mar 26 '20 at 17:24
  • Upon adding the suggested line to webpack config my error changed to the following ---> Uncaught ReferenceError: global is not defined at Object../node_modules/graphql-voyager/node_modules/jss/lib/utils/escape.js (escape.js:6) at __webpack_require__ (bootstrap:19) at Object../node_modules/graphql-voyager/node_modules/jss/lib/RuleList.js (RuleList.js:23) – Jaf Dec 28 '20 at 07:36