现在前端工具这么多真的有点用不明白

最近看到一款 hugo 主题 paper ，想移植到 Ghost 上，虽然也算是移植完了，（ https://github.com/rebron1900/ghost-paper ）但是在移植过程中遇到了一点问题。

因为 Ghost 主题是用的 handbelars ，而原主题又用了 tailwindcss ，恰好我在其中一个页面上的 style 里用模板引擎的语法输出了一个文件地址，但是 tailwindcss 把这段代码识别成了问题，

如： {{asset "assets/imgs/theme.png"}} 就被 tailwindcss 给识别成了一段文本。

<a
      class="btn-dark ml-6 h-6 w-6 shrink-0 cursor-pointer {{#if @custom.monoDarkIcon }}[background:url({{asset "assets/imgs/theme.png"}})_left_center/cover_no-repeat] dark:invert{{ else }}[background:url(/assets/imgs/theme.png)_left_center/_auto_theme('spacing.6')_no-repeat] [transition:_background-position_0.4s_steps(5)]{{/if}} dark:[background-position:right]"
    ></a>

我 google+baidu ，发现似乎可以通过一些打包程序来预处理这个问题，但是在使用的过程中就有标题上的吐槽~ 现在的前端工具花样太多了，而且都有自己独特的配置文件，没怎么接触过前端的贸然来搞真的一头雾水，而且配置文件都是一层套一层，真的不太容易看的明白。

想问问前端的大佬们是怎么看这个问题的，又是怎么看明白，怎么学这个东西的。