Open luzat opened 8 months ago
This seems to be a regression from 5.1.4 to 5.2.0
@hannesj You are right, downgrading to 5.1.4 from 5.2.6 makes it work.
The issue seems to be that the CJS code (lib/index.js
) generated by swc cannot be correctly interpreted to be imported into ESM code. There may be two ways to fix that:
Regarding option 2.:
Node is currently always going to import the CJS lib/index.js
, because it does not know the package.json
's module field. This could be changed by adding something similar to this to package.json
:
{
"exports": {
"import": "./es/index.js",
"require": "./lib/index.cjs"
},
"type": "module"
}
Maybe this also works without "type": "module"
and switching extensions to .mjs
/.c?js
. Additionally, for imports to work, the generated code would have to use file extensions everywhere and those should probably be .mjs
/.js
and .cjs
(if the type
is being specified as module
). I feel that this would be the way forward (until CJS can be dropped), but might require additional changes.
To make it work with 5.2.6 and Remix 2+ I also found a possible workaround to be adding dependencies to remix.config.js
:
serverDependenciesToBundle: [
'@ant-design/icons',
^@ant-design\/icons-svg.*/,
/^rc-util.*/,
],
This basically just compiles the packages into the resulting build/index.js
and avoids having Node trying to resolve the packages.
To make it work with 5.2.6 and Remix 2+ I also found a possible workaround to be adding dependencies to remix.config.js:
And this is now a problem with Remix 2.3.0 because the vite
Remix config doesn't accept the value serverDependenciesToBundle
so we're stuck using '@ant-design/icons',
at 5.1.4. 😞
To make it work with 5.2.6 and Remix 2+ I also found a possible workaround to be adding dependencies to remix.config.js:
And this is now a problem with Remix 2.3.0 because the
vite
Remix config doesn't accept the valueserverDependenciesToBundle
so we're stuck using'@ant-design/icons',
at 5.1.4. 😞
I can't switch to vite yet because of other bugs, but would ssr.noExternal
(Remix docs) instead of serverDependenciesToBundle
solve that problem?
@afc163 @zombieJ
此问题从 5.2.x 开始出现,代码的导出方式发生了变化,es
文件夹下的代码也全部失去了拓展名,使其无法像过去 5.1 通过 esm
模式引入,是一次严重的破坏性更新。
这使得原先不需要编译,通过 nodejs 18+
直接运行的代码(一般用在单元测试中)在新版无法执行。
只能暂时锁定在 5.1版本规避,受此影响项目的 antd
也不得不停留在 5.8.0。
由于涉及到打包逻辑,普通人的PR估计你们也不会接受,请求官方跟进这个问题。
相关问题:https://github.com/ant-design/ant-design-icons/issues/307
This problem started in 5.2.x, the code exports changed, and the code under the es
folder lost all extension names, making it impossible to introduce it through the ESM
mode like in 5.1. It was a serious destructive update.
This makes code that was previously run directly with Nodejs 18+
without compilation (typically used in unit tests), became imexecutable in the new version.
It can only be temporarily locked in version 5.1 to avoid it, and the antd
of the affected project has to stay at 5.8.0.
As it involves bundle logic, I don't think you'll accept PR for ordinary people, please official follow-up on this issue.
Related issues:https://github.com/ant-design/ant-design-icons/issues/307
As it involves bundle logic, I don't think you'll accept PR for ordinary people, please official follow-up on this issue.
PR is welcome~
@afc163
After I tried hard to bypass the lerna
nightmare (huge repo), I found out there is no way to bundle ESM files unless you don't use father
as the build tool ...
After trying I'm sure I can't fix this by myself.
I tried to repackage icons-react
but failed because the dependencies are so complex that it's almost impossible to package it as an esmodule. Some of the dependencies on rc-util even depend directly on the commonjs code under rc-util/lib instead of being automatically recognized based on package exports.
Hopefully the official fix will come soon. 🙏
npm install @ant-design/web3-wagmi wagmi viem @tanstack/react-query --save Download Dependency Timeout [#####.............] / idealTree:ws: sill placeDep ROOT utf-8-validate@6.0.3 OK for: @metamask/sdk-communication-layer@0.18.5 want: ^6.0.3 It gets stuck at this point.
We get this issue when we upgrade our Refine package (using Next.js) and it tries to use the latest and icons version. On older versions it locked the icons version to 5.0.1, which is under the breaking version of >5.1.4. 😞
npm install @ant-design/web3-wagmi wagmi viem @tanstack/react-query --save Download Dependency Timeout [#####.............] / idealTree:ws: sill placeDep ROOT utf-8-validate@6.0.3 OK for: @metamask/sdk-communication-layer@0.18.5 want: ^6.0.3 It gets stuck at this point.
Hi. Are you fixed it ?
npm install @ant-design/web3-wagmi wagmi viem @tanstack/react-query --save Download Dependency Timeout [#####.............] / idealTree:ws: sill placeDep ROOT utf-8-validate@6.0.3 OK for: @metamask/sdk-communication-layer@0.18.5 want: ^6.0.3 It gets stuck at this point.
Experiencing the same, any fix?
As it involves bundle logic, I don't think you'll accept PR for ordinary people, please official follow-up on this issue.
PR is welcome~ @afc163 Any updates on this? The latest versions of @ant-design/icons still has this issue for a fresh NextJs project.
Encountered same problem with remix + vite. Wondering how to workaround it.
Rolling back to "@ant-design/icons": "5.1.4"
worked for me, waiting for an official fix.
I am trying to import icons from within a Node package with
type: "module"
specified inpackage.json
:Unfortunately, this leads to the following error:
Even
import { BookOutlined } from '@ant-design/icons/es/index.js'
does not work, because the package is interpreted as containing CommonJS modules.The proposed solution is clumsy and also seems to break tree-shaking. My current workaround for each icon that I use is:
This is obviously not a good solution.
@ant-design/icons
should probably be built usingtype: "module"
, specify anexports
field inpackage.json
and use imports with file extensions in the build.