Метод POST дает неопределенное значение при загрузке файла изображения из веб-интерфейса

Question

Я пытаюсь загрузить файл изображения в моем приложении узла, но console.log (req.file) дает мне неопределенное значение.

const upload = multer({dest: 'uploads/'});

app.post('/article', upload.single('articleImage'), (req, res, next) => {
  console.log(req.file); //Getting undefined here.
  let article = new Article();
  article.title = req.body.title;
  article.author = req.body.author;
  article.body = req.body.body;

  article.save(err => {
  if(err){
     console.log(err);
     return;
  } else {
     res.redirect('/');
    }
  });
});

Ниже приведен мой HTML-код, пока я загружаю файл.

<form class="product-form" action="/article" method="POST" enctype="multipart/formdata">
            <div class="form-group">
                <label for="Title">Title</label>
                <input class="form-control" type="text" name="title" id="title">
            </div>
            <div class="form-group">
                <label for="Author">Author</label>
                <input class="form-control" type="text" name="author" id="author">
            </div>
            <div class="form-group">
                <label for="Body">Body</label>
                <textarea class="form-control" type="text" name="body" id="author" rows=5></textarea>
            </div>
            <div class="form-group">
                <input class="form-control" type="file" name="articleImage" id="file">
            </div>

            <button class="btn btn-primary" type="submit" value="Submit">Add Product</button>
</form>