title: Nuxt3: how to use tailwindcss
body: <p>Very first try on Nuxt3 via <a href="https://github.com/nuxt/starter/tree/v3" rel="nofollow noreferrer">Nuxt3 Starter</a></p>
  <p>I wonder how can I use tailwindcss in Nuxt3 Starter manually.</p>
  <p>(Not via <a href="https://tailwindcss.nuxtjs.org/" rel="nofollow noreferrer">@nuxtjs/tailwindcss</a> , because it's for Nuxt2, and not work with Nuxt3.)</p>
  <p>I created a blank Nuxt3 project by</p>
  <pre class="lang-sh prettyprint-override"><code>npx degit &quot;nuxt/starter#v3&quot; my-nuxt3-project
  </code></pre>
  <p>then, I installed the tailwindcss manually</p>
  <pre><code>npm install -D tailwindcss@latest postcss@latest autoprefixer@latest
  </code></pre>
  <p><strong>nuxt.config.ts</strong></p>
  <pre><code>export default {
      css: [
          '~/assets/tailwind.css',
      ]
  }
  </code></pre>
  <p><strong>assets/tailwind.css</strong></p>
  <pre class="lang-css prettyprint-override"><code>@tailwind base;
  @tailwind components;
  @tailwind utilities;
  </code></pre>
  <p>but I can only get the raw code but not the compiled css:
  <img src="https://i.stack.imgur.com/MxSKS.png" alt="raw code but not the compiled css" /></p>
  <p>How can I use tailwindcss in Nuxt3?</p>
  <p>Any help is greatly appreciated!</p>
  <hr />
  <p><a href="https://stackblitz.com/edit/node-c7qrtv" rel="nofollow noreferrer">online mini demo</a></p>