問題描述

我必須解決 gettext 的限制來識別 ES6 模板字符串，并且我考慮將模板字符串的非插值"作為編譯步驟，以便只有代碼中的正常"字符串.

I have to work around the limitation of gettext to recognise ES6 template strings, and I thought about getting the "non interpolated value" of the template strings as a compilation step, in order to have only "normal" strings in the code.

基本上我想要實現的就是改造這個

Basically what I would like to achieve is transform this

const adjective = 'wonderful'
const something = `Look, I am a ${adjective} string`

console.log(something)
> "Look, I am a wonderful string"

進入這個

const adjective = 'wonderful'
const something = 'Look, I am a ${adjective} string'

console.log(something)
> "Look, I am a ${adjective} string"

實現這一目標的一種殘酷方式是使用 sed，但它肯定不是更優雅(而且可能還容易出錯)

One brutal way of achieving this is using sed, but it's most certainly not the more elegant (and probably also error prone)

sed "s/`/'/g" FILENAME

有什么更好更簡潔的想法嗎?

Any better and cleaner idea comes to mind?

推薦答案

好問題.想到了四種解決方案:

Great question. There are four solutions that come to mind:

按照您的建議，在掃描可翻譯字符串之前用引號強力替換反引號并不是一個可怕的想法，只要您了解風險即可.例如，考慮:

A brute force replacement of backticks with quote marks prior to scanning for translatable strings, as you suggested, is not a horrible idea, as long as you understand the risks. For instance, consider:

"hello, this word is in `backticks`"

另一個極端情況是

`${`I am nested`}`

這種方法也會破壞多行模板字符串.

This approach will also break multi-line template strings.

當然，正確"的解決方案是編寫一個處理模板字符串的 xgettext 分支.然后你可以寫

Of course, the "correct" solution is to write a fork of xgettext that deals with template strings. Then you could just write

const something = _(`Look, I am a ${adjective} string`);

不幸的是，這可能比看起來更難.xgettext 內部有一堆與字符串相關的硬連線邏輯.如果你要承擔這個項目，很多人會感謝你.

Unfortunately, this could be harder that it seems. There is a bunch of hard-wired logic inside xgettext related to strings. If you were to undertake this project, many would thank you.

更強大的替代方法是使用 JavaScript 解析器，例如 Esprima.這些解析器公開了獲取標記(例如模板字符串)的能力.正如您在 http://esprima.org/demo/parse.html 中看到的，相關的要查找的令牌類型是 TemplateLiteral.

The more robust alternative is to use a JavaScript parser such as Esprima. These parsers expose the ability to pick up tokens (such as template strings). As you can see at http://esprima.org/demo/parse.html, the relevant token type to look for is TemplateLiteral.

另一個(不好的?)想法是將模板字符串作為常規字符串編寫，然后在運行時將它們視為模板字符串.我們定義一個函數eval_template:

Another (bad?) idea is to write template strings as regular strings to start with, then treat them as template strings at run-time. We define a function eval_template:

const template = _("Look, I am a ${adjective} string");
const something = eval_template(template, {adjective});

eval_template 將字符串轉換為評估模板.模板字符串中使用的本地范圍內的任何變量都需要作為第二個參數中傳遞的對象的一部分提供給 eval_template(因為使用 Function 創建的函數位于全局范圍并且不能訪問局部變量，所以我們必須將它們傳入).實現如下:

eval_template converts a string into an evaluated template. Any variable in local scope used in the template string needs to be provided to eval_template as part of the object passed in the second parameter (because functions created using Function are in the global scope and cannot access local variables, so we have to pass them in). It is implemented as follows:

function eval_template_(s, params) {
  var keys = Object.keys(params);
  var vals = keys.map(key => params[key]);

  var f = Function(...keys, "return `" + s + "`");
  return f(...vals);
}

當然，這有點尷尬.這種方法的唯一優點是它不需要預掃描重寫.

Granted, this is a bit awkward. The only advantage of this approach is that it requires no pre-scan rewriting.

小問題，但是如果原始模板字符串是多行的，則不能直接將其重寫為常規字符串.在這種情況下，您可以將其保留為反引號模板字符串，但將 $ 轉義為 $，一切都會好起來的:

Minor point, but if the original template string is multi-line, you cannot directly rewrite it as a regular string. In that case, you can leave it as a back-ticked template string but escape the $ as $, and all will be well:

底線:除非您想重寫 xgettext、使用解析器或從事其他黑客活動，否則請進行暴力替換.

Bottom line: unless you want to rewrite xgettext, use a parser, or engage in other hackery, do the brute force replacement.

這篇關于你能“低頭"嗎?ES6模板字符串到普通字符串?的文章就介紹到這了，希望我們推薦的答案對大家有所幫助，也希望大家多多支持html5模板網！