Module not found: Can't resolve 'antd/lib/qr-code'

[alyosha-30emeciel]

Reproduction link

/~https://github.com/alyosha-30emeciel/antd-qrcode-bug

Steps to reproduce

npm run dev
-> browse to http://localhost:3000
-> ./src/app/page.tsx:3:0
Module not found: Can't resolve 'antd/lib/qr-code'

What is expected?

The firt example from ./src/app/page.tsx:3:0
Module not found: Can't resolve 'antd/lib/qr-code' with a QRCode runs.

What is actually happening?

./src/app/page.tsx:3:0
Module not found: Can't resolve 'antd/lib/qr-code'
1 | 'use client'
2 | import React from 'react';

3 | import {Input, QRCode, Space} from "antd";
4 |
5 | export default function Home() {
6 | const [text, setText] = React.useState('https://ant.design/');

https://nextjs.org/docs/messages/module-not-found

Environment	Info
antd	5.7.0
React	18.2.0
System	node 20.4.2
Browser	chrome 114.0.5735.199

---

I created the example with:
1/ npx create-next-app@latest
2/ then followed antd's Getting Started

[alyosha-30emeciel]

CodeSandbox: https://codesandbox.io/p/github/alyosha-30emeciel/antd-qrcode-bug/main

[zombieJ]

NextJS convert QRCode to qr-code path but its qrcode in antd. Seems need report to nextjs for this case.

[zombieJ]

Create the issue to the NextJS: vercel/next.js#52703

[afc163]

@zombieJ Is it same bug in babel-plugin-import?

[MadCcc]

@zombieJ Is it same bug in babel-plugin-import?

QRCode is provided after v5, so there's no conflict with bable-plugin-import.