※ Nuxt v2.15.8 を使用しております。
Runtime config プロパティはキャストされる
Nuxt で環境変数を扱うには、
env プロパティ
と
Runtime config プロパティ
があります。 env プロパティから Runtime config プロパティへ移行したところ環境変数がキャストされ、同値演算子(
===
)で比較している式が失敗するという不具合に遭遇しました。(以下のような issue も立てられています。)
コンソールログを確認します。
--- env プロパティ ---
text: string
123: string
true: string
--- Runtime config プロパティ ---
text: string
123: number
true: boolean
※ 以下のように .env ファイルで値をダブルクォートで囲んだり、 nuxt.config.js ファイルで文字列として設定してもキャストされます。
TEXT=text
# ダブルクォートで囲んでもキャストされる
NUM="123"
FLAG="true"
nuxt.config.js
export default {
publicRuntimeConfig: {
text: process.env.TEXT,
// テンプレートリテラルを使用しても number 型にキャストされる
num: `${process.env.NUM}`,
// 空文字列を足しても boolean 型にキャストされる
flag: process.env.FLAG + '',
対策1: 環境変数で扱う値を string 型にする
上記の再現の場合、 FLAG=true は改善できます。例えば FLAG によってノーマルモードとハードモードに分けている場合は以下のように命名を MODE などに変更し、 boolean 型以外の値を設定します。