如何在 Svelte @index.html 中使用环境变量

Cha*_*lie 3 svelte vite sveltekit

我想在svelte-kit项目中使用环境变量,但不幸的是我无法这样做。

我尝试过:

应用程序.html

<meta name="TESTING" value="%VITE_GOOGLE_TAG%">
<meta name="TESTING" value="<% VITE_GOOGLE_TAG %>">
<meta name="TESTING" value="<% process.env.VITE_GOOGLE_TAG %>">
Run Code Online (Sandbox Code Playgroud)

在我的.env变量中定义了:

VITE_GOOGLE_TAG=xxxxx
Run Code Online (Sandbox Code Playgroud)

但是当我重新启动服务器时,替换不会发生。

我希望Google tag manager id每个环境都有不同的。就像是

staging -> xxxxx
production -> yyyyy
Run Code Online (Sandbox Code Playgroud)

我如何访问svelte-kit我的环境变量app.html

ton*_*y19 5

文档描述了使用添加<meta>标签。如果您希望该标签出现在所有页面上,最好将其添加到公共布局文件(例如,)中。<head><svelte:head><meta>src/routes/__layout.svelte

您可以通过访问环境变量import.meta.env.VARNAME<meta>.value您可以使用 Svelte 的属性绑定语法(即用大括号括起来的表达式)将其绑定。

<!-- src/routes/__layout.svelte -->
<svelte:head>
  <meta name="TESTING" value={import.meta.env.VITE_GOOGLE_TAG}>
</svelte:head>
Run Code Online (Sandbox Code Playgroud)

演示