Struggling with cssModules:true

[binary64]

Hi! I am loving the ecosystem being built here.

I did

yarn create nx-workspace
...
yarn run nx g @nrwl/next:application web
yarn run nx g @nrwl/react:library ui

(all styles chosen was 'LESS')

Now when I set /apps/web/next.config.js:-

• cssModules: false (default) - scoped LESS works in /app/web/ but not /libs/ui/
• cssModules: true - scoped LESS works in neither /app/web/ nor /libs/ui/

My ultimate aim is to customise some ant.design components in /libs/ui/, and use them in /apps/web/, with "next export", and I wish for my css to be "highly isolated".

When I say "scoped LESS" I mean import styles from './xxxx.module.less'; <Blah className={styles.blah} />

I tried using strings instead, this works quite well, but the styles leak to other components.

In summary, I found it confusing that a) Creating a LESS next app uses scoped sytnax, but creating a react component doesn't (but it still has the ".module." in the filename). b) cssModules: true basically didn't work out of the box as I had expected it (I'm new to LESS Modules)

[binary64]

I think I found the fix: in /apps/web/pages/_app.tsx I had import '../styles/global.less' but when I changed it to require('../styles/global.less') it now works at export-time

[github-actions[bot]]

This issue has been closed for more than 30 days. If this issue is still occuring, please open a new issue with more recent context.