Antd Tabs not importing from rc-tabs correctly?

Issues
1

Hey, I’m having a problem with antd tabs. I have imported the antd package through plasmic studio, everything works fine there, but when I run the react app using npm start , I get an error export 'TabPane' (imported as 'TabPane') was not found in 'rc-tabs' (possible exports: default) . Why does it import TabPane from rc-tabs anyways instead of using antd Tabs.TabPane?

2

Dependencies in my package json:

 "dependencies": {
    "@plasmicapp/cli": "^0.1.186",
    "@plasmicapp/host": "^1.0.79",
    "@plasmicapp/react-web": "^0.2.156",
    "@plasmicpkgs/antd": "^2.0.20",
    "@testing-library/jest-dom": "^5.16.5",
    "@testing-library/react": "^13.4.0",
    "@testing-library/user-event": "^13.5.0",
    "@types/jest": "^27.5.2",
    "@types/node": "^16.11.59",
    "@types/react": "^18.0.20",
    "@types/react-dom": "^18.0.6",
    "antd": "^5.2.1",
    "react": "^18.2.0",
    "react-dom": "^18.2.0",
    "react-scripts": "5.0.1",
    "typescript": "^4.8.3",
    "web-vitals": "^2.1.4"
  },
3

hmm @plasmicpkgs/antd@2.0.20 should no longer be importing from rc-tabs; could you verify that that’s the version you have in node_modules?

4

Yea, the version in package.json of @plasmicpkgs/antd in node_modules is 2.0.20. The import of TabPane happens in a plasmic page component

5

Same problem with a new blank project, simply by adding antd package:

image.png
image.png499×540 23.2 KB

6

And then changing the default page to something that has antd tabs and trying to open the react app in the browser

7

PlasmicHomepage.tsx contains:

import { Tabs } from "@plasmicpkgs/antd/skinny/registerTabs"; // plasmic-import: Hb-DVgvuk3/codeComponent
import { TabPane } from "rc-tabs"; // plasmic-import: p3HNI5RglT/codeComponent
8

This should be fixed now

9

Awesome! Thanks a lot! We’re able to continue our project now :slightly_smiling_face: