1

I'm building a JS project to learn new skills, and I'm having trouble delineating between the client-side code and the server-side code. The current setup is a node app with ExpressJS as a dependency.

When I run npm run build && npm run dev, the base html/css is served as expected, but I get an error in my console from the express script.

main.fb6bbcaf.js:116 Uncaught TypeError: Cannot read property 'prototype' of undefined at Object.parcelRequire.node_modules/express/lib/response.js.safe-buffer (response.js:42) at newRequire (main.fb6bbcaf.js:47) at localRequire (main.fb6bbcaf.js:53) at Object.parcelRequire.node_modules/express/lib/express.js.body-parser (express.js:22) at newRequire (main.fb6bbcaf.js:47) at localRequire (main.fb6bbcaf.js:53) at Object.parcelRequire.node_modules/express/index.js../lib/express (index.js:11) at newRequire (main.fb6bbcaf.js:47) at localRequire (main.fb6bbcaf.js:53) at Object.parcelRequire.js/main.js.express (main.js:1)

For reference, I'm still trying to get the example code from the express documentation to run, so my whole main.js file looks like this:

const express = require('express');
const app = express();
const port = 1234;

app.get('/hello', (req, res) => res.send('Hello World!'));

app.listen(port, () => console.log(`Example app listening at http://localhost:${port}`));

I found a person with a similar issue HERE, but what doesn't click for me (and what I can't seem to find a proper question for) is how to separate the client-side and server-side code in my project. I get the feeling that I'm trying to use express in code that's being served to the client, but I don't know where else to put it.

Is there a best-practice location for server-side code in a project that uses both node and express?

elersong
  • 756
  • 4
  • 12
  • 29
  • The code you show, all by itself, does not create the error you show as there is no body-parser module in that code. We will need to see THE actual code that leads to that error. I don't understand why you think this error has anything to do with client-side Javascript. – jfriend00 Jul 08 '20 at 07:09
  • @jfriend00 That's all THE js code in the project. I haven't once used the body-parser module. It was installed as a dependency of a dependency. I just started working on the js after finishing the html/css. No need to be snippy. – elersong Jul 08 '20 at 19:45
  • If that's all the code you are running, then there is apparently something wrong with your installation. You need to uninstall express and any other modules in that directory, make sure the `node_modules` directory where they are installed is completely clean. Clean out your package.json file for your app and reinstall Express from scratch. I still don't understand at all what this question has to do with client-side Javascript. All you show here is server-side Javascript. – jfriend00 Jul 08 '20 at 21:44
  • And, I'd suggest you just try running `node main.js` to eliminate any other things that might be in your package.json as a source of trouble. – jfriend00 Jul 08 '20 at 21:45

1 Answers1

1

Error code say you have problem with Express and body-parser modules. lets fix this from beginning.

// creating new project through cmd line

1)cd to project directory

2)create app.js

3)npm init -y // to create project

4)npm install express body-parser //installing required modules

//open app.js and configure server using below code

const express = require("express");
const bodyParser = require("body-parser");

let app = express();
app.use(bodyParser.urlencoded({extended: true}));

app.get("/",function(req,res){
res.send("Hello world");
})


app.listen(3000, function() {
  console.log("Server started on port 3000");
});

//now run app.js

1)node app.js

2)In browser, head over to "localhost:3000"

This should have solved your problem. body-parser is used when you have post request to server. It shouldn't show any body-parser error if no post request is submitted to your server.

abid ali
  • 71
  • 4
  • What does the -y do in `npm init -y` ? – elersong Jul 08 '20 at 05:54
  • -y its like say yes to all default value, if it confuse you just remove it and use only " npm init" you will understand what I'm saying – abid ali Jul 08 '20 at 05:57
  • The `app.js` file I create will be for server-side code, right? So where would I put client-side js? – elersong Jul 08 '20 at 05:59
  • when you get a request to server,you have to send files to client,these file should be send through app.get("/",function(req,res){ res.sendFile(__dirname + "index.html") }) you should have already created HTML file and stored in your project folder. so when you get request at "localhost:3000/" your app.get() send the HTML and its related CSS and JavaScript files if you have . – abid ali Jul 08 '20 at 06:02
  • 1
    Note : you don have client side JavaScript because your are performing it at server side itself. there is no need to send JavaScript file to client side – abid ali Jul 08 '20 at 06:09