'Unable to load antd less styles

I have NextJs project with following structure

-pages
    -_app.tsx
-app
    -styles
        -antdstyles.less

inside _app.tsx i am trying to load import '@styles/andstyles.less which simply imports antd styles ass this @import '~antd/dist/antd.less'; However i get error saying

/app/styles/antdstyles.less

@import '~antd/dist/antd.less'; ^ '~antd/dist/antd.less' wasn't found. Tried - /home/computer/job/proj/app/styles/~antd/dist/antd.less,/home/computer/job/proj/css/~antd/dist/antd.less,/home/computer/job/proj/~antd/dist/antd.less,~antd/dist/antd.less



Solution 1:[1]

you have to use less loader and config it in next.config.js of your project. it's not supported to use less in next app out of the box.

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 Zahra Shahrouzi