Static GitHub Issues

[18] Using Nuxt as a middleware : TypeError: Cannot read property 'renderer' of undefined

prev: Can this be used with github pages?
next: Missing deps

Hello there, I'm trying to create a really basic app using Nuxt as a middleware and I got an issue when I try to access the server. Here is the complete error message: The message appear both in the browser and the terminal

TypeError: Cannot read property 'renderer' of undefined
   at render (/home/vincent/WebstormProjects/nuxtExpress/node_modules/nuxt/lib/nuxt.js:94:14)
   at Layer.handle [as handle_request] (/home/vincent/WebstormProjects/nuxtExpress/node_modules/express/lib/router/layer.js:95:5)
   at trim_prefix (/home/vincent/WebstormProjects/nuxtExpress/node_modules/express/lib/router/index.js:312:13)
   at /home/vincent/WebstormProjects/nuxtExpress/node_modules/express/lib/router/index.js:280:7
   at Function.process_params (/home/vincent/WebstormProjects/nuxtExpress/node_modules/express/lib/router/index.js:330:12)
   at next (/home/vincent/WebstormProjects/nuxtExpress/node_modules/express/lib/router/index.js:271:10)
   at expressInit (/home/vincent/WebstormProjects/nuxtExpress/node_modules/express/lib/middleware/init.js:33:5)
   at Layer.handle [as handle_request] (/home/vincent/WebstormProjects/nuxtExpress/node_modules/express/lib/router/layer.js:95:5)
   at trim_prefix (/home/vincent/WebstormProjects/nuxtExpress/node_modules/express/lib/router/index.js:312:13)
   at /home/vincent/WebstormProjects/nuxtExpress/node_modules/express/lib/router/index.js:280:7

The check in the render function in lib/nuxt.js fails because this is actually undefined.

// nuxt.js
render (req, res) {
    if (!this.renderer) { // <--- Here this is undefined
      setTimeout(() => {
        this.render(req, res)
      }, 1000)
      return
    }
    // ...

This may be caused by my code? I'm probably doing something wrong in this file.

// app.js (at project's root)
const express = require('express');
const app = express();
const Nuxt = require('nuxt');
const nuxtConfig = require('./config/nuxt.config');

new Nuxt(nuxtConfig).then((nuxt) => {
    app.use(nuxt.render);

    app.listen(3000, function () {
        console.log('listening port 3000 -> http://localhost:3000');
    });
}).catch((error) => {
    console.log(error);
});
// config/nuxt.config.js (from project's root)
module.exports = {
    build: {
        vendor: ['axios']
    }
};
<!-- pages/index.vue -->
<template>
    <div>
        <div>this is template body</div>
        <p class="ita">loaded from {{ req }}</p>
    </div>
</template>
<style>
    body{
        background-color: #f9f9f9;
        text-align: center;
    }

    p.ita {
        padding: 10px;
        font-style: italic;
    }
</style>
<script>
    export default{
        data({ req }){
            return{
                msg:'hello vue',
                req: req ? 'server' : 'client'
            }
        }
    }
</script>

Thanks, and keep up the good work! :+1:

<!--cmty--><!--cmty_prevent_hook--><div align="right"><sub><em>This bug report is available on <a href="https://nuxtjs.cmty.io">Nuxt.js</a> community (<a href="https://nuxtjs.cmty.io/nuxt/nuxt.js/issues/c15">#c15</a>)</em></sub></div>