{"id":17470,"library":"serve-favicon","title":"Serve Favicon Middleware","description":"serve-favicon is a Node.js middleware designed for efficiently serving the `favicon.ico` file in web applications, primarily within the Express.js and Connect.js ecosystems. Currently at version 2.5.1, this package is actively maintained, receiving updates primarily for dependency management and CI improvements, rather than frequent feature additions. Its core purpose is to optimize favicon delivery by caching the icon in memory, generating robust ETags based on file content, and correctly setting the `Content-Type` header. A key differentiator is its specific focus on the default `/favicon.ico` path, ensuring that these high-frequency requests are handled quickly and bypass subsequent middleware in the stack, thereby improving overall application performance by reducing unnecessary processing for static assets.","status":"active","version":"2.5.1","language":"javascript","source_language":"en","source_url":"https://github.com/expressjs/serve-favicon","tags":["javascript","express","favicon","middleware"],"install":[{"cmd":"npm install serve-favicon","lang":"bash","label":"npm"},{"cmd":"yarn add serve-favicon","lang":"bash","label":"yarn"},{"cmd":"pnpm add serve-favicon","lang":"bash","label":"pnpm"}],"dependencies":[{"reason":"Used internally and for the `maxAge` option to parse time strings.","package":"ms","optional":false}],"imports":[{"note":"This package is CommonJS-only and does not provide an ESM export.","wrong":"import favicon from 'serve-favicon'","symbol":"favicon","correct":"const favicon = require('serve-favicon')"},{"note":"The module exports a single function; there are no named exports. Aliasing the import variable is common.","wrong":"import { faviconMiddleware } from 'serve-favicon'","symbol":"faviconMiddleware","correct":"const favicon = require('serve-favicon')"},{"note":"The `maxAge` option accepts either a number (milliseconds) or a string parseable by the `ms` library (e.g., '1h', '30d').","wrong":"favicon(path.join(__dirname, 'public', 'favicon.ico'), { maxAge: 86400000 })","symbol":"options","correct":"favicon(path.join(__dirname, 'public', 'favicon.ico'), { maxAge: '1d' })"}],"quickstart":{"code":"const express = require('express');\nconst favicon = require('serve-favicon');\nconst path = require('path');\nconst fs = require('fs');\n\nconst app = express();\nconst publicDir = path.join(__dirname, 'public');\nconst faviconPath = path.join(publicDir, 'favicon.ico');\n\n// Ensure the 'public' directory exists\nif (!fs.existsSync(publicDir)) {\n  fs.mkdirSync(publicDir);\n}\n\n// Create a dummy favicon.ico if it doesn't exist for the example to run\nif (!fs.existsSync(faviconPath)) {\n  // A minimal, valid ICO file (1x1 transparent pixel)\n  const dummyFavicon = Buffer.from('0000010001001010000001000400000028000000010000000100000001000400000000001600000000000000000000000000000000000000', 'hex');\n  fs.writeFileSync(faviconPath, dummyFavicon);\n}\n\n// Use serve-favicon middleware\n// It should be placed early in your middleware stack\napp.use(favicon(faviconPath, { maxAge: '30d' }));\n\napp.get('/', (req, res) => {\n  res.send('Hello from your Express app with a favicon!');\n});\n\napp.listen(3000, () => {\n  console.log('Server running on http://localhost:3000');\n});","lang":"javascript","description":"This example sets up a basic Express server, uses `serve-favicon` to serve a favicon from a 'public' directory, and includes logic to create a dummy favicon file if one doesn't exist, making the example runnable out-of-the-box."},"warnings":[{"fix":"For additional icon types, use `serve-static` or similar middleware to serve those files from their expected paths, in conjunction with appropriate HTML `<link>` tags.","message":"The `serve-favicon` middleware is exclusively designed to serve the default `GET /favicon.ico` request. It will not handle other vendor-specific icons (e.g., Apple Touch Icons, Web App Manifest icons) which typically require specific HTML markup and other static file serving middleware like `serve-static`.","severity":"gotcha","affected_versions":">=1.0.0"},{"fix":"Order your middleware such that `app.use(favicon(...))` appears before `app.use(logger(...))` or other route handlers.","message":"To ensure optimal performance and prevent unnecessary processing, `serve-favicon` should be placed very early in your middleware stack, ideally before any logger or heavy processing middleware. This allows `favicon.ico` requests to be handled and responded to quickly.","severity":"gotcha","affected_versions":">=1.0.0"},{"fix":"Always use `const favicon = require('serve-favicon');` to import the module in Node.js applications.","message":"The package currently uses CommonJS modules (`require`) and does not natively support ES Modules (`import`). Attempting to use `import` syntax will result in a runtime error.","severity":"gotcha","affected_versions":">=1.0.0"}],"env_vars":null,"last_verified":"2026-04-22T00:00:00.000Z","next_check":"2026-07-21T00:00:00.000Z","problems":[{"fix":"Change `import favicon from 'serve-favicon'` to `const favicon = require('serve-favicon')`.","cause":"Attempting to use ES module `import` syntax or destructuring when the package is CommonJS-only.","error":"TypeError: favicon is not a function"},{"fix":"Double-check the `path.join(__dirname, 'public', 'favicon.ico')` argument to ensure it points to an existing file. Ensure `app.use(favicon(...))` is placed early in your Express/Connect middleware chain.","cause":"The favicon file path provided to `serve-favicon` is incorrect, or the middleware is placed too late in the stack after other handlers have already consumed the request.","error":"Cannot GET /favicon.ico"},{"fix":"Adjust the `maxAge` option for aggressive caching (e.g., `{ maxAge: '30d' }`). Verify `serve-favicon` is positioned before any logging middleware like `morgan` to prevent unnecessary logging of favicon requests and ensure quick responses.","cause":"Caching issues (e.g., `maxAge` set too low or browser cache) or the middleware being placed after a logger that's delaying the response.","error":"favicon not showing or slow to load"}],"ecosystem":"npm","meta_description":null}