0

I'm having trouble getting the CSS and JS to apply within routing of my nodejs project. I've tried the following lines:

app.use(express.static(__dirname + '/public'));
app.use(express.static(__dirname, '/public'));
app.use('/static', express.static(__dirname, '/public));

Am I forgetting to do something? My client console says this: Refused to apply style from 'http://localhost:3000/users/css/styles.css' My CSS file is not in the users folder though. Its in a folder called 'public' in the same directory as my 'server.js' file.

const express = require('express');

const port = 3000;
const app = express();

app.set('view engine', 'pug');
app.use(express.static('public'));

app.get('/', (req, res) => {
    res.render('pages/home');
});

// This code works, but I want to apply different routing
app.get('/register', (req, res) => {
    res.render('pages/register');
});

// This code will render the page, however CSS and JS files don't apply
app.get('/users/register', (req, res) => {
    res.render('pages/register');
});

app.listen(port, () => {
    console.log('Server is currently running on port ' + port);
});
Vince
  • 2,596
  • 11
  • 43
  • 76
  • 1
    This might help you https://stackoverflow.com/questions/48778619/node-express-refused-to-apply-style-because-its-mime-type-text-html – crg May 21 '21 at 21:37
  • @crg Thank you! That helped! I actually just had to add a forward slash at the beginning of my css link. I originally had css/styles.css. Where it had to be /css/styles.css. – Vince May 21 '21 at 21:44

1 Answers1

0

@Vince found the answer in Node/Express - Refused to apply style because its MIME type ('text/html') changing css/styles.css by /css/styles.css

crg
  • 4,284
  • 2
  • 29
  • 57