Use CSS files in a Next-compatible Node module?

Question

I'm new-ish to Next, migrating from Gatsby.

In Gatsby, I had a Node module that I used for UIs across my projects, like a UI library. It used a CSS module file (style.module.css), which could be imported from the main JavaScript file in the module. The Node module needs to remain as a Node module (on NPM/Yarn etc).

However, on moving to Next, I have discovered that Next doesn't allow importing of (at least by default) CSS or CSS Module files within a Node module, as can be seen in the screenshot attached.

My question is, how can I use a CSS/CSS module (either is fine) file within my Node module, or if this isn't possible, what can I do instead? I can use CSS-in-JS, but would prefer conventional CSS if possible

Aifos Si Prahs · Accepted Answer · 2022-10-09 19:41:37Z

0

Are you using an old version of NextJS? https://nextjs.org/docs/basic-features/built-in-css-support

Starting from versions 9.^ you should be able to import css from node_modules in any file, not only _app.js

answered Oct 9, 2022 at 19:41

Aifos Si Prahs

3631 silver badge11 bronze badges

Sign up to request clarification or add additional context in comments.

4 Comments

Viggo BF Over a year ago

no, i am using Next.js 12. Note - I am trying to import from node_modules within the module, from the main JS file inside the module.

Aifos Si Prahs Over a year ago

@Viggo BF, Can you create a CodeSandbox sample for this? Are you trying to import it within the src/ directory or you're trying to import it from node_modules? You cannot import css in .js files, it's only supported in React/NextJS.

Aifos Si Prahs Over a year ago

Does it help you: stackoverflow.com/a/62345369/19135131? Can you at least update your question to show the code lines of importing the css module. The part that causes the rrror.

Viggo BF Over a year ago

I actually managed to fix this issue by using the next-transpile-modules module. There are still teething problems with using non-pure selectors, but I am ironing these out.

Collectives™ on Stack Overflow

Use CSS files in a Next-compatible Node module?

1 Answer 1

4 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

4 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related