🦭

Next.jsでbuildしたやつを使うときに⌘Rできるようにする

2023/02/03に公開約600字

本番環境として、ターミナルでbuildした静的HTMLデータを用いるときに、リロードすると画面が消えてしまうバグの回避策です。

next.config.js
/** @type {import('next').NextConfig} */
const nextConfig = {
  reactStrictMode: true,
  swcMinify: true,
  assetPrefix: '',
  basePath: '',
  exportPathMap: async function (
    defaultPathMap,
    { dev, dir, outDir, distDir, buildId }
  ) {
    return {
      '/': { page: '/' },
      '/404': { page: '/404' },
      // 必要なページ分、パスを記載する
    };
  },
  trailingSlash: true,
};

module.exports = nextConfig;
package.json
{
  "scripts": {
    "build": "next build && next export",
  },
}

outフォルダにあるものをサーバーにアップロードします。

Discussion

ログインするとコメントできます