Next.js 不在服务器端渲染中渲染 CSS

Question

我已经使用创建了 next.js 应用程序，npx create-next-app并且没有对其进行任何更改。

我注意到imported .css样式在客户端渲染中正确渲染，但在服务器端渲染中无法正确渲染。

根据Next.js 文档，导入的 .css 应该可以正常工作。

_app.js

import '../styles/globals.css'

function MyApp({ Component, pageProps }) {
  return <Component {...pageProps} />
}

export default MyApp

包.json

{
  "name": "next-test",
  "version": "0.1.0",
  "private": true,
  "scripts": {
    "dev": "next dev",
    "build": "next build",
    "start": "next start"
  },
  "dependencies": {
    "next": "10.0.9",
    "react": "17.0.1",
    "react-dom": "17.0.1"
  }
}

企业社会责任：

固态继电器

Answer 1

如果您未处于生产模式，这是正常行为。

该医生指出：if you disable JavaScript the CSS will still be loaded in the production build (next start). During development, we require JavaScript to be enabled to provide the best developer experience with Fast Refresh.

参考