MatUtter MatUtter - 1 year ago 204
Node.js Question

Express: How to serve font-awesome as static content?

I use express to serve static content on my site and I want to incorporate FontAwesome (

npm install font-awesome
). However in Font-Awesome's css the links to the font files are appended with a query-string containing versioning information witch express doesn't understand.

Has anyone encountered this and found a fix? Is there a simple way to make express ignore the qs for static content?

var express = require('express')
var app = express()

app.use('/static', express.static('./node_modules/font-awesome/css'))
app.use('/static', express.static('./node_modules/font-awesome/fonts'))

// response 200 | /static/font-awesome.min.css
// error 404 | /static/fontawesome--webfont.woff?v=4.6.3

As @Denys Séguret points our it's not the qs as I had thought. The actual request is for


app.use('/fonts', express.static('./node_modules/font-awesome/fonts'))

Answer Source

When your browser requests /static/fontawesome--webfont.woff?v=4.6.3, the server is free to ignore the ?v=xxx part. And that's what is done by the express.static module. The point of that part is to prevent browsers and proxies from using an old version of the file.

So the problem isn't where you think it is. The problem is you map the static route to two servers. The first one doesn't find the file and issues a 404.

(Dirty) Solution 1:

Change your mapping

app.use('/static', express.static('./node_modules/font-awesome'))

and change the URLs:


I say it's dirty because you're serving the unchecked content of a node modules (which is updated when you do a npm update). You should never do that.

 Solution 2:

Create a static directory (the name doesn't matter) and put inside the contents of the ./node_modules/font-awesome/css and ./node_modules/font-awesome/fonts directories then just map it using

app.use('/static', express.static('./static'));
Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download