Build time error HookWebpackError: [object Object] is not a PostCSS plugin. This happened when i updated next.js to latest version

I was using CSS in the next.js using ziet/next CSS module. Today I upgraded the next.js to the latest version and removed this ziet package because next.js now has its own CSS support. The app runs perfectly on the development. But when I tried to build it on production it shows me this error. I never used postCSS in my app but still, it is showing me this error. The below shown is my next.config.js and I have no plugin.json file. I think there is some update so I got this error. Please, someone, explain to me how to fix this error.
next.config.js

module.exports={
    publicRuntimeConfig:{
        APP_NAME:'my app name',
        API_DEVELOPMENT:'localhost',
        API_PRODUCTION:'domain name',
        PRODUCTION:false,
        DOMAIN_DEVELOPMENT:'localhost',
        DOMAIN_PRODUCTION:'my domain',
        FB_APP_ID:'some id',
        DISQUS_SHORTNAME:'some string',
        GOOGLE_CLIENT_ID:'some string'

    },
    future: {
        webpack5: true,
      },
     
}

Solution

I had this error when upgrading from Next.js 10 to 11 and trying to build my project.

I was able to solve it by:

removing @zeit/next-sass from the dependencies in package.json
deleting package-lock.json, node_modules and build
running npm install and npm run build again.

(Not sure you need to delete those files/directories but I had too since I had other errors after I resolved this one.)