Javascript NextJS构建破坏@material ui/核心和；react引导导入

所以我读了很多书，我发现这是一件很平常的事情，但遗憾的是，我能找到的所有解决方案都不适合我

在npm运行开发模式下，项目正常运行时，所有导入工作正常

import { Typography } from "@material-ui/core";
import Card from 'react-bootstrap/Card'

如何在页面中导入的示例， 但是当我第二次运行build并进入页面时，这些导入似乎失败了，我只是没有从中得到CSS

这是我的下一个.config.js文件

const withCSS = require('@zeit/next-css')

module.exports = withCSS({
  cssLoaderOptions: {
    url: false
  }
})

我想我需要给它materialUI&react引导？我在这方面的尝试失败了

如果您能在这方面提供任何帮助，我们将不胜感激，但我不知道为什么它无法构建

这是我的package.json

{
  "name": "name",
  "version": "0.1.0",
  "private": true,
  "scripts": {
    "dev": "next dev",
    "build": "next build",
    "start": "next start",
    "prod": "next export"
  },
  "dependencies": {
    "@material-ui/core": "^4.8.2",
    "@material-ui/icons": "^4.5.1",
    "@zeit/next-css": "^1.0.1",
    "bootstrap": "^4.4.1",
    "next": "9.1.6",
    "next-compose-plugins": "^2.2.0",
    "nextjs-sitemap-generator": "^0.4.2",
    "react": "16.12.0",
    "react-bootstrap": "^1.0.0-beta.16",
    "react-dom": "16.12.0",
    "styled-components": "^4.4.1"
  }
}

---

这是版本

4.3

+中的

材料ui

面临的常见问题。可以通过使用

\u document.js

预加载CSS来克服此问题

本文对此进行了广泛的描述。为了简洁起见，我在这里加上它。在

\u document.js

中添加以下代码，CSS看起来应该相当不错

从“React”导入React
从“next/Document”导入文档，{Html，Head，Main，NextScript}
从“@material ui/styles”导入{ServerStyleSheets}
从“@material ui/core/styles”导入{createMuiTheme，responsiveFontSizes}
const theme=responsiveFontSizes（createMuiTheme（））
类MyDocument扩展了文档{
render（）{
返回(
{`
html，
身体{
身高：100%；
宽度：100%；
}
*,
*：之后，
*：之前{
框大小：边框框；
}
身体{
字体系列：“Roboto”，“Helvetica”，“Arial”，无衬线；
字号：1rem；
保证金：0；
}
`}
)
}
}
MyDocument.getInitialProps=异步ctx=>{
//呈现应用程序和页面，并获取包含收集的副作用的页面上下文。
const sheets=new ServerStyleSheets（）
const originalRenderPage=ctx.renderPage
ctx.renderPage=（）=>
原始渲染图({
enhanceApp:App=>props=>sheets.collect（）
})
const initialProps=wait Document.getInitialProps（ctx）
返回{
…初始道具，
//样式片段在应用程序和页面呈现完成后呈现。
风格：[
{initialProps.style}
{sheets.getStyleElement（）}
]
}
}
导出默认MyDocument

能否将应用程序的一小部分（可以重现所述问题）推送到github并发送链接，以便我重现？有我遗漏的文件吗？对于next.js来说非常新，所以不确定重要的文件是什么。使用您提供的代码，我做了一些导入修复，并运行了

npm run build

和

npm start

。在

http://localhost:3000

。这是一个拉请求，我向你展示了我改变了什么，我制作了一个视频，向你展示了我在本地的样子。我希望这会有帮助。