Nuxtで.envに「8e12345」と書いたらconfigの値が無限になった

2024/05/24

Categories: nuxt

あるwebアプリフロントエンドを nuxt generate で静的生成している。

アプリのバージョンとして gitcommit hash(short) を用いており、CIの過程で commit hash をアプリの設定値として静的生成に含めている。

問題

nuxt.configのRuntimeConfigは所定のルールで環境変数から値を取る。
https://nuxt.com/docs/guide/going-further/runtime-config#environment-variables

export default defineNuxtConfig({
  runtimeConfig: {
    public: {
      rev: '(develop)',
    }
  },
  // 略

public.rev に対応する環境変数は NUXT_PUBLIC_REV なので

NUXT_PUBLIC_REV="8e12345"

という.envを置いてnuxt generateすることでバージョンを埋め込んでいる。

しかし

<script setup lang="ts">

const rc = useRuntimeConfig()
const rev = rc.public.rev

この rev の値は Infinity: number になる。

ここでの環境変数 NUXT_PUBLIC_REV の値は 8e12345 だがこれを nuxt が指数表記の number として解釈し結果 Infinity となってしまう。

原因

https://github.com/nuxt/nuxt/blob/00ba04cb29f328ee5865364c043bf06e50bb4a1b/packages/kit/src/runtime-config.ts#L53

function getEnv (key: string, opts: EnvOptions, env = process.env) {
  const envKey = snakeCase(key).toUpperCase()
  return destr(
    env[opts.prefix + envKey] ?? env[opts.altPrefix + envKey],
  )
}

環境変数から取得した値を https://github.com/unjs/destr で評価することで指数表記っぽい文字列がnumberにされてしまう。

回避

destr"8e12345" のような値が渡されるようにする

NUXT_PUBLIC_REV='"8e12345"'
NUXT_PUBLIC_REV=""8e12345""
NUXT_PUBLIC_REV=`"8e12345"`

感想

こんなんが object に展開されてniceでしょということだと思うがヘイトが増しただけ

NUXT_SOME_VAL={"go", "to hell"}

環境

>> Home