CODEWITHSUNDEEP
javascriptjquerynode.js
Igor Chernega
Igor Chernega

Reputation: 631

Can't load scripts because of node.js

I can't use <script src="node_modules/jquery/dist/jquery.min.js"></script> in my index.html file because of:

Failed to load resource: the server responded with a status of 404 (Not Found) http://localhost:8080/node_modules/jquery/dist/jquery.min.js

This happens because of my else statement in server file code: 

var http = require('http')
var url = require('url')
var fs = require('fs')

var server = http.createServer((req, res) => {
let parsedUrl = url.parse(req.url, true)

if (parsedUrl.pathname === '/') {
    console.log('home page')
    fs.readFile('./index.html', (err, data) => {
        res.writeHead(200, { 'Content-Type': 'text/html' })
        res.end(data)
    })
} else if (parsedUrl.pathname === '/readJson') {
    console.log('read json')
    fs.readFile('./data.json', (err, data) => {
        res.writeHead(200, { 'Content-Type': 'application/json' })
        res.end(data)
    })
} else {
    console.log('We can\'nt load any resources because of this statement')
    res.writeHead(404)
    res.end()
}
})
server.listen(8080)

I've read about how to fix this problem when using express module. Is there any way to solve the problem without using that module?

Upvotes: 0

Views: 168

Answers (2)

Patrick Hund
Patrick Hund

Reputation: 20236

The easiest way would be to simply load jQuery from a CDN instead of serving it from your own server. This is a widely accepted best practice.

Example:

<script src="https://code.jquery.com/jquery-3.2.1.min.js" integrity="sha256-hwg4gsxgFZhOsEEamdOYGBf13FyQuiTwlAQgxVSNgt4=" crossorigin="anonymous"></script>

You can find various options for loading jQuery from a CDN here: https://code.jquery.com

If you create an HTTP server like in your code example and want it to serve jQuery, then you'd have to read the jquery.min.js using fs.readFile and serve its contents, just like you're doing with your data.json file.

Upvotes: 1

n9iels
n9iels

Reputation: 895

I recommend the use a CDN instead. If you install the jQuery module you can use it for your back-end JavasSript. However you want to use it on the front-end. You are using NodeJS as web server to serve a HTML page. The http module doesn't know anything about other files because it only read the index.html.

So you might wanna search for a solution to read/serve a complete folder. Withing this folder, lets call it public, you can store you HTML, CSS and JS files that are public available. Since the HTTP module knows about the entire folder all files can be used on the front-end. This is also a good solution to separate your back-end en front-end JavaScript.

Upvotes: 1

Related Questions