使用 Appbar 组件在“react”中找不到 Material ui 导出“useInsertionEffect”（导入为“useInsertionEffect$1”）

Question

1： https: //i.stack.imgur.com/Y2Zdo.png**强文本**

在这里，我尝试使用 Material ui 的 Appbar 组件，但出现此错误

Answer 1

这是由于 在 import 语句的说明符列表（而不是）中直接引用而useInsertionEffect导致的错误。React.useInsertionEffectReact['useInsertion' + 'Effect']

它已修复@emotion/react@11.8.1- 升级到该版本，错误应该消失。

Answer 2

npm install @mui/material@5.4.2 @emotion/react@11.7.1 @emotion/styled@11.6.0 解决了一切......

Answer 3

我遇到了类似的错误，但 Appbar 没有。我试图使用 mui v5 组件创建自己的npm 组件库。

\n

\n

./node_modules/comp-lib-mui5-sample/dist/esm/index.js\n1293:9-29 中出现错误

\n

在“react”中找不到导出“useInsertionEffect”（导入为“e”）\n（可能的导出：Children、Component、Fragment、Profiler、\nPureComponent、StrictMode、Suspense、\n__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED、cloneElement、 createContext、createElement、createFactory、createRef、forwardRef、\nisValidElement、lazy、memo、useCallback、useContext、useDebugValue、\nuseEffect、useImperativeHandle、useLayoutEffect、useMemo、useReducer、\nuseRef、useState、版本）

\n

\n

降级或升级物质和情感、风格是行不通的。

\n

在我的 rollup.config.js 中，我有：

\n

{\n    input: "src/index.ts",\n    output: [\n        {\n            file: pkg.main,\n            format: "cjs",\n            sourcemap: true,\n        },\n        {\n           file: pkg.module,\n           format: "esm",\n           sourcemap: true,\n         },\n    ],\n    plugins: [ //plugins here ],\n},\n{\n    input: "dist/esm/types/index.d.ts",\n    output: [{file: "dist/index.d.ts", format: "esm"}],\n    plugins: [dts()],\n    external: [/\\.css$/],\n},\n

\n

esm -esm 输出用于<script type=module>在现代浏览器中构建标签。
\ncjs \xe2\x80\x93 CommonJS，适用于 Node 和其他捆绑器汇总输出格式

\n

使固定

\n

仅使用 cjs 的新 rollup.config.ts：

\n

{\n   ...\n    output: [\n        {\n            file: pkg.main,\n            format: "cjs",\n            sourcemap: true,\n        },\n        // REMOVED esm from here\n    ],\n    plugins: [ //plugins here ],\n},\n{\n    input: "dist/types/index.d.ts", // CHANGED <--dist/esm/types/library.d.ts\n    output: [{file: "dist/index.d.ts", format: "esm"}],\n    plugins: [dts()],\n    external: [/\\.css$/],\n},\n

\n

（适用于“@emotion/react”：“^11.8.2”，\n“@emotion/styled”：“^11.8.1”，\n“@mui/material”：“^5.5.2”）

\n

示例存储库：
\n组件库Git 存储库
\n库Git 存储
库的使用者\n（有关详细信息，请检查 README.md。）

\n

Answer 4

@emotion/react最新版本的,可能有错误11.8.0。它是 3 小时前发布的，这可以解释为什么它突然停止工作。

作为解决方法，请安装旧版@emotion/react@11.7.1本来解决问题。