Rendu CSS PROD et DEV incohérent dans Nuxt3

Question

J'ai construit une bibliothèque de composants Vue3 (appelons-la MY-LIBRARY) en utilisant Nuxt3, qui utilise tailwindv2. J'ai un projet parallèle appelé MY-SIDE-PROJECT, construit avec laravel-mix(v6) et Vue3, qui utilise tailwindv2. J'ai un autre projet Vue3 (appelons-le My-PROJECT) construit avec Nuxt3, utilisant également tailwindv2. Dans MON-PROJET, j'utilise MA-LIBRAIRE

P粉300541798 · Answer

Je comprends enfin où se situe le problème. Dans ma configuration tailwind, je dois préciser que je souhaite également appliquer tailwind aux composants importés depuis MY-LIBRARY.

Merci à @JSONDerulo pour l'échange qui m'a permis d'identifier la source.

#MY-PROJECT's tailwind.config.js

module.exports = {
    important: true,
    presets: [
        require('MY-LIBRARY/tailwind.config')
    ],
    purge: {
        content: [
            "./components/**/*.{js,vue,ts}",
            "./pages/**/*.vue",
            "./nuxt.config.{js,ts}",
            "./app.vue",
            "./node_modules/MY-LIBRARY/components/**/*.{js,vue,ts}" #<-- the important part
        ]
    },
    theme: {
        extend: {
            ...
        }
    },
}