如何使用 webpack/babel 来预解析 JS 模板字符串？

Question

比如说，我想创建一个rot13模板标签。你可以这样使用它：

 let secret = rot13`This is a secret.`;

现在我可以在 JavaScript 中实现这个标签，但我想预解析它，以便我编译的包实际上包含：

 let secret = "Guvf vf n frperg.";

我怎样才能做到这一点？我是否必须创建一个 Babel 插件来连接到他们的解析器？那会是什么样子？

现在，如果我想让 Webpack 也吐出一个名为的文件，该文件rotated_strings.txt包含所有这些已转换字符串的列表？我如何收集它们？即，我如何让 Babel 和 Webpack 进行通信，以便 Babel 可以进行内联转换，但以某种方式通知 Webpack 生成这个额外的文件？

Answer 1

尝试以下方法。
https://astexplorer.net/#/gist/89a6bdce0165d2661385828d9d85a7e0/4d745f3e8b5bfd25ba919cff567f27055d9e3a75

• 我已经建立在乔·克莱在评论中创建的内容上。
• 现在这个控制台记录了它最后更改过的所有内容
• 在评论中，我已经写了一旦将其移至项目构建环境中即可替换的内容（假设它是 Node）

PS：我在注释中使用了同步 API 来快速演示它，您可能应该切换到异步 API

更新：当你在 Babel 插件中编写此内容时，请确保不要设置准和熟的属性，而是path.replaceWith(t.stringLiteral(cooked))使用