3

我只是按照指南升级到 Emotion v11 - 添加了 eslint 规则，使用过--fix，一切看起来都很好。

根据重命名升级了包，但是当我去构建我的开发版本时，我得到了这个堆栈跟踪并且我的应用程序没有呈现：

Compiled with warnings.

./node_modules/@emotion/react/node_modules/@emotion/cache/dist/emotion-cache.browser.esm.js
Attempted import error: 'COMMENT' is not exported from 'stylis'.

./node_modules/@emotion/react/node_modules/@emotion/cache/dist/emotion-cache.browser.esm.js
Attempted import error: 'alloc' is not exported from 'stylis'.

./node_modules/@emotion/react/node_modules/@emotion/cache/dist/emotion-cache.browser.esm.js
Attempted import error: 'compile' is not exported from 'stylis'.

./node_modules/@emotion/react/node_modules/@emotion/cache/dist/emotion-cache.browser.esm.js
Attempted import error: 'dealloc' is not exported from 'stylis'.

./node_modules/@emotion/react/node_modules/@emotion/cache/dist/emotion-cache.browser.esm.js
Attempted import error: 'delimit' is not exported from 'stylis'.

./node_modules/@emotion/react/node_modules/@emotion/cache/dist/emotion-cache.browser.esm.js
Attempted import error: 'from' is not exported from 'stylis'.

./node_modules/@emotion/react/node_modules/@emotion/cache/dist/emotion-cache.browser.esm.js
Attempted import error: 'identifier' is not exported from 'stylis'.

./node_modules/@emotion/react/node_modules/@emotion/cache/dist/emotion-cache.browser.esm.js
Attempted import error: 'middleware' is not exported from 'stylis'.

./node_modules/@emotion/react/node_modules/@emotion/cache/dist/emotion-cache.browser.esm.js
Attempted import error: 'next' is not exported from 'stylis'.

./node_modules/@emotion/react/node_modules/@emotion/cache/dist/emotion-cache.browser.esm.js
Attempted import error: 'peek' is not exported from 'stylis'.

./node_modules/@emotion/react/node_modules/@emotion/cache/dist/emotion-cache.browser.esm.js
Attempted import error: 'peek' is not exported from 'stylis'.

./node_modules/@emotion/react/node_modules/@emotion/cache/dist/emotion-cache.browser.esm.js
Attempted import error: 'position' is not exported from 'stylis'.

./node_modules/@emotion/react/node_modules/@emotion/cache/dist/emotion-cache.browser.esm.js
Attempted import error: 'prefixer' is not exported from 'stylis'.

./node_modules/@emotion/react/node_modules/@emotion/cache/dist/emotion-cache.browser.esm.js
Attempted import error: 'serialize' is not exported from 'stylis'.

./node_modules/@emotion/react/node_modules/@emotion/cache/dist/emotion-cache.browser.esm.js
Attempted import error: 'stringify' is not exported from 'stylis'.

./node_modules/@emotion/react/node_modules/@emotion/cache/dist/emotion-cache.browser.esm.js
Attempted import error: 'token' is not exported from 'stylis'.

这是我得到的唯一堆栈跟踪。

我使用的情感包：

    "@emotion/babel-preset-css-prop": "^11.2.0",
    "@emotion/react": "^11.1.5",
    "@emotion/styled": "^11.1.5",
    "@emotion/eslint-plugin": "^11.2.0",
    "@emotion/jest": "^11.2.1",

我不知道该尝试什么，在其他任何地方都找不到此错误。

4

1 回答 1

1

我遇到了同样的问题，并通过将 .mjs 添加到我的 webpack 文件加载器排除每个https://github.com/remirror/remirror/issues/647#issuecomment-687654519来修复它，如下所示：

  {
    // Exclude mjs per https://github.com/remirror/remirror/issues/647#issuecomment-687654519
    // otherwise we run into https://stackoverflow.com/questions/66716326/stylis-compiler-errors-after-upgrading-to-emotion-v11
    exclude: [/\.m?jsx?$/, /\.html$/, /\.json$/, /\.tsx?$/],
    loader: require.resolve("file-loader"),
    options: {
      name: "static/media/[name].[hash:8].[ext]",
    },
  },

文件加载器配置的其余部分（选项、其他排除项）可能会有所不同。

于 2021-04-06T08:10:16.950 回答