title: Why aren't the Tailwind classes taking effect in my Vite React project?
body: <p>I have a Vite React project that uses Tailwind via PostCSS. However, none of the classes are reflecting the the localhost. Below are the files in the project:</p>
  <p><strong>postcss.config.js:</strong></p>
  <pre class="lang-js prettyprint-override"><code>module.exports = {
      plugins: {
          tailwindcss: {},
          autoprefixer: {},
      }
  }
  </code></pre>
  <p><strong>tailwind.config.js:</strong></p>
  <pre class="lang-js prettyprint-override"><code>module.exports = {
    content: [&quot;./src/**/*.{html,js}&quot;],
    theme: {
      extend: {},
    },
    plugins: [],
  }
  </code></pre>
  <p><strong>App.js:</strong></p>
  <pre><code>const App = () =&gt; {
    return (
      &lt;div className=&quot;App&quot;&gt;
        &lt;h1 class=&quot;text-3xl font-bold underline&quot;&gt;
          Hello world!
        &lt;/h1&gt;
      &lt;/div&gt;
    )
  }
  export default App
  </code></pre>
  <p>This was all done following the instructions in the Tailwind documentation at <a href="https://tailwindcss.com/docs/installation/using-postcss" rel="nofollow noreferrer">https://tailwindcss.com/docs/installation/using-postcss</a>.</p>
  <p>Why doesn't it work?</p>