Cannot import .less modules in NextJS 14.
Unanswered
alumi2 posted this in #help-forum
alumi2OP
I was trying to migrate from
And in result as I said I'm getting this stuff:
also there is
v13.1.6 to v14.0.3 and there is issue that lesscss module cannot be loaded, nextjs says that it cannot be imported from node_modules, but this component using only react-twemoji and stylesheet that I using, here the code:import Twemoji from 'react-twemoji';
import styles from 'styles/components/ui/Card.module.less';
export const Card = ({ title, children, background }) => {
return (<div className={styles.card__container} data-color={background??"none"}>
<div className={styles.card__container__info}>
<Twemoji className={styles.card__container__info__title} options={{ size: "svg", format: ".svg", ext: ".svg" }} >
{title}
</Twemoji>
<div className={styles.card__container__info__content}>
{children}
</div>
</div>
</div>);
}And in result as I said I'm getting this stuff:
⨯ ./src/styles/components/ui/Card.module.less
CSS Modules cannot be imported from within node_modules.
Read more: https://nextjs.org/docs/messages/css-modules-npm
Location: src\components\ui\Card.jsx
Import trace for requested module:
./src/styles/components/ui/Card.module.less
./src/components/ui/Card.jsx
./src/app/not-found.jsxalso there is
next.config.js:const withLess = require("next-with-less");
module.exports = withLess({
swcMinify: true,
async rewrites() {
return [
{
source: '/api/v1/:path*',
destination: 'http://localhost:4445/api/v1/:path*',
},
];
},
output: 'standalone',
});1 Reply
alumi2OP
I still can’t find any solution to this