Repository: ant-design
Issue: importing the react component library with less module in to Nextjs app throws error when building
Labels: Inactive

- [x] I have searched the [issues](https://github.com/ant-design/ant-design/issues) of this repository and believe that this is not a duplicate.

### Reproduction link
[https://github.com/Srinirajini/simple-next-app.git](https://github.com/Srinirajini/simple-next-app.git)

### Steps to reproduce
1) clone the repository https://github.com/Srinirajini/simple-next-app.git
2) install dependencies using the command "yarn" from the root of the cloned repo.
3) run the repo using the command "npm run dev"
4) you could see simple Antd's Button and Date picker components...
5) try to build the repo using the command "npm run build"
6) This end up with the error in the antd's date picker component "@import '../../style/themes/index';"

### What is expected?
Successful building of the application.

### What is actually happening?
npm run build

> build
> next build

info  - Checking validity of types  
warn  - Disabled SWC as replacement for Babel because of custom Babel configuration "babel.config.js" https://nextjs.org/docs/messages/swc-disabled
info  - Using external babel configuration from /Users/nsearch-srinivasan/workspace/nextjsWorkspace/simple-next-app/babel.config.js
info  - Creating an optimized production build  
info  - Compiled successfully

> Build error occurred
/Users/nsearch-srinivasan/workspace/nextjsWorkspace/simple-next-app/node_modules/antd/lib/date-picker/style/index.less:1
@import '../../style/themes/index';
^

SyntaxError: Invalid or unexpected token
    at Object.compileFunction (node:vm:352:18)
    at wrapSafe (node:internal/modules/cjs/loader:1031:15)
    at Module._compile (node:internal/modules/cjs/loader:1065:27)
    at Object.Module._extensions..js (node:internal/modules/cjs/loader:1153:10)
    at Module.load (node:internal/modules/cjs/loader:981:32)
    at Function.Module._load (node:internal/modules/cjs/loader:822:12)
    at Module.require (node:internal/modules/cjs/loader:1005:19)
    at require (node:internal/modules/cjs/helpers:102:18)
    at Object.<anonymous> (/Users/nsearch-srinivasan/workspace/nextjsWorkspace/simple-next-app/node_modules/antd/lib/date-picker/style/index.js:3:1)
    at Module._compile (node:internal/modules/cjs/loader:1101:14) {
  type: 'SyntaxError'
}
info  - Collecting page data .%  

| Environment | Info |
|---|---|
| antd | 4.17.3 |
| React | 17.0.2 |
| System | MacOS Monterey |
| Browser | Chrome 96.0.4664.55  |

---
The component library can be cloned from this https://github.com/Srinirajini/react-component-library.git.

Actually, the error happens in antd's Datepicker component with DayJS support, particularly at the import statement.
I am following the recommendation given in the AntD's Documentation as mentioned in this link https://ant.design/docs/react/replace-moment.
Please look at my component library code Datepicker.tsx implemented in the repo https://github.com/Srinirajini/react-component-library.git. and the code is exactly the same as the code recommended in the documentation.
Note : The sample code given in the link is working with Next js app with babel and webpack, but when I tried to bundle it with Rollup and later try to consume the library in the Nextjs app it is giving the build error.


<!-- generated by ant-design-issue-helper. DO NOT REMOVE -->