【Next.js】定数管理ファイルはどこに置く？

Railsでいう "config/settings.yml" やPHPでいう "config/config.php" なんだけど、どこにどう置くのがベストなんだろう。

基本的に環境変数として扱うのが普通っぽい（？）

Railsだとdotenv使ってたけど、環境依存はない定数管理で環境変数を使うのが抵抗ある、、、serverRuntimeConfig/publicRuntimeConfigについてもenvとはビルド時かアプリ起動時かの違いだけみたいだし。

ということで、自分でymlで設定ファイルを作って読み込むようにしました。一応、envの設定方法も載せておきます。

①next.config.jsで設定する（v8以上）

module.exports = {
 env: {
   customKey: 'my-value',
 },
}

https://nextjs.org/docs/api-reference/next.config.js/environment-variables

②dotenvを使う

dotenvをnpmまたはyarnでいれて、next.config.jsに

require('dotenv').config()

を入れるだけ。

require('dotenv').config()
module.exports = {
 env: {
   customKey: 'my-value',
 },
}

https://github.com/motdotla/dotenv

③【採用】設定ファイル（yml）を自分で作る

1. npm i js-yaml-loader

2. next.config.js に以下を追加

module.exports = {
 webpack: function (config) {
   config.module.rules.push(
     {
       test: /\.ya?ml$/,
       use: 'js-yaml-loader',
     },
   )
   return config
 }
}

3. settings.yml みたいなファイルを作って、

hoge: 'ホゲ'

import settings from './settings.yml'
console.log(settings.hoge)

こんな感じに使用します。

他に方法があれば誰か教えてくださいー

Next.js はググっても Nuxt.js ばかり出てくるし、参考サイト少ないですね。。。