環境変数でrobots.txtの出力を出し分けるNext.js用スクリプト

公開日時
更新日時

next build時に環境変数でrobots.txtの出力を出し分けたかったので対応。

本番はインデックス登録を許可するが、その他の環境では検索エンジンのインデックス登録を拒否したい時に使う。

  • scripts/generate_robots_txt.ts

環境変数でrobots.txtの内容を出し分ける

import fs from 'fs'
import path from 'path'

const createRobotsTxt = () => {
  if (process.env.ROBOTS_TXT_ALLOW === 'true') {
    return `User-agent: *\nAllow: /`
  } else {
    return `User-agent: *\nDisallow: /`
  }
}

export const generateRobotsTxt = () => {
  fs.writeFileSync(path.join(__dirname, '..', 'public', 'robots.txt'), createRobotsTxt())
}
  • scripts/pre_build.ts

他にもビルド時に実行したいものがある場合(sitemap, rss生成等)はこのスクリプトに追記していく。

import { generateRobotsTxt } from './scripts/generate_robots_txt'

generateRobotsTxt()
  • package.json 設定

package.json のscriptsにprebuildを追加して、build前に自動実行されるようにしておく。

{
  "scripts": {
    "dev": "next dev",
    "prebuild": "ts-node -O '{\"module\":\"commonjs\"}' scripts/pre_build.ts",
    "build": "next build",
    "start": "next start"
  }
}

なお、デフォルトのtsconfig.jsonのまま ts-node scripts/pre_build.ts を実行すると↓のエラーになるため、tsconfigのmodule設定をcommonjsにoverrideするようにしている。

SyntaxError: Cannot use import statement outside a module

これでbuild時にrobots.txtが生成できるようになった。

参考


Related #next.js

SharedArrayBuffer updates in Android Chrome 88 and Desktop Chrome 92

クロスオリジン分離対応を実施

react-hook-formとReact Datepickerを組み合わせる

Hook FormのControllerを使う

Next.jsで生成したサイトで特定のページのみnoindexを設定する

タグに紐づく記事一覧ページはnoindexにした

Next.jsでAdsenseタグを埋め込んだら Only one AdSense head tag supported per page エラーが発生

Only one AdSense head tag supported per page. The second tag is ignored.