NodeJS express add style.css static

Question

I add static CSS,

and this file exists in source code of the page,

but CSS not applied...

In console wrote "blocking CSS because MIMO type does not define correctly"

In link tag type='text/css' exist.

Ask is how I can define 'Content-type' in express automatically?

Check if this posts answers your question: https://stackoverflow.com/questions/48248832/stylesheet-not-loaded-because-of-mime-type — macborowy, Jun 24 '20 at 07:34

score 1 · Answer 1 · answered Jun 24 '20 at 09:51

1

You can create public folder and add all the client side files.

In your server side you must use it :

app.use(express.static(path.join(__dirname, 'public')));

with path module :

npm install path

answered Jun 24 '20 at 09:51

Mathieu Istria

76
3

score 0 · Answer 2 · answered Jun 24 '20 at 07:44

I had the same issue yesterday and solved it. So first node uses folder path to get files. That means that if you're at http://localhost:3000/ you are at the root of your directory. also you can access your stylesheet via http://localhost:3000/public/css/style.css.

But, you can modify the path using routes and express.static().

You may have an url which is http://localhost:3000/user/index. So he is seeking for the css file such as http://localhost:3000/user/public/css/style.css which does not exist.

the solution might be to use different route files like this :

app.use('/', indexRouter);
app.use('/users', usersRouter);

Thanks, but in my case was just broken path – SergeyFrolenko Jun 24 '20 at 15:47 — SergeyFrolenko, Jun 24 '20 at 15:47

NodeJS express add style.css static

2 Answers2