PostCSS @import

Hi,

I'm trying to use @import in the css but I get an error 'Module not found. Example:

Layout.js
import s from './Layout.css';

Layout.css
@import "base/_variables";

When I replace the css import with "/base/_variables"; I no longer get the error but on page load the following shows up in the debug console:

Resource interpreted as Stylesheet but transferred with MIME type text/html: "http://localhost:3000/base/_variables".

I'm assuming it's an issue with the webpack config?

Any assistance would be greatly appreciated.

Thanks in advance!

Start with Layout.js and Layout.css, then inspect the webpack configuration related to the referenced base/_variables import. Reproduce the module-not-found error and check the browser's MIME-type warning; the issue is done when the CSS import builds successfully and the referenced stylesheet is served as CSS.

Written by the indexing model from the issue text.