next-sitemap
というNext.jsで使えるサイトマップ生成ライブラリを利用します。robots.txt
も同時に生成できる上に設定もカンタンです。$ npm install --save next-sitemap
$ yarn add next-sitemap
next-sitemap
はデフォルトでnext-sitemap.config.js
というファイルをルートディレクトリに設置することで、その設定を読み取ります。next-sitemap.config.cjs
という名前にリネームしました。const siteUrl = process.env.NEXT_PUBLIC_ROOT_URL;
const NEXT_SSG_FILES = [
'/*.json$',
'/*_buildManifest.js$',
'/*_middlewareManifest.js$',
'/*_ssgManifest.js$',
'/*.js$',
];
/** @type {import('next-sitemap').IConfig} */
module.exports = {
siteUrl: siteUrl,
outDir: './out',
autoLastmod: false,
generateRobotsTxt: true,
sitemapSize: 7000,
exclude: ['/contact'],
robotsTxtOptions: {
policies: [
{
userAgent: 'GPTBot',
disallow: '/',
},
{
userAgent: '*',
disallow: NEXT_SSG_FILES,
},
],
},
};
NEXT_PUBLIC_ROOT_URL
の同一になることが一般的。lastmod
を設定の是非。デフォルトはtrue
だが、すべて同一日時が入ってしまうのでfalse
にする。sitemap-{i}.xml
ごとのURL数。越えるとファイル分割する。robots.txt
を生成の是非。true
で生成。robots.txt
の設定オプション。robots.txt
のポリシー。NEXT_SSG_FILES
として定義したファイル群をGoogleなどのクローラーボットが通らないようにしたいという意図です。そして、ChatGPTの学習ボットであるGPTBotが通らないようにrobots.txt
を設定しています。package.json
に記載されたscripts
の部分へ以下を追加します。"scripts": {
// その他のスクリプト
"postbuild": "npm run sitemap",
"sitemap": "next-sitemap --config next-sitemap.config.cjs"
},
$ npm run postbuild
postbuild
を実行するとnext-sitemap
が実行されるという形です。.cjs
にしているため、--config
オプションをつけていますが、next-sitemap.config.js
ファイルの場合は必要ありません。.gitginore
ファイルに生成されたものが混ざらないように以下のように書いておきましょう。(忘れがちのため書いておきます)# sitemap
/public/sitemap*
/public/robots.txt
npx next build
が設定されますが、これをnpm run build
に修正します。package.json
に設定したnext-sitemap
コマンドが実行されることになります。https://ドメイン/sitemap.xml
を開いた際に下記画像のようにXMLが表示されます。next-sitemap
は他にも非同期を使った設定なども可能となっています。