如何解决生产中的Nextjs / nx Nrwl / Material UI样式最初存在渲染样式问题有人遇到过这个问题吗?
我正在尝试使用下一个js插件和材料ui运行nx nrwl。
在我们的开发版本中一切正常,但是当我们为生产版本提供服务时,material-ui / styles会中断。我们在makeStyles中使用的所有类均未在第一个绘画中正确应用。
我已经使用了材料ui示例(https://github.com/mui-org/material-ui/tree/master/examples/nextjs),并且makeStyles类按预期工作。但是,当我使用nx nrwl next插件(https://www.npmjs.com/package/@nrwl/next)生成下一个项目并使用nx build-> nx serve --prod部署它时,它会破坏样式,直到导航到新页面。
看起来环境根据服务类型处理的样式不同。
我无法找到有关解决此问题的任何信息。是否有构建设置或我们应该设置的内容?谢谢!
仅在生产前油漆警告:
警告:道具className
不匹配。服务器:“ jss1”客户端:“ HookGlobalStyles-grayTitle-1
Dev-样式选择器和类名称正确匹配
Dev构建屏幕截图
产品-样式选择器和类名称在首次渲染时不匹配
产品构建屏幕截图
解决方法
因此,问题在于设置了正确的生产变量:
我们使用package.json中的cross-env包使其工作:
“ prodBuild”:“跨环境NODE_ENV =生产nx运行api-server:build:production”,“ prodServe”:“跨环境NODE_ENV =生产nx运行api-server:serve:生产”
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。