title: How to render template with Koa
body: <p>My effort is to re-engineer my app from Express to Koa, so routes.js and controllers.js work previously. I try to create a small mechanism to render template in Koa. The goal is to apply the working code for other modules loading <strong>different template engines</strong> automatically through render variable calling module.view_engine per module.routes . Can you help?</p>
  
  <pre><code>+---modules
  |   +---core
  |   |   +---client
  |   |   |   \---views
  |   |   |           equipment.pug
  |   |   |           error.pug
  |   |   |           home.pug
  |   |   |           
  |   |   \---server
  |   |       +---configs
  |   |       |       core.config.json
  |   |       |       core.koa.configs.js
  |   |       |       
  |   |       +---controllers
  |   |       |       core.server.controllers.js
  |   |       |       
  |   |       +---models
  |   |       |       assembly.server.model.js
  |   |       |       ecms_equipment.server.model.js
  |   |       |       ecms_location.server.model.js
  |   |       |       ecms_main.server.model.js
  |   |       |       index.js
  |   |       |       
  |   |       \---routes
  |   |               core.server.routes.js
  |   |               
  |   +---assemblys
  |   |   +---client
  |   |   |   \---views
  |   |   |           assembly_view.pug
  |   |   |           
  |   |   \---server
  |   |       +---controllers
  |   |       |       assemblys.server.controllers.js
  |   |       |       
  |   |       \---routes
  |   |               assemblys.server.routes.js
  </code></pre>
  
  <p>That's my directory structure. With a couple of Lodash each loop, I am able to achieve view_path, routes, view_engine per module in core.koa.configs.js</p>
  
  <pre><code>modules[module] = {
      view_path: view_path,
      routes: routes,
      view_engine: view_engine
    };
  </code></pre>
  
  <p>In the same file, with <code>module</code> still inside the <code>_.each</code> loop, I call </p>
  
  <pre><code>// regex to narrow the scope of code experimenting
  if (module.re('assemblys')) {
      // === var render here? ===
      require(routes)(app);
    }
  </code></pre>
  
  <p>That takes the app to the assembly.server.routes.js containing the following:</p>
  
  <pre><code>var controller  = require('../controllers/projects.server.controllers');
  
  
  module.exports = function(app){
    app.get('/task', controller.assembly)
  };
  </code></pre>
  
  <p>Then, in the assembly.server.controllers.js, I try to provide the assembly function but it doesn't work - 404 :</p>
  
  <pre><code>// load Sequelize models
  var models = require( process.cwd() + '/modules/core/server/models');
  
  exports.assembly = function *() {
    var that = this.body, views = require('co-views');
    var render = views('../../client/views/' , {
      map: {pug: 'jade'}
    });
    var Assembly = models.Assembly;
  
    Assembly.findAll().then(function (assemblys) {
      that = yield render('assembly_view' , {assemblys: assemblys});
    });
  };
  </code></pre>
  
  <p>Previously, I put <code>var render</code> inside the core.configs to be able to use view_path right there but then when I pass <code>render</code> into <code>function *()</code>, I got error and app crash! When render was in core.configs, I had the routes.js file exporting this:</p>
  
  <pre><code>module.exports = function(app, render){
        app.get('/task', controller.assembly(render));
      };
  </code></pre>
  
  <p>Some Koa examples says using <code>route</code> in this <code>app.use(route.get('/assembly', function *() { });</code>
  and I saw some other examples simply use this </p>
  
  <pre><code>app.get('/task', controller.assembly(render)); // cnpmjs.org, koan stack...
  </code></pre>
  
  <p>I prefer the latter. But having trouble with <code>yield render</code> and how to load app, render parameters into the <code>function *(app,render)</code> generator, I tried this but it doesn't work too. Error in stack trace.</p>
  
  <p><strong>The idea result is to have in core.koa.configs.js</strong> :</p>
  
  <pre><code>if (module.re('assemblys')) {
      var render = views(view_path , {
          map: view_engine
      });
      require(routes)(app, render);
  }
  </code></pre>
  
  <p>then exporting routes</p>
  
  <pre><code>module.exports = function(app, render){
    app.get('/task', controller.assembly(render))
  };
  </code></pre>
  
  <p>and the controller is able to render the assemblys:</p>
  
  <pre><code>exports.assembly = function *(render) {
    var that = this.body, views = require('co-views');
    var Assembly = models.Assembly;
  
    Assembly.findAll().then(function (assemblys) {
      that = yield render('assembly_view' , {assemblys: assemblys});
    });
  };
  </code></pre>
  
  <p>Update: See <a href="http://imgur.com/a/A79vG" rel="nofollow">stack-traces</a>, see <a href="https://github.com/zenithtekla/nodeMySQL/commits/with_koa" rel="nofollow">koa branch_commit</a>. -compiled.js.map files were generated by ES6-Babel</p>