Визуализация шаблона ветки в расширении Chrome

Question

Я пытаюсь отобразить шаблон ветки (с twigjs) в расширении Chrome.В настоящее время я компилирую следующий машинописный текст с помощью сценария сборки browserify.

import * as twig from "twig"

const MAIN_TEMPLATE: string = chrome.runtime.getURL("twig/main.html.twig");

document.addEventListener("DOMContentLoaded", () => {
        twig.renderFile(MAIN_TEMPLATE, (err: Error, html: string) => {
            document.querySelector("body").innerHTML = html;
        });
});

Я включил файлы в мой manifest.json как таковой.

...
    "web_accessible_resources": [
        "twig/*.html.twig"
    ]
...

Тем не менее, после запуска этого я получаю следующую трассировку стека.Я не совсем уверен, что делать, так как URL, который возвращает chrome.runtime.getURL, разрешается, если я помещаю его в адресную строку.

Uncaught TypeError: t.stat is not a function
    at Object.<anonymous> (twig.js:1)
    at Object.e.Templates.loadRemote (twig.js:1)
    at Object.e.exports.twig (twig.js:1)
    at Object.e.exports.renderFile (twig.js:1)
    at HTMLDocument.<anonymous> (browser-action.ts:7)

Answer 1

Копая часть исходного кода twigjs, похоже, что моей ошибкой было использование помощника renderFile.Это более правильно.

const MAIN_TEMPLATE_URI: string = chrome.runtime.getURL("twig/main.html.twig");
const MAIN_TEMPLATE: twig.Template = twig.twig({href: MAIN_TEMPLATE_URI, async: false};

document.querySelector("body").innerHTML = MAIN_TEMPLATE.render({tabs, tabListTemplate: TAB_LIST_TEMPLATE_URI});

Я использовал async false, поскольку он будет получать только по локальному соединению, поэтому на самом деле не должно быть никаких задержек при загрузке шаблона синхронно.