I have installed consola in my project and when I click on a nuxt-link who must display a log via Middleware I have an error : consola.info is not a function
If I refresh the page with my browser the log works well.
PS : an other project with nuxt 2.5.0 and consola 2.5.7 was working well
My middleware/log-router.js file
const consola = require('consola')
export default function (context) {
consola.info('--> Info | request ' + context.route.fullPath + ' launched')
}
- My nuxt.config.js file
export default {
...
router: {
// Run the middleware/log-router.js on every page
middleware: 'log-router'
}
}
![Capture d’écran 2019-10-10 à 10.51.32.png](https://cmty.s3.eu-west-1.amazonaws.com/127546642/49828880-eb3b-11e9-8a63-1b9e0dd67dde.png)
### What is expected ?
Log a message
### What is actually happening?
Blank page with error.
- Page :
consola.info is not a function
An error occurred while rendering the page. Check developer tools console for details.
- Console :
vendors.app.js:11254 error TypeError: consola.info is not a function
at app.js:3989
at promisify (app.js:3422)
at middlewareSeries (app.js:3401)
at Vue.callMiddleware (app.js:943)
at Vue._callee4$ (app.js:1069)
at tryCatch (commons.app.js:6116)
at Generator.invoke [as _invoke] (commons.app.js:6342)
at Generator.prototype.<computed> [as next] (commons.app.js:6168)
at asyncGeneratorStep (commons.app.js:31)
at _next (commons.app.js:53)
log @ vendors.app.js:11254
_log @ vendors.app.js:11166
_logFn @ vendors.app.js:11160
logFn @ vendors.app.js:11084
push../.nuxt/client.js.vue__WEBPACK_IMPORTED_MODULE_18__.default.config.errorHandler @ app.js:680
globalHandleError @ app.js:3101
_callee4$ @ app.js:1319
tryCatch @ commons.app.js:6116
invoke @ commons.app.js:6342
prototype.<computed> @ commons.app.js:6168
asyncGeneratorStep @ commons.app.js:31
_next @ commons.app.js:53
Promise.then (async)
asyncGeneratorStep @ commons.app.js:41
_next @ commons.app.js:53
(anonymous) @ commons.app.js:60
(anonymous) @ commons.app.js:49
_render @ app.js:1342
render @ app.js:947
iterator @ commons.app.js:10678
step @ commons.app.js:10452
(anonymous) @ commons.app.js:10453
(anonymous) @ commons.app.js:10699
_callee3$ @ app.js:805
tryCatch @ commons.app.js:6116
invoke @ commons.app.js:6342
prototype.<computed> @ commons.app.js:6168
asyncGeneratorStep @ commons.app.js:31
_next @ commons.app.js:53
(anonymous) @ commons.app.js:60
(anonymous) @ commons.app.js:49
_loadAsyncComponents @ app.js:842
loadAsyncComponents @ app.js:736
iterator @ commons.app.js:10678
step @ commons.app.js:10452
step @ commons.app.js:10456
runQueue @ commons.app.js:10460
confirmTransition @ commons.app.js:10707
transitionTo @ commons.app.js:10609
push @ commons.app.js:10919
push @ commons.app.js:11300
handler @ commons.app.js:9174
invokeWithErrorHandling @ commons.app.js:13255
invoker @ commons.app.js:13580
original._wrapper @ commons.app.js:18303
Show 14 more frames
<!--cmty-->
<div align="right"><sub><em>This bug report is available on <a href="https://cmty.app/nuxt">Nuxt</a> community (<a href="https://cmty.app/nuxt/consola/issues/c60">#c60</a>)</em></sub></div>
Version
v2.10.0
Reproduction link
https://jsfiddle.net/boilerplate/vue
Steps to reproduce
Hello.
I have installed consola in my project and when I click on a nuxt-link who must display a log via Middleware I have an error : consola.info is not a function
If I refresh the page with my browser the log works well.
PS : an other project with nuxt 2.5.0 and consola 2.5.7 was working well
export default function (context) { consola.info('--> Info | request ' + context.route.fullPath + ' launched') }
export default { ... router: { // Run the middleware/log-router.js on every page middleware: 'log-router' } }