Support Environment variables in HTML #892

silverwind · 2020-08-24T09:36:56Z

silverwind
Aug 24, 2020

CRA support environment variables in HTML but it seems this feature is not yet implemented in Snowpack. For example:

<html lang="en" data-build-time="%SNOWPACK_BUILD_TIME%">
  <head>
    <title>%SNOWPACK_APP_NAME%</title>
  </head>
</html>

Running SNOWPACK_APP_NAME="My App" SNOWPACK_BUILD_TIME="$(date +%s%3N)" snowpack build does not seem to replace the variables in output file build/index.html.

FredKSchott · 2020-08-24T18:54:37Z

FredKSchott
Aug 24, 2020
Maintainer

Sounds interesting! We actually implemented this already for %PUBLIC_URL%, but did not implement for generic env variables.

Note: To match our existing env variable support, we would only support SNOWPACK_PUBLIC_* prefixed env variables, so in your example above that would be <html lang="en" data-build-time="%SNOWPACK_PUBLIC_BUILD_TIME%">

Compatibility with Create React App is a goal, so this feature request makes sense to me. Spinning into an issue to prioritize!

1 reply

silverwind Aug 24, 2020
Author

Looking forward to it. SNOWPACK_PUBLIC_* is totally fine as long as it's consistent with the JS API, the SNOWPACK_* suggestion was just me not reading the docs precisely. 😉

gr2m · 2020-08-24T21:48:26Z

gr2m
Aug 24, 2020

Fred filed an issue here: #898. A pending pull request to implement replacing environment variables in HTML is here: #900

0 replies

silverwind · 2020-08-25T17:49:21Z

silverwind
Aug 25, 2020
Author

The SNOWPACK_PUBLIC_ prefix still irks me a bit as the "public" has no real meaning in it except for a PUBLIC_URL name. Is it already too late to change it to SNOWPACK_? I guess there could be a transitional period where both prefixes are supported with the shorter ones preferred.

1 reply

FredKSchott Aug 26, 2020
Maintainer

This is one of those weird things where it's intentionally verbose. I'd personally prefer SNOWPACK_ too, but it's common for developers to not realize that this env variable is written directly into the public JS code that's shipped to the client. You'd be surprised how easy it is to add a sensitive secret to your public website build without that loud PUBLIC signal.

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Uh oh!

Support Environment variables in HTML #892

Uh oh!

{{title}}

Uh oh!

Replies: 3 comments 2 replies

Uh oh!

{{title}}

Uh oh!

Uh oh!

{{editor}}'s edit

{{editor}}'s edit

Uh oh!

Uh oh!

{{title}}

Uh oh!

Uh oh!

{{editor}}'s edit

{{editor}}'s edit

Uh oh!

Uh oh!

{{title}}

Uh oh!

Uh oh!

{{title}}

Uh oh!

Uh oh!

{{title}}

Uh oh!

Select a reply

Uh oh!

Support Environment variables in HTML #892

Uh oh!

silverwind Aug 24, 2020

Replies: 3 comments · 2 replies

Uh oh!

Uh oh!

FredKSchott Aug 24, 2020 Maintainer

Uh oh!

Uh oh!

silverwind Aug 24, 2020 Author

Uh oh!

gr2m Aug 24, 2020

Uh oh!

silverwind Aug 25, 2020 Author

Uh oh!

FredKSchott Aug 26, 2020 Maintainer

silverwind
Aug 24, 2020

Replies: 3 comments 2 replies

FredKSchott
Aug 24, 2020
Maintainer

silverwind Aug 24, 2020
Author

gr2m
Aug 24, 2020

silverwind
Aug 25, 2020
Author

FredKSchott Aug 26, 2020
Maintainer