Next.js NextJS服务器端渲染，即使没有getXProps？

此代码位于NextJS的页面文件中。虽然我没有使用

getStaticProps

或

getServerSideProps

它仍然执行服务器端渲染

这是故意的吗？这些文档意味着需要这些get函数：

从“React”导入React；
从“下一个/Head”导入Head；
从“下一个/链接”导入链接；
从“@apollo/react hooks”导入{apollo provider}”；
从“apollo boost”导入apollo客户端；
从“阿波罗助推”导入{gql}；
从“@apollo/react hooks”导入{useQuery}”；
const客户端=新客户端({
uri:“https://48p1r2roz4.sse.codesandbox.io",
});
常数汇率=gql`
{
汇率（货币：“美元”）{
通货
率
}
}
`;
常量Home:React.FC=（）=>{
const{loading，error，data}=useQuery（汇率）；
如果（装载）{
返回(
装载

);
}
如果（错误）{
返回(
错误

);
}
返回(

{data.rates.map（（项目）=>(

{item.currency}-{item.rate}

))}

);
};
导出默认值（）=>(
);

生产模式

提供的页面没有

getInitialProps

或

getServerSideProps

。它是静态优化的（在构建时预渲染）

因此，当您在浏览器中请求此页面时，您将在响应中看到预呈现的HTML内容。禁用JavaScript不会影响它

如果使用客户端

next/link

或路由器导航到页面，页面将在客户端呈现，而无需向服务器发出请求

开发模式

在开发模式下，此页面将同时呈现为服务器端呈现和客户端呈现

如果您通过在浏览器中键入地址来请求该页面，它将在服务器端预先呈现

---

如果您使用客户端

next/link

或路由器导航到该页面，则该页面将在客户端呈现，而无需向服务器发出请求（您将只看到网页包热模块更换请求）。

生产模式

提供的页面没有

getInitialProps

或

getServerSideProps

。它是静态优化的（在构建时预渲染）

因此，当您在浏览器中请求此页面时，您将在响应中看到预呈现的HTML内容。禁用JavaScript不会影响它

如果使用客户端

next/link

或路由器导航到页面，页面将在客户端呈现，而无需向服务器发出请求

开发模式

在开发模式下，此页面将同时呈现为服务器端呈现和客户端呈现

如果您通过在浏览器中键入地址来请求该页面，它将在服务器端预先呈现

---

如果您使用客户端

next/link

或路由器导航到该页面，则该页面将在客户端呈现，而无需向服务器发出请求（您将只看到网页包热模块更换请求）.

运行

next dev

或

next build&&next start

时，您是否看到了这一点？您如何知道它正在执行服务器端渲染？它看起来不像在执行任何服务器端渲染。在apollo查询完成之前，您应该看到加载段落。有时它非常快，会缓存它。@SamuelG下一步dev@SirCodesAlot当我禁用JavaScript时，我可以看到内容仍然呈现为HTML。@Evans使用

next build&&next start

运行它，在开发模式下运行时有一些注意事项，每次请求都会调用

getStaticProps

之类的调用。我知道您没有使用它，但值得一试。您在运行

next dev

或

next build&&next start

时是否看到了这一点？您如何知道它正在执行服务器端渲染？它看起来不像在做任何服务器端渲染。在apollo查询完成之前，您应该看到加载段落。有时它非常快，会缓存它。@SamuelG下一步dev@SirCodesAlot当我禁用JavaScript时，我可以看到内容仍然呈现为HTML。@Evans使用

next build&&next start

运行它，在开发模式下运行时有一些注意事项，每次请求都会调用

getStaticProps

之类的调用。我知道你没有用它，但值得一试。

import React from "react";
import Head from "next/head";
import Link from "next/link";
import { ApolloProvider } from "@apollo/react-hooks";
import ApolloClient from "apollo-boost";
import { gql } from "apollo-boost";
import { useQuery } from "@apollo/react-hooks";

const client = new ApolloClient({
  uri: "https://48p1r2roz4.sse.codesandbox.io",
});

const EXCHANGE_RATES = gql`
  {
    rates(currency: "USD") {
      currency
      rate
    }
  }
`;

const Home: React.FC = () => {
  const { loading, error, data } = useQuery(EXCHANGE_RATES);

  if (loading) {
    return (
      <div>
        <p>Loading</p>
      </div>
    );
  }

  if (error) {
    return (
      <div>
        <p>Error</p>
      </div>
    );
  }

  return (
    <div>
      <ul>
        {data.rates.map((item) => (
          <li key={item.currency}>
            {item.currency} - {item.rate}
          </li>
        ))}
      </ul>
    </div>
  );
};

export default () => (
  <ApolloProvider client={client}>
    <Home />
  </ApolloProvider>
);