生产构建后，Material-ui 布局被打乱

Posted 2023-02-22

【中文标题】生产构建后，Material-ui 布局被打乱

【英文标题】：Material-ui layout scrambled after production build

【发布时间】：2018-11-05 17:24:20

【问题描述】：

我已经基于 node.js、material-ui 和 create-react-app 构建了一个网站。

当我使用 yarn start 进行开发构建时，我在 localhost 上得到了这个结果：

然后，在使用 yarn build 进行生产构建后，我得到了这个：

除布局外，所有功能均可用。

任何想法可能是什么原因？

【问题讨论】：

你能发布你的代码吗？

最好的发布方式是什么？

如果你举个例子here我帮你看看。

我现在正在工作。 GitHub上有一个依赖项。我收到此错误：无法获取依赖项，请在几秒钟后重试：无法获取@github.com/ahs-mediatheken/bo-module-taxonomie.git的版本：ENOENT：没有这样的文件或目录，打开'/var/ task/@https://github.com/ahs-mediatheken/bo-module-taxonomie.git/package.json'

codesandbox.io/s/github/ahs-mediatheken/bo-main/tree/master

【参考方案1】：

看起来material-ui 被汇总包含了两次，这会破坏应用程序。如果您仔细查看 med-react-component 和 bo-module-taxonomie 中的内置内容，您会注意到 rollup 在两个构建中都包含 material-ui。 由于您使用的是rollup-plugin-peer-deps-external，因此您应该在med-react-component 和bo-module-taxonomie 中建立material-ui 对等依赖关系：

"peerDependencies": 
    "@material-ui/core": "^1.0.0",
    "@material-ui/icons": "^1.0.0",
    ...

【讨论】：

感谢 Evgeny！这解决了我的问题！我认为 npm 从来没有安装过两次，但那是错误的。你让我反思依赖关系和对等依赖关系之间的区别。太好了！

其实不是 npm 而是 rollup，你导入已经构建的东西。