title: installing tailwindcss v.3.0.15 using PostCSS doesn't work properly
body: <p>I need clarification. I am following the instructions for installation <a href="https://tailwindcss.com/docs/installation/using-postcss" rel="nofollow noreferrer">https://tailwindcss.com/docs/installation/using-postcss</a>.</p>
  <p>What I did:</p>
  <p><code>npm install -D tailwindcss postcss autoprefixer</code></p>
  <p><code>npx tailwindcss init</code> (creates a tailwindcss config file)</p>
  <p>What I'm expected to do next:</p>
  <ul>
  <li><p>Add Tailwind to your PostCSS configuration <code>postcss.config.js</code></p>
  </li>
  <li><p>Configure your template paths <code>tailwind.config.js</code></p>
  </li>
  </ul>
  <p>But only <code>tailwind.config.js</code> was created automatically. Is this normal and is one expected to create the other file manually? Or does it give a hint that something else is missing?</p>
  <p>*** <strong>Edit</strong> ***</p>
  <p>I created the <code>postcss.config.js</code> manually and added the plugins to it.</p>
  <p>And I added the directives to the main.css file</p>
  <pre><code>@tailwind base;
  @tailwind components;
  @tailwind utilities;
  </code></pre>
  <p>however the h1 title</p>
  <pre><code>&lt;h1 class=&quot;text-3xl font-bold underline&quot;&gt;
      Hello world!
    &lt;/h1&gt;
  </code></pre>
  <p>one is supposed to add to the application to see if everything worked, shows that not everything worked, as &quot;Hello World&quot; is neither bold nor underlined.</p>
  <p>*** <strong>Solution</strong> ***
  add .jsx to the possible endings</p>
  <pre><code>module.exports = {
    content: [&quot;./src/**/*.{html,js,jsx}&quot;],
    theme: {
      extend: {},
    },
    plugins: [],
  }
  </code></pre>