1

I have followed the official Tailwind + Nuxt documentation to add Tailwind to Nuxt. I have done so for 2 new Projects and 1 existing Nuxt project. And it works fine for the first 2 projects, but...

The existing Nuxt project is giving me a hard time now as it seems to ignore the tailwind.config.js file.

Tailwind works but it is using the default config, no matter what changes I make to the config file. Nuxt also does not hot-reload when changes are made to the config.

My IDE on the other hand detects the changes and offers them as IntelliSense auto-complete option.

I am pretty lost and not sure where to start troubleshooting. Happy to share the repo if that helps.

Any help greatly appreciated. Thanks!

-- Miss J

MissJulie
  • 273
  • 4
  • 18

2 Answers2

0

Did you register tailwindcss in the buildModules of the nuxt.config.js (and not modules) ?

  buildModules: [
    // https://go.nuxtjs.dev/tailwindcss
    '@nuxtjs/tailwindcss'
  ],

Can you add some of your code to help troubleshoot ?

  • package.json
  • nuxt.config.js
  • tailwind.config.js

What are you trying to change inside the tailwind config ?
The Nuxt module for Tailwind CSS is using v1.9.6 and not the latest v.2.0.3, so some things you try to change in your config file following the docs are maybe not possible with the current nuxt package.

You can upgrade to latest Tailwind version : https://stackoverflow.com/a/30650609/13541914

yarn add --dev tailwindcss@npm:@tailwindcss/postcss7-compat postcss@^7 autoprefixer@^9
Benjamin Fourgeaud
  • 690
  • 7
  • 19
-1

All I did was add a tailwind.config.js file.

Hope it helps

Daniel
  • 11