我刚刚启动了我的第一个NextJS应用程序,并遵循this guide添加MUI。我能看到的唯一区别是我使用的是NextJS 13的实验app
目录。
当遵循指南时,我得到了一个Uncaught TypeError: React.createContext is not a function
的服务器错误,这基本上是相当清楚的,因为上下文API只对客户端组件可用,因此可以通过将'use client';
目录放在错误组件的顶部来轻松“解决”。
不幸的是,似乎每一个使用MUI任何部分的组件都需要这样做。例如,如果我想用ThemeProvider
等 Package 我的整个应用程序,我还必须在我的根目录layout.tsx
中添加'use client;'
。
我的问题如下:
1.我真的必须在任何我想使用MUI的地方使用'use client;'
吗?或者有其他方法吗?
1.如果1为真:这是否会使MUI在与NextJS结合时完全无用,因为它阻止了所有SSR,SSG,ISR优点等的使用,或者我在这里有某种误解(我对NextJS非常陌生...)?
1.如果1和2为真:有没有其他值得推荐的UI框架或库,它们带来了一套很好的“即用型”(开箱即用)控件、组件等,可以更好地与NextJS一起工作,而没有这些限制?
仅供参考,我安装了以下版本的ATM:
next@13.0.6
@mui/material@5.10.17
更新
我应该在发布问题之前更仔细地阅读NextJS beta文档:
它看起来像是没有办法绕过这个自动取款机,就像在这里的文件和再次在这里的机票。
因此,这回答了问题1,因为目前似乎没有一种方法可以绕过'use client';
。
但是,我仍然非常感谢对问题2和3的回答和意见。
1条答案
按热度按时间t3psigkw1#
不要使用实验应用程序版本,现在它会有bug,所以我甚至不能在我的应用程序中使用画布