javascript - 如何使用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

• 我以 Joe Clay 在评论中创建的内容为基础。
• 现在这个控制台记录它在最后一次更改的所有内容
• 并且在评论中我已经写了一旦你将它移动到在你的项目构建环境中使用(假设它是节点)你可以替换它的东西

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

更新:当你在 Babel 插件中写这个时，一定要不设置准和熟属性，而是使用 path.replaceWith(t.stringLiteral(熟)) 而不是