如何在不使用 new Function 的情况下渲染模板文字，因为 chrome 扩展清单 v3 不允许不安全评估

Question

我使用 v2 清单制作了一个 chrome 扩展，它使用了大量来自 json 文件的模板文字。我使用新函数渲染它们，这使得它变得如此简单。但是对于chrome扩展manifest v3来说，是不可能使用new Function的。有人有任何不需要大规模重构的建议吗？

这是我如何使用 new Function 来呈现模板文字的示例。遗憾的是，这是不允许的，因为我用反引号包裹了整个表达式，所以在这种情况下使用 new Function 并没有真正看到问题。

function renderTemplate(expression, data) {
  return new Function("data", "return " + "`" + expression + "`")(data);
}

const json = {
  "test":"Hi I'm ${data.name}. It's ${data.time} and I'm almost ${data.age} years old."
};

const renderedTemplate = renderTemplate(json.test, { name: "Patrick", age: 30, time: "3pm" });
console.log(renderedTemplate); // Hi I'm Patrick. It's 3pm and I'm almost 30 years old.

我知道可以在扩展中运行一个沙箱页面来执行新函数，但它需要在两个脚本之间使用 postMessage，因此它是异步的，我宁愿避免这种情况。

我还阅读了有关预编译模板或使用标记模板的信息，但这意味着我的代码的重要重构。

我只是想找到一种方法来渲染模板字符串，而不使用新函数，并对我的代码进行最小的更改。

Answer 1

我发现https://github.com/shepherdwind/simple-evaluate 该方法可以计算数学表达式和字符串模板，但不能调用函数或设置 eval 和 new Function 等属性。但它仍然应该对我的扩展重构有所帮助。