代码之家 › 专栏 › 技术社区 › ollien

在chrome扩展中呈现细枝模板

twig google-chrome-extension javascript

ollien · 技术社区 · 6 年前

我试图在chrome扩展中呈现一个twig(带有twigjs)模板。我目前正在用一个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"
    ]
...

但是,在运行这个之后,我得到了下面的stacktrace。我真的不知道该怎么做,作为网址 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)

1 回复 | 直到 6 年前

ollien 6 年前

挖掘一些 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});

推荐文章

Vazgen Manukyan · Twig如何禁用删除空白

7 年前

Miguel · 10月CMS-按页面变量订购前端列表(变量不在数据库中)

7 年前

Heri · 无法将日期更改为法语,即使twig symfony 3中的区域设置为“fr”

7 年前

nomistic · 详细条件提交预防默认值

7 年前

Kristen Joseph-Delaffon · Twig-在循环中获取相应的字母

7 年前

jeevan · 小枝中的Symfony投票者

7 年前

EternalHour · 在Twig中动态使用自定义函数?

7 年前

Jianov · 从现有阵列构造细枝阵列

7 年前

Václav Stummer · 具有的文件。树枝延伸不工作

7 年前

Kamil Dzieniszewski · 如何使用木材模板引擎将css中的ACF图像字段用于媒体查询?

7 年前