Next.js: 動的ルートを使用した getStaticProps と getStaticPaths を使用して静的ファイルを生成する 質問する

私はドキュメント少し曖昧です。フランチャイズのリストがある場合、これらは頻繁に変更されないため、実行時に CMS/API にアクセスしないように、ビルド時に関連するフランチャイズの詳細ページをレンダリングしたいと思います。

ただし、関連ページがビルド時に を使用して生成されたとしてもgetStaticPaths、実行時に の呼び出しgetStaticPropsを実行する必要があるようです。これでは、静的ページを生成する目的が達成されません。

import {withLayout} from '../../components/layout';
import {getFranchises} from '../api/franchises';

const Franchise = (props) => {
    console.info(props);

    return (
        <>
            <h1>{props.name}</h1>
        </>
    );
};

export async function getStaticProps({params}) {
    let data = await getFranchises();

    let franchise = data.find(x => x.id === params.id);

    return {
        props: franchise
    }
}

export async function getStaticPaths() {
    let data = await getFranchises();

    // Get the paths we want to pre-render based on posts
    const paths = data.map(post => ({
        params: {id: post.id},
    }));

    // We'll pre-render only these paths at build time.
    return {paths, fallback: false}
}

export default withLayout(Franchise);