无数据和有数据的静态生成

    如果组件不需要在其他地方获取数据,直接进行静态生成

    如果组件需要在其他地方获取数据,在构建时Next.js会预先获取组件需要的数据,然后再对组件进行静态生成

    静态生成getStaticProps

    getStaticProps方法的作用是获取组件静态生成需要的数据,并通过props的方式将数据传递给组件,

    该方法是一个异步函数,需要在组件内部进行导出

    在开发模式下,getStaticProps改为在每个请求上运行

    getStaticProps在构建的时候运行在node环境下

    实现静态生成 - 图1

    fs

    实现静态生成 - 图2

    实现静态生成 - 图3

    实现静态生成 - 图4

    实现静态生成 - 图5