UnhandledPromiseRejectionWarning: TypeError: match.loader.options.plugins is not a function

package.json

`{

"name": "client",
"version": "0.1.0",
"private": true,
"dependencies": {
    "@craco/craco": "^6.4.3",
    "@emotion/react": "^11.7.0",
    "@emotion/styled": "^11.6.0",
    "@mui/icons-material": "^5.2.0",
    "@mui/material": "^5.2.1",
    "@testing-library/jest-dom": "^5.15.1",
    "@testing-library/react": "^11.2.7",
    "@testing-library/user-event": "^12.8.3",
    "axios": "^0.24.0",
    "dotenv": "^10.0.0",
    "eslint": "^7.32.0",
    "firebase": "^9.5.0",
    "history": "^5.1.0",
    "moment": "^2.29.1",
    "react": "^17.0.2",
    "react-dom": "^17.0.2",
    "react-router": "^6.0.2",
    "react-router-dom": "^6.0.2",
    "react-scripts": "^5.0.0",
    "react-toastify": "^8.1.0",
    "stream-chat": "^4.4.3",
    "stream-chat-react": "^6.12.0",
    "typescript": "^4.5.4",
    "universal-cookie": "^4.0.4",
    "web-vitals": "^1.1.2"
},
"scripts": {
    "start": "craco start",
    "build": "craco build",
    "test": "craco test",
    "eject": "react-scripts eject",
    "lint": "eslint ./src --ext .js",
    "lint:fix": "npm run lint -- --fix",
    "prettier:format": "prettier --write \"**/*.+(js|jsx|ts|tsx|json|scss|md)\"",
    "pre:commit": "npm run lint && npm run prettier:format"
},
"eslintConfig": {
    "extends": [
        "react-app",
        "react-app/jest"
    ]
},
"browserslist": {
    "production": [
        ">0.2%",
        "not dead",
        "not op_mini all"
    ],
    "development": [
        "last 1 chrome version",
        "last 1 firefox version",
        "last 1 safari version"
    ]
},
"devDependencies": {
    "autoprefixer": "^9.8.8",
    "eslint-config-prettier": "^8.3.0",
    "eslint-plugin-import": "^2.25.3",
    "eslint-plugin-jsx-a11y": "^6.5.1",
    "eslint-plugin-prettier": "^4.0.0",
    "eslint-plugin-react": "^7.27.1",
    "eslint-plugin-react-hooks": "^4.3.0",
    "postcss": "^7.0.39",
    "prettier": "^2.5.1",
    "tailwindcss": "npm:@tailwindcss/postcss7-compat@^2.2.17"
}

} `

craco.config.js

`module.exports = {

style: {
    postcss: {
        plugins: [require('tailwindcss'), require('autoprefixer')],
    },
},

};`

I have just shifted to react scripts 5.0.0 for in order to get rid of this issue and now im getting an error in vs code console while doing npm start, which goes like UnhandledPromiseRejectionWarning: TypeError: match.loader.options.plugins is not a function and i don’t know what is causing this error can someone please help out with this

[albeniskerqeli10]

try to replace “postcss” with “postcssOptions” in craco config I had the same problem , this method works for me.

[shivani805]

try to replace “postcss” with “postcssOptions” in craco config I had the same problem , this method works for me.

really work for me