🍆

Next.js 15から追加された左下に表示される雷マークを非表示にする

2024/11/29に公開

Next.js 15になってから開発環境で左下に雷マークのインジケーターが表示されるようになりました。(Static Routeなどがすぐに分かるようになった。)

これはNext.jsのドキュメント上では「devIndicators」という名称で呼ばれています。

https://nextjs.org/docs/app/api-reference/next-config-js/devIndicators

便利だけど常に表示されていると結構邪魔なシーンもあるかと思います。永続的に消しておきたいときの解決策です。ドキュメントにも書かれている通り、 next.config.ts にて appIsrStatus: false とするだけで解決できます。

next.config.ts
import type { NextConfig } from 'next'
 
const nextConfig: NextConfig = {
  devIndicators: {
    appIsrStatus: false,
  },
}
 
export default nextConfig

この記事を書いた意図

左下のマークの名称が分からなくて、メモとして日本語で残しておきたかっただけ。未来の自分がGoogle検索「next.js 左下 雷 消す」とかで簡単に見つけられるようにしたく。

Discussion