[BUG] Named export 'SyncOutlined' not found.

[bombillazo]

Describe the bug

When building our app, we get this error:

Named export 'SyncOutlined' not found. The requested module '@ant-design/icons' is a CommonJS module, which may not support all module.exports as named exports.
CommonJS modules can always be imported via the default export, for example using:

import pkg from '@ant-design/icons';

Steps To Reproduce

Install the latest refine packages and run the app.

Expected behavior

No error is given when building

Packages

"@refinedev/antd": "5.38.1"

Additional Context

No response

[aliemir]

Hey @bombillazo, sorry for the issue 🙏 We had this release yesterday and it caused some errors with the type declarations in our packages. A new release is just on its way which addressess the type declaration issues. I'll ping here when the release is done and let's see if it fixes the issue you're having as well 🤔

[bombillazo]

Ok thanks, looking much forward to it.

[aliemir]

Now a patch is released for all packages. For @refinedev/antd the version is 5.38.1. Can you check if this fixes the issue? :pray:

[bombillazo]

on it

[bombillazo]

Hey, I still get the error...

SyntaxError: Named export 'SyncOutlined' not found. The requested module '@ant-design/icons' is a CommonJS module, which may not support all module.exports as named exports.
CommonJS modules can always be imported via the default export, for example using:

import pkg from '@ant-design/icons';
const {value:o,configurable:!0});import et from"react";import{Form: ot}from"antd";import{useForm: rt}from"sunflower-antd";import{flattenObjectKeys: tt,propertyPathToArray: Xo}from"@refinedev/core";import{useForm: st,useWarnAboutChange: nt,pickNotDeprecated: Jo,useTranslate: at,useRefineContext: it}from"@refinedev/core";

[aliemir]

@bombillazo, I've found an issue related to this in @ant-design/icons repo. Please check https://github.com/ant-design/ant-design-icons/issues/605. Can you try downgrading @ant-design/icons to 5.1.4? If it's not installed can you try installing it with the specified version?

Please let us know if this resolves the issue 🙏

[bombillazo]

I tried it but it doesnt fix the issue, currently, I've reverted to using "@refinedev/antd": "5.37.6" and it works

[aliemir]

Can you also check for @ant-design/[email protected]? @refinedev/[email protected] had this version pinned down and the latest version removed that version lock 🤔

[bombillazo]

I fixed the version to ant-design/[email protected] but I still get the error when using @refinedev/[email protected]

[bombillazo]

I see 5.38.1 still not locking antd 5.0.1 in the package.lock

  "node_modules/@refinedev/antd": {
      "version": "5.38.1",
      "resolved": "https://registry.npmjs.org/@refinedev/antd/-/antd-5.38.1.tgz",
      "integrity": "sha512-CFonTqYHV6wTEq3ofoFQ0XODW1DMcpuCP9ApPjPYQZ8ORY0pcudPf22L3RTeeyHodabdsSJ+C3bqeVLyg9+4Zw==",
      "dependencies": {
        "@ant-design/icons": "^5.0.1",
        "@ant-design/pro-layout": "7.17.12",
        "@refinedev/ui-types": "^1.22.7",
        "@tanstack/react-query": "^4.10.1",
        "antd": "5.16.5",
        "dayjs": "^1.10.7",
        "react-markdown": "^6.0.1",
        "remark-gfm": "^1.0.0",
        "sunflower-antd": "1.0.0-beta.3",
        "tslib": "^2.6.2"
      },

[bombillazo]

I manually locked it to 5.0.1 in the package.lock file and reinstalled deps, ran it with 5.38.1 but the error persists.

[bombillazo]

The current combination that works for me is this:

 "@ant-design/icons": "^5.3.7",
 "@refinedev/antd": "5.37.6",

[aliemir]

Thank you for your help investigating the issue @bombillazo. I think we might need to re-apply the version pinning here for the @ant-design/icons. Do you want to open up the PR for this? While the PR might take some to be released, you may also check for options like package.json#overrides (or #resolutions for yarn) to pin down the version of @ant-design/icons in @refinedev/antd but I'm not sure if this is going to work 😅

You may try

{
  "overrides": {
    "@refinedev/antd": {
      "@ant-design/icons": "5.0.1"
    }
  }
}

[bombillazo]

I tried that but it messes up my stylings for some reason. Ill keep using "@refinedev/antd": "5.37.6" for now.

[bombillazo]

I would love to help with the PR but I'm not sure where the change is required in the repo, Im not familiar with the refine repo.

[aliemir]

Check out this PR https://github.com/refinedev/refine/pull/5908, it looks like there are a lot of changes but most of them are from /examples using @ant-design/icons. We need to apply the same version pin to them as well but related changes in packages are at /packages/antd, /packages/inferencer and /packages/live-previews. You can check our Contributing guide to get start 🚀

[aliemir]

Hey @bombillazo, can you confirm that this issue is resolved with the latest releases? 🙏

[aliemir]

Closing this as completed with https://github.com/refinedev/refine/pull/5934

[bombillazo]

Hey, seems like its not giving any more issues, confirmed it today. Thanks!