如何将条件内容添加到Nuxt.jsapp.html(应用程序模板)



有人知道Nuxt.js在他们的app.html中使用什么模板语言吗?

只有在ENV 上定义了GA ID的情况下,我才想添加Google Analytics脚本

所以它会是这样的:

<!DOCTYPE html>
<html {{ HTML_ATTRS }}>
<head {{ HEAD_ATTRS }}>
ANOTHER META HERE
<% if GOOGLE_ANALYTICS_IS_PRESENT_ON_ENV do %>
<!-- Global site tag (gtag.js) - Google Analytics -->
<script async src="https://www.googletagmanager.com/gtag/js?id=<%= process.env.NUXT_ENV_GOOGLE_ANALYTIC_ID %>">
</script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', '<%= process.env.NUXT_ENV_GOOGLE_ANALYTIC_ID %>');
</script>
<% endif %>
{{ HEAD }}
</head>
<body {{ BODY_ATTRS }}>
{{ APP }}
</body>
</html>

请看上面我的ifendif标签是Shopify的Liquid模板吗?

我在这个示例模板的基础上找到了如何做到这一点

https://github.com/nuxt/nuxt.js/blob/bb9427ee743a556761105dd0c4e7e474e922aee6/examples/custom-template/app.html

<html>
<head>
{{ HEAD }}
{% if (ENV.NODE_ENV === 'dev') { %}
<!-- debug scripts -->
{% } else if (ENV.NODE_ENV === 'production') { %}
<!-- production scripts -->
{% } %}
</head>
<body>
{{ APP }}
</body>
</html>

最新更新