patternfly / patternfly/patternfly-react

Bug - react-icons 6.6.1- invalid ESM module

未关闭
#12,657 0 条评论 0 个 reaction 已指派 0 人 在 GitHub 查看

还没有人认领这个 Issue。

主要语言
TypeScript
星标
862
派生
392
平均合并
4 天 8 小时
30 天内合并 PR
9

描述

Describe the problem
Webpack build fails with error:

ERROR in ./node_modules/@patternfly/react-icons/dist/esm/createIcon.js 2:0-63
Module not found: Error: Can't resolve 'react/jsx-runtime' in '/home/xxx/repos/pf_modules/node_modules/@patternfly/react-icons/dist/esm'
Did you mean 'jsx-runtime.js'?
BREAKING CHANGE: The request 'react/jsx-runtime' failed to resolve only because it was resolved as fully specified
(probably because the origin is strict EcmaScript Module, e. g. a module with javascript mimetype, a '*.mjs' file, or a '*.js' file where the package.json contains '"type": "module"').
The extension in the request is mandatory for it to be fully specified.

How do you reproduce the problem?
minimal code to recreate the issue: https://github.com/rszwajko/pf-icons-esm-bug
Initially encountered while updating libraries on older branches of https://github.com/openshift/networking-console-plugin

Expected behavior
Webpack build should work without relaxing import rules.

Is this issue blocking you?
No. Workaround exists i.e. as used here https://github.com/openshift/networking-console-plugin/commit/e4ed48dabced60f949d4af09559996b131c93fba

      {
        test: /\.m?js/,
        include: /node_modules\/@patternfly\/.*/,
        resolve: {
          fullySpecified: false,
        },
      },

What is your environment?
React 17
react-icons 6.6.1

What is your product and what release date are you targeting?
https://github.com/openshift/networking-console-plugin


Jira Issue: PF-4648

贡献指南

打开贡献指南

从这里开始

  1. 先读完整个 Issue,再读项目的贡献指南。
  2. 在 Issue 下留言说明你要接手 —— 这能避免两个人做同样的事。
  3. Fork 仓库,在一个分支上完成修改。
  4. 提交 Pull Request,并在描述里引用这个 Issue 编号。

调研方向

https://github.com/rszwajko/pf-icons-esm-bug 中的最小复现开始,并检查 Webpack 下 @patternfly/react-icons/dist/esm/createIcon.js 生成的 react/jsx-runtime import。使用 React 17 和 react-icons 6.6.1 重现该失败;当 Webpack 构建无需放宽 import 规则即可正常工作时,即视为完成。

由索引模型根据 Issue 内容生成。

评估

技术栈
react, typescript, webpack
领域
build-system, frontend
Issue 类型
缺陷
难度
3/5
预计耗时
1-2 天
活跃度
活跃
描述清晰度
基本清楚
新手友好度
64/100

把新 issue 发到你的邮箱

精选适合新手参与的 GitHub issue 摘要。