Last updated: Apr 5, 2024
Reading timeยท5 min
Note: if you got an error when setting a view engine, click on the last subheading.
The error "TypeError: Router.use() requires a middleware function but got a
Object" occurs when you forget to export the Router in one of your .js
files.
To solve the error, add the module.exports = router;
line to export the
Router.
Here is the complete stack trace.
throw new TypeError('Router.use() requires a middleware function but got a ' + gettype(fn)) ^ TypeError: Router.use() requires a middleware function but got a Object at Function.use (/home/borislav/Desktop/bobbyhadz-rest/bobbyhadz-js/node_modules/express/lib/router/index.js:469:13) at Function.<anonymous> (/home/borislav/Desktop/bobbyhadz-rest/bobbyhadz-js/node_modules/express/lib/application.js:227:21)
Here is an example of how the error occurs.
const express = require('express'); const router = express.Router(); router.get('/', (req, res) => { res.send('Blog home page'); }); router.get('/about', (req, res) => { res.send('About Blog'); });
The file makes use of the express.Router function.
blog.js
file.If I now try to import it in index.js
, the error is raised.
const express = require('express'); // โ๏ธ trying to import from file without export const blog = require('./blog'); const app = express(); // ๐๏ธ use Router app.use('/blog', blog); const port = 5000; app.listen(port, () => { console.log(`Example app listening on port ${port}`); });
Here is the output in my terminal after starting my server with node index.js
.
TypeError: Router.use() requires a middleware function but got a Object
The issue is that we tried to import the Router from blog.js
, but the
blog.js
file doesn't export anything.
To solve the error, make sure to the Router
from your files.
const express = require('express'); const router = express.Router(); router.get('/', (req, res) => { res.send('Blog home page'); }); router.get('/about', (req, res) => { res.send('About Blog'); }); // โ export the router module.exports = router;
The last line exports the Router, so it can be imported into other files.
module.exports
. Forgetting the s
in exports
often causes the error.If you use ES6 Modules, use the following syntax instead.
// โ using ES6 Modules syntax import express from 'express'; const router = express.Router(); router.get('/', (req, res) => { res.send('Blog home page'); }); router.get('/about', (req, res) => { res.send('About Blog'); }); // โ export your router export default router;
We used export default router
instead of module.exports = router;
.
And, here is how we can import the blog.js
file and use the Router.
import express from 'express'; // โ importing the Router import blog from './blog.js'; const app = express(); app.use('/blog', blog); const port = 5000; app.listen(port, () => { console.log(`Example app listening on port ${port}`); });
Notice that the extension of the file has to be specified when importing local files with ES6 modules.
Trying to import from a module that doesn't export anything causes the error.
If the module you are importing from is empty or you've forgotten to export a value, the error is raised.
Alternatively, you can export the Router as a named
export.
This is useful when you need to export multiple functions, classes or variables from the same file.
const express = require('express'); const router = express.Router(); router.get('/', (req, res) => { res.send('Blog home page'); }); router.get('/about', (req, res) => { res.send('About Blog'); }); // ๐๏ธ export an object instead of the Router directly module.exports = { blog: router, };
We export an object instead of exporting the Router directly.
You can add multiple properties to the object if you need to export multiple values from the file.
And here is how we'd import the Router in a different file.
const express = require('express'); // ๐๏ธ import the Router const {blog} = require('./blog'); const app = express(); // ๐๏ธ use Router app.use('/blog', blog); const port = 5000; app.listen(port, () => { console.log(`Example app listening on port ${port}`); });
Notice that we wrapped the import in curly braces to destructure the blog
Router from the module's exports.
Here is the equivalent example using ES6 Modules import/export
syntax.
// โ using ES6 Modules import express from 'express'; const router = express.Router(); router.get('/', (req, res) => { res.send('Blog home page'); }); router.get('/about', (req, res) => { res.send('About Blog'); }); // ๐๏ธ export the router aliasing it to `blog` export {router as blog};
I aliased the router
export to blog
to make the variable name more clear in
the other file.
And here is how we'd import the Router in the other file.
import express from 'express'; // ๐๏ธ import the Router import {blog} from './blog.js'; const app = express(); // ๐๏ธ use Router app.use('/blog', blog); const port = 5000; app.listen(port, () => { console.log(`Example app listening on port ${port}`); });
Notice that we use curly braces {}
with named imports.
This is not the case with default imports and exports.
The error "TypeError: Router.use() requires a middleware function but got a
string" occurs when you pass a string as the second argument to the app.use()
method.
If you meant to set a template engine, use the app.set()
function instead.
Here is an example of how the error occurs.
// โ๏ธ TypeError: Router.use() requires a middleware function but got a string app.use('view engine', 'ejs');
Instead, you should use the app.set()
function.
app.set('view engine', 'ejs');
Make sure you have the view engine installed.
For example:
npm install ejs
(if you use ejs
)npm install pug
(if you use pug
)A template engine enables you to use static template files in your application and replaces variables with actual values.
Here is a complete example that uses the pug
template engine.
Make sure you have pug
installed if you want to run the code snippet.
npm install pug
Here is the index.js
file that sets pug
as the template engine.
const express = require('express'); const app = express(); app.set('view engine', 'pug'); app.get('/', (req, res) => { res.render('index', { title: 'bobbyhadz.com', message: 'Hello world', }); }); const port = 5000; app.listen(port, () => { console.log(`Example app listening on port ${port}`); });
Now create a views
directory at the root of your project (where your
package.json
file is) and add the following index.pug
file.
Your folder structure should look as follows.
my-express-app โโโ views โโโ index.pug โโโ index.js
html head title= title body h1= message
If I refresh my browser I can see the pug
engine has replaced the placeholders
with the given values.
If the error persists, try to restart your development server.
Open your terminal and press Ctrl
+ C
to stop your dev server and restart
it.