Properly installed tailwind dosn't work in React app

I initialized React application using Vite, and know I'm trying to add tailwind to this app.

I follewed the steps straight from documentation, and simply the classes are not applied to my components. https://tailwindcss.com/docs/guides/create-react-app

Couple of days ago I was initializing React app the same way, followed the same instructions, and tailwind was working just fine. Now it does not and I really can't find any difference.

Here is my tailwind.config.js:

module.exports = {
  content: [
    "./src/**/*.{js,jsx,ts,tsx}",
  ],
  theme: {
    extend: {},
  },
  plugins: [],
}

Here is package.json:

{
  "name": "megak-group-project-frontend",
  "private": true,
  "version": "0.0.0",
  "scripts": {
    "dev": "vite",
    "build": "vite build",
    "preview": "vite preview"
  },
  "dependencies": {
    "react": "^17.0.2",
    "react-dom": "^17.0.2"
  },
  "devDependencies": {
    "@vitejs/plugin-react": "^1.0.7",
    "autoprefixer": "^10.4.2",
    "postcss": "^8.4.6",
    "tailwindcss": "^3.0.22",
    "vite": "^2.8.0"
  }
}

Here is index.css:

@tailwind base;
@tailwind components;
@tailwind utilities;

Here is component that doesn't work:

function App() {

  return (
    <div className="App">
      <h1 className="text-3xl font-bold underline">
        Hello world!
      </h1>
    </div>
  )
}

export default App

After some time I find out that npx tailwindcss init did not initialize postcss.config.js.

The reason it was not warking was this file missing with content:

const tailwindcss = require("tailwindcss");
module.exports = {
  plugins: [tailwindcss("./tailwind.config.js"), require("autoprefixer")],
};