Overwrite content options is not working

This issue has been tracked since 2023-01-13.

package.json

{
  "devDependencies": {
    "@nuxtjs/tailwindcss": "^6.2.0",
    "nuxt": "3.0.0"
  }
}

i tried various settings. but overriding always doesn't work

nuxt.config.ts

export default {
  tailwindcss: {
    config: {
      content() {
        return ['./theme1/**/*.vue']
      }
    }
  },
}

is not working.

tailwind.config.js
```
export default {
  content() {
    return ['./theme1/**/*.vue']
  }
}
```
will throw the error. Cannot restart nuxt: (tailwindConfig.content || []) is not iterable

the following settings are possible. but not formal

nuxt.config.ts

export default {
  hooks: {
    // is working
    'tailwindcss:config'(config: any) {
      config.content = ['./theme1/**/*.vue']
    },
  },
}

tailwind.config.js

export default {
  // is working, purge options have changed in Tailwind CSS v3.0.
  purge: [
    'test/*.vue'
  ]
}

what i need is overwrite not merge. can anyone help?

Atinux wrote this answer on 2023-01-15

Why using a function for content?

jheng-jie wrote this answer on 2023-01-15

@Atinux I refer to the document's

config/#merging-strategy

ineshbose wrote this answer on 2023-01-15

I didn't see an option in the source code of the module for content to be function. Moreover, since there are also usage of JSON.stringify to add templates, the function would get removed (though the module internally copies over the config according to my knowledge). But I've opened #592 as a draft fix for it if Atinux would provide feedback. 🙂

ineshbose wrote this answer on 2023-01-28

@jheng-jie can you check with 6.3.0?

jheng-jie wrote this answer on 2023-01-28

@ineshbose 6.3.0 is working! thank you very much.

// nuxt.config.ts
{
  tailwindcss: {
    config: {
      content(origin: TailwindConfig['content']) {
        console.log('origin', origin)
        // overwrite
        return [
          './src/App.vue',
          './src/theme/_common/**/*.{vue,scss}',
          `./src/theme/${process.env.VITE_THEME}/**/*.{vue,scss}`,
        ]
      },
    },
  }
}

Your Name

Your Comment

More Details About Repo

Owner Name	nuxt-modules
Repo Name	tailwindcss
Full Name	nuxt-modules/tailwindcss
Language	TypeScript
Created Date	2019-04-04
Updated Date	2023-03-29
Star Count	1285
Watcher Count	12
Fork Count	157
Issue Count	57

YOU MAY BE INTERESTED

Issue Title	Created Date	Updated Date