Cannot show debug messages inside the Nuxt project files

Question

I am using nuxt 2.5.1 and want to log some messages by debug. I tried start up the project by "DEBUG=* nuxt" and tons of debug messages flooding in, so I expect the setup is OK.

But when I try showing my custom messages in a project file, the debug messages never show up.

I start the app by 'npm run dev-debug'.

package.json

"scripts": {
    "dev": "nuxt",
    "dev-debug": "DEBUG=app nuxt",
    "build": "nuxt build",
    "start": "nuxt start",
    "generate": "nuxt generate",
    "lint": "eslint --ext .js,.vue --ignore-path .gitignore .",
    "precommit": "npm run lint"
  },

middleware/api/staffDuties.js

const axios = require('axios')
const debug = require('debug')('app')

export default function() {
  debug('Hello')
  axios({
    url: 'http://localhost:3010/staffDuties',
    method: 'get'
  }) // do stuff...

  debug('succeed')
}

The staffDuties.js is placed inside the middleware folder and is mapped to the index.vue. I use json-server to mock an API endpoint, from the run log of json-server I can confirm the function is indeed executed.

Can anyone give me some advice?