Skip to main content
Deno 2 is finally here 🎉️
Learn more

🚀 View Engine

View Engine Logo

A Template View Engine for Deno frameworks

View Engine is now matching the version of Oak

tag

Features:

  • Support multiple templating engines📰
  • Framework neutral🎨, it uses adapter to load engine
    • Current support Oak
  • Local file⛱ loading
  • Ashychorous⚡ remote file fetching (fetching template on the fly )
  • Dynamic module import, uses await to load adapters and engines🌈

Table of Contents

Usage

viewEngine(
  adapter: Adapter,
  engine:Engine,
  viewConfig?: ViewConfig
)

🎛Adapter

import { oakAdapter } from "https://deno.land/x/view_engine@v10.5.1/mod.ts"

🚀Engine

import { ejsEngine, denjuckEngine, handlebarsEngine } from "https://deno.land/x/view_engine@v10.5.1/mod.ts"

⚙ViewConfig

const viewConfig: ViewConfig = {
  viewRoot: <string>"./views", // default: "", specify the root path, it can be remote address
}

🔝

Examples

Use Oak to render eta template at ./views/eta/index.eta

Suppose you have a folder like this: 

/views/index.ejs
/app.ts
<!--index.html-->
<body>
  Hobbies of <%=it.name%> 
</body>
// app.ts
import { Application } from "https://deno.land/x/oak@v10.5.1/mod.ts";
import { viewEngine, ejsEngine, oakAdapter } from "https://deno.land/x/view_engine@v10.5.1c/mod.ts"

const app = new Application();

app.use(
  viewEngine(oakAdapter, etaEngine, {
    viewRoot: "./views/eta",
  })
);

app.use(async (ctx, next) => {
  ctx.render("index.eta", { name: "John" } );
});

await app.listen({ port: 8000 });

Then run

> deno run --allow-net --allow-read ./app.ts

Open any browser, url: http://localhost:8000 you should see the result.

🔝

Credit

Original work by @gjuoun