Failed to load resource: the server responded with a status of 404 (Not Found) - javaScript CSS files

Question

I've been unable to get css and js to load on my server. MY file structure is as follows: GAME_Folder

HTML

doctype html
head
  link(href='https://fonts.googleapis.com/css2?family=Press+Start+2P&display=swap' rel='stylesheet')
  script(src='https://code.jquery.com/jquery-latest.min.js' type='text/javascript')
  script(src='https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js')
  <script type="text/javascript" src="index.js"></script>
  link(rel='stylesheet' type='text/css' href='../css/style.css')
  script(src='/socket.io/socket.io.js')

Server (serv.js)

I've tried almost everything from the previous stack overflow posts: Failed to load resource: the server responded with a status of 404 (Not Found) Failed to load resource: the server responded with a status of 404 (Not Found) css

Any other suggestions?

Answer 1

Your routing is wrong...

It should be like this:

app.use(express.static(__dirname + '/public/style.css');
app.use(express.static(__dirname + '/public/index.js');

And in your HTML file:

doctype html
head
  link(href='https://fonts.googleapis.com/css2?family=Press+Start+2P&display=swap' rel='stylesheet')
  script(src='https://code.jquery.com/jquery-latest.min.js' type='text/javascript')
  script(src='https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js')
  <script type="text/javascript" src="index.js"></script>
  link(rel='stylesheet' type='text/css' href='/css/style.css')
  script(src='/socket.io/socket.io.js')