Next-plugins: css module imports stopped working

[pailhead]

I removed the node_modules from my project. Now i get this relative module was not found pointing to a ./styles.css css module. It was working fine before i reinstalled everything.

When i try to build, i see an error that css-loader is missing. If i npm install css-loader i get a different error (something about invalid config provided).

Please advise.

const withBundleAnalyzer = require('@zeit/next-bundle-analyzer')
const withCSS = require('@zeit/next-css')
const withSass = require('@zeit/next-sass')

const withPlugins = require('next-compose-plugins')

module.exports = withPlugins([
    [
        withSass,
        {
            cssModules: true,
            cssLoaderOptions: {
                localIdentName: '[local]___[hash:base64:5]'
            }
        }
    ],

    [
        withCSS,
        {
            cssModules: true,
            cssLoaderOptions: {
                localIdentName: '[local]___[hash:base64:5]'
            }
        }
    ],

    [
        withBundleAnalyzer,
        {
            analyzeServer: ['server', 'both'].includes(
                process.env.BUNDLE_ANALYZE
            ),
            analyzeBrowser: ['browser', 'both'].includes(
                process.env.BUNDLE_ANALYZE
            ),
            bundleAnalyzerConfig: {
                server: {
                    analyzerMode: 'static',
                    reportFilename: '../bundles/server.html'
                },
                browser: {
                    analyzerMode: 'static',
                    reportFilename: '../bundles/client.html'
                }
            }
        }
    ]
])

[pailhead]

When i install css-loader and sass-loader manually @1.0.0 everything is back to normal. I don't understand how is this lost since the loaders do exist in @zeit/next-css.

[tagyoureit]

I am brand new to this, but I found the following issue which solves the problem for options should NOT have additional properties if you install [email protected].

[pailhead]

But why don’t I need this loader he first time I install next?

[tagyoureit]

Maybe try removing the node_modules directory and reinstalling? I'm not sure (and struggling with my own issues). :(

[pailhead]

thats what caused the problem in the first place :) id like to understand better what is going on, i like next so far. Having [email protected] and [email protected] makes removing node_modules and npm install just work.

[ryanmeisters]

I think I'm having the same issue. I upgraded a project from Next 5 to next 7 and started getting relative module not found for css imports and the css-loader missing. npm i -S [email protected] seems to have fixed the problem, but would love to understand why

[timneutkens]

Hi, thanks for creating an issue. We currently recommend using nextjs.org/docs/basic-features/built-in-css-support as the plugins have been deprecated in favor of the built-in support.