Libの問題?あなたの作成!


私はノードに取り組んでいます.使用しているJSプロジェクトKoa . 使いたかったTwig ビューをレンダリングするためにテンプレートエンジンとして.私はいくつかの問題に遭遇しました.

多くのポンドと1つの問題


KOAでHTMLをレンダリングする通常の方法はkoa-views , 使用方法consolidate フードの下.consolidate 使用するテンプレートエンジンを手動で追加して設定する必要があります.
依存している多くのlibsがありますkoa-viewsconsolidatetwig ). これは悪いことではありませんが、これは各libが正しく他の人と通信する必要があります.
私は問題が発生したときに、または他のtwigファイルを拡張したいと思った.以下のコードを例にとりましょう.
{# template.twig #}

<!DOCTYPE html>
<html lang="en">
  <head>...</head>
  <body>
    <main>{% block main %}{% endblock %}</main>
  </body>
</html>
{# home.twig #}

{% extends "template.html" %}

{% block main %}
<div>Home</div>
{% endblock %}
このコードは次のエラーにつながります.で説明したような特定の設定を追加してもthis issue .
Error parsing twig template undefined: 
TwigException: Cannot extend an inline template.
問題を読むことによって、これらのlibsの間に若干の干渉があったように見えました、それで、私は彼らの数を減らして、KonaとTwigの間で私自身でリンクを作ることに決めました.

公案


の目標koa-twig とのコンテキストを強化することですrender 関数.それは、大いに鼓舞されますkoa-views .
コードの最初のバージョンを紹介します.私はそれを改善し、私はKOAのための他のテンプレートエンジンのバインディングと同じ機能を提供するために、まだそれを改善していますkoa-ejs , koa-hbs ...).
const twig = require("twig");
const util = require("util");

// Use Promise instead of callback syntax.
const renderFile = util.promisify(twig.renderFile);

/**
 * Give the ability to use Twig template engine in Koa
 * @param {object} config
 * @param {string} config.views - the views folder path
 * @param {object} config.data - the data to pass to each view
 * @param {object} config.extension - the data to pass to each view
 */
const twigMiddleware = (config) => async (ctx, next) => {
  function render(file, data) {
    return renderFile(`${config.views}/${file}.${config.extension || "twig"}`, {
      ...config.data,
      ...data,
    });
  }

  /* `render` function will be accessible
  on ctx and on ctx.response */
  ctx.response.render = render;
  ctx.render = render;

  await next();
};

module.exports = twigMiddleware;
ここでは基本的なユースケースです.
const Koa = require("koa");
const koaTwig = require("koa-twig");

const app = new Koa();

// Configuration of the middleware
app.use(
  koaTwig({
    views: `${__dirname}/views`
  })
);

app.use(async (ctx) => {
  // Calling `render` will render `./views/home.twig`
  ctx.body = await ctx.render("home");
});

app.listen(8080);
それで、それは速い勝利に達することがそんなに難しくありませんでした.私は今より少ない中間で開発することができます.これはまた、私はあなたがすべての問題のためのlibを必要としないことを覚えている何かです!

ボーナス


すべてのprs私はこの小さなリバのためにHacktoberfestカウント🎉

もう一つの理由を作成し、あなたがやっている共有!

結論


道路上の障害がある場合は、右に行くことができない場合は、左を試してください.それが閉じられるならば、上がってください.ブロックされている場合は、下に掘る!誰かがあなたのために道をきれいにするのを待ちません.
私はまだ他のKAテンプレートエンジンのバインディングと同じ機能を持つためにいくつかの仕事を持っているが、それは私が満足している最初のステップです!
ショートバージョン:DIYとキス.
読書ありがとう.

リンク

  • Banner image