Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Missing some utilities class on Nuxt 3 with latest version #889

Open
Layenzz opened this issue Aug 8, 2024 · 3 comments
Open

Missing some utilities class on Nuxt 3 with latest version #889

Layenzz opened this issue Aug 8, 2024 · 3 comments
Labels
question Further information is requested

Comments

@Layenzz
Copy link

Layenzz commented Aug 8, 2024

Environment

  • Operating System: Windows_NT
  • Node Version: v18.18.0
  • Nuxt Version: 3.11.1
  • CLI Version: 3.10.0
  • Nitro Version: -
  • Package Manager: [email protected]
  • Builder: -
  • User Config: devtools, devServer, extends, runtimeConfig, vite, modules, hooks, experimental, optimizeDeps
  • Runtime Modules: @nuxtjs/[email protected], @vueform/[email protected], @nuxtjs/sitemap@^5.1.4
  • Build Modules: -

Reproduction

No response

Describe the bug

I have a bug when I use certain class utilities, I hadn't noticed this at first but now I realize it and it's really impacting I'll explain:

I'm using nuxt 3 layers and the style is well generated, but certain classes are missing, for example:

If I set the max-w-md class, the class exists and the style is applied.
If I set the max-w-sm class, it doesn't work, even though it's in the official tailwind doc and I'm using the latest version.

Shelter values don't work either, for example:

if I set max-w-[20vw] it doesn't work

I've tried reinstalling tailwind without the module and with the module, but nothing works.

I've put together two images where you can see the problem

Here's my tailwind.config.js config:

const colors = {/***/} //My colors 

export default {
  content: [
    './components/**/*.{vue,js}',
    './layouts/**/*.vue',
    './pages/**/*.vue',
    './plugins/**/*.{js,ts}',
    './nuxt.config.{js,ts}',
  ],
  theme: {
    colors: colors,
    extend: {
      maxWidth: {
        '1/4': '25%',
        '1/2': '50%',
        '3/4': '75%',
        '50vw': '50vw',
        '15vw': '15vw',
      },
      '@container': 'container-type: inline-size;',
      'size-full': 'container-type: inline-size;'
    },
    screens: {
      'sm': '600px',
      'md': '960px',
      'lg': '1280px',
      'xl': '1920px',
      '2xl': '2560px',
    }
  },
  plugins: [
    require('@vueform/vueform/tailwind'),
  ]
}

image
image

P.S: The last image is the content used by nuxt that is displayed when I do this in my nuxt.config.ts :

hooks: {
    tailwindcss:config'(config: any) {
      console.log(config)
    }
}

Thanks for all

image

Additional context

No response

Logs

No response
@Layenzz Layenzz added the bug Something isn't working label Aug 8, 2024
@ineshbose ineshbose added question Further information is requested and removed bug Something isn't working labels Aug 18, 2024
@ineshbose
Copy link
Collaborator

Hi @Layenzz, thanks for opening an issue. I might need a bit more context as there is no reproduction provided.

Can you send a screenshot of your project file-structure / outline, the content inside .nuxt/tailwind.config.cjs, and the location of this component that uses max-w-sm?

You shouldn't also need to specify content paths in your project's tailwind.config.js (except for nuxt.config which should be avoided).

@Layenzz
Copy link
Author

Layenzz commented Aug 19, 2024 •
edited by ineshbose
Loading

Thanks for your response.

To begin, i don't have .nuxt/tailwind.config.cjs but i have a folder .nuxt/tailwind.config/ with only one file "viewer-config.cjs'

module.exports = {
    "content": ["./vueform.config.ts",
      "./node_modules/.pnpm/@vueform+vueform@*/node_modules/@vueform/vueform/themes/tailwind/**/*.vue",
      "./node_modules/.pnpm/@vueform+vueform@*/node_modules/@vueform/vueform/themes/tailwind/**/*.js",
      "/front/layers/@liberty-landing-clients/tech_liberty/base/components/**/*.{vue,js,jsx,mjs,ts,tsx}",
      "/front/layers/@liberty-landing-clients/tech_liberty/base/src/components/**/*.{vue,js,jsx,mjs,ts,tsx}",
      "/front/layers/@liberty-landing-clients/tech_liberty/base/src/layouts/**/*.{vue,js,jsx,mjs,ts,tsx}",
      "/front/layers/@liberty-landing-clients/tech_liberty/base/src/pages/**/*.{vue,js,jsx,mjs,ts,tsx}",
      "/front/layers/@liberty-landing-clients/tech_liberty/base/src/plugins/**/*.{js,ts,mjs}",
      "/front/layers/@liberty-landing-clients/tech_liberty/base/src/composables/**/*.{js,ts,mjs}",
      "/front/layers/@liberty-landing-clients/tech_liberty/base/src/composables/**/*.{js,ts,mjs}",
      "/front/layers/@liberty-landing-clients/tech_liberty/base/src/composables/**/*.{js,ts,mjs}",
      "/front/layers/@liberty-landing-clients/tech_liberty/base/src/composables/**/*.{js,ts,mjs}",
      "/front/layers/@liberty-landing-clients/tech_liberty/base/src/composables/**/*.{js,ts,mjs}",
      "/front/layers/@liberty-landing-clients/tech_liberty/base/src/composables/**/*.{js,ts,mjs}",
      "/front/layers/@liberty-landing-clients/tech_liberty/base/src/composables/**/*.{js,ts,mjs}",
      "/front/layers/@liberty-landing-clients/tech_liberty/base/src/composables/**/*.{js,ts,mjs}",
      "/front/layers/@liberty-landing-clients/tech_liberty/base/src/composables/**/*.{js,ts,mjs}",
      "/front/layers/@liberty-landing-clients/tech_liberty/base/src/composables/**/*.{js,ts,mjs}",
      "/front/layers/@liberty-landing-clients/tech_liberty/base/composables/**/*.{js,ts,mjs}",
      "/front/layers/@liberty-landing-clients/tech_liberty/base/utils/**/*.{js,ts,mjs}",
      "/front/layers/@liberty-landing-clients/tech_liberty/base/{A,a}pp.{vue,js,jsx,mjs,ts,tsx}",
      "/front/layers/@liberty-landing-clients/tech_liberty/base/{E,e}rror.{vue,js,jsx,mjs,ts,tsx}",
      "/front/layers/@liberty-landing-clients/tech_liberty/base/app.config.{js,ts,mjs}",
      "/front/layers/@liberty-landing-clients/monlabel_fr/base/components/**/*.{vue,js,jsx,mjs,ts,tsx}",
      "/front/layers/@liberty-landing-clients/monlabel_fr/base/src/components/**/*.{vue,js,jsx,mjs,ts,tsx}",
      "/front/layers/@liberty-landing-clients/monlabel_fr/base/src/layouts/**/*.{vue,js,jsx,mjs,ts,tsx}",
      "/front/layers/@liberty-landing-clients/monlabel_fr/base/src/pages/**/*.{vue,js,jsx,mjs,ts,tsx}",
      "/front/layers/@liberty-landing-clients/monlabel_fr/base/src/plugins/**/*.{js,ts,mjs}",
      "/front/layers/@liberty-landing-clients/monlabel_fr/base/src/composables/**/*.{js,ts,mjs}",
      "/front/layers/@liberty-landing-clients/monlabel_fr/base/src/composables/**/*.{js,ts,mjs}",
      "/front/layers/@liberty-landing-clients/monlabel_fr/base/src/composables/**/*.{js,ts,mjs}",
      "/front/layers/@liberty-landing-clients/monlabel_fr/base/src/composables/**/*.{js,ts,mjs}",
      "/front/layers/@liberty-landing-clients/monlabel_fr/base/src/composables/**/*.{js,ts,mjs}",
      "/front/layers/@liberty-landing-clients/monlabel_fr/base/src/composables/**/*.{js,ts,mjs}",
      "/front/layers/@liberty-landing-clients/monlabel_fr/base/src/composables/**/*.{js,ts,mjs}",
      "/front/layers/@liberty-landing-clients/monlabel_fr/base/src/composables/**/*.{js,ts,mjs}",
      "/front/layers/@liberty-landing-clients/monlabel_fr/base/src/composables/**/*.{js,ts,mjs}",
      "/front/layers/@liberty-landing-clients/monlabel_fr/base/src/composables/**/*.{js,ts,mjs}",
      "/front/layers/@liberty-landing-clients/monlabel_fr/base/composables/**/*.{js,ts,mjs}",
      "/front/layers/@liberty-landing-clients/monlabel_fr/base/utils/**/*.{js,ts,mjs}",
      "/front/layers/@liberty-landing-clients/monlabel_fr/base/{A,a}pp.{vue,js,jsx,mjs,ts,tsx}",
      "/front/layers/@liberty-landing-clients/monlabel_fr/base/{E,e}rror.{vue,js,jsx,mjs,ts,tsx}",
      "/front/layers/@liberty-landing-clients/monlabel_fr/base/app.config.{js,ts,mjs}",
      "/front/layers/@liberty-landing-cms/website/components/**/*.{vue,js,jsx,mjs,ts,tsx}",
      "/front/layers/@liberty-landing-cms/website/src/components/**/*.{vue,js,jsx,mjs,ts,tsx}",
      "/front/layers/@liberty-landing-cms/website/src/layouts/**/*.{vue,js,jsx,mjs,ts,tsx}",
      "/front/layers/@liberty-landing-cms/website/src/pages/**/*.{vue,js,jsx,mjs,ts,tsx}",
      "/front/layers/@liberty-landing-cms/website/src/plugins/**/*.{js,ts,mjs}",
      "/front/layers/@liberty-landing-cms/website/src/composables/**/*.{js,ts,mjs}",
      "/front/layers/@liberty-landing-cms/website/src/composables/**/*.{js,ts,mjs}",
      "/front/layers/@liberty-landing-cms/website/src/composables/**/*.{js,ts,mjs}",
      "/front/layers/@liberty-landing-cms/website/src/composables/**/*.{js,ts,mjs}",
      "/front/layers/@liberty-landing-cms/website/src/composables/**/*.{js,ts,mjs}",
      "/front/layers/@liberty-landing-cms/website/src/composables/**/*.{js,ts,mjs}",
      "/front/layers/@liberty-landing-cms/website/src/composables/**/*.{js,ts,mjs}",
      "/front/layers/@liberty-landing-cms/website/src/composables/**/*.{js,ts,mjs}",
      "/front/layers/@liberty-landing-cms/website/src/composables/**/*.{js,ts,mjs}",
      "/front/layers/@liberty-landing-cms/website/src/composables/**/*.{js,ts,mjs}",
      "/front/layers/@liberty-landing-cms/website/composables/**/*.{js,ts,mjs}",
      "/front/layers/@liberty-landing-cms/website/utils/**/*.{js,ts,mjs}",
      "/front/layers/@liberty-landing-cms/website/{A,a}pp.{vue,js,jsx,mjs,ts,tsx}",
      "/front/layers/@liberty-landing-cms/website/{E,e}rror.{vue,js,jsx,mjs,ts,tsx}",
      "/front/layers/@liberty-landing-cms/website/app.config.{js,ts,mjs}",
      "/front/layers/@liberty-landing-cms/project/components/**/*.{vue,js,jsx,mjs,ts,tsx}",
      "/front/layers/@liberty-landing-cms/project/src/components/**/*.{vue,js,jsx,mjs,ts,tsx}",
      "/front/layers/@liberty-landing-cms/project/src/layouts/**/*.{vue,js,jsx,mjs,ts,tsx}",
      "/front/layers/@liberty-landing-cms/project/src/pages/**/*.{vue,js,jsx,mjs,ts,tsx}",
      "/front/layers/@liberty-landing-cms/project/src/plugins/**/*.{js,ts,mjs}",
      "/front/layers/@liberty-landing-cms/project/src/composables/**/*.{js,ts,mjs}",
      "/front/layers/@liberty-landing-cms/project/src/composables/**/*.{js,ts,mjs}",
      "/front/layers/@liberty-landing-cms/project/src/composables/**/*.{js,ts,mjs}",
      "/front/layers/@liberty-landing-cms/project/src/composables/**/*.{js,ts,mjs}",
      "/front/layers/@liberty-landing-cms/project/src/composables/**/*.{js,ts,mjs}",
      "/front/layers/@liberty-landing-cms/project/src/composables/**/*.{js,ts,mjs}",
      "/front/layers/@liberty-landing-cms/project/src/composables/**/*.{js,ts,mjs}",
      "/front/layers/@liberty-landing-cms/project/src/composables/**/*.{js,ts,mjs}",
      "/front/layers/@liberty-landing-cms/project/src/composables/**/*.{js,ts,mjs}",
      "/front/layers/@liberty-landing-cms/project/src/composables/**/*.{js,ts,mjs}",
      "/front/layers/@liberty-landing-cms/project/composables/**/*.{js,ts,mjs}",
      "/front/layers/@liberty-landing-cms/project/utils/**/*.{js,ts,mjs}",
      "/front/layers/@liberty-landing-cms/project/{A,a}pp.{vue,js,jsx,mjs,ts,tsx}",
      "/front/layers/@liberty-landing-cms/project/{E,e}rror.{vue,js,jsx,mjs,ts,tsx}",
      "/front/layers/@liberty-landing-cms/project/app.config.{js,ts,mjs}",
      "/front/layers/@liberty-landing-cms/media/components/**/*.{vue,js,jsx,mjs,ts,tsx}",
      "/front/layers/@liberty-landing-cms/media/src/components/**/*.{vue,js,jsx,mjs,ts,tsx}",
      "/front/layers/@liberty-landing-cms/media/src/layouts/**/*.{vue,js,jsx,mjs,ts,tsx}",
      "/front/layers/@liberty-landing-cms/media/src/pages/**/*.{vue,js,jsx,mjs,ts,tsx}",
      "/front/layers/@liberty-landing-cms/media/src/plugins/**/*.{js,ts,mjs}",
      "/front/layers/@liberty-landing-cms/media/src/composables/**/*.{js,ts,mjs}",
      "/front/layers/@liberty-landing-cms/media/src/composables/**/*.{js,ts,mjs}",
      "/front/layers/@liberty-landing-cms/media/src/composables/**/*.{js,ts,mjs}",
      "/front/layers/@liberty-landing-cms/media/src/composables/**/*.{js,ts,mjs}",
      "/front/layers/@liberty-landing-cms/media/src/composables/**/*.{js,ts,mjs}",
      "/front/layers/@liberty-landing-cms/media/src/composables/**/*.{js,ts,mjs}",
      "/front/layers/@liberty-landing-cms/media/src/composables/**/*.{js,ts,mjs}",
      "/front/layers/@liberty-landing-cms/media/src/composables/**/*.{js,ts,mjs}",
      "/front/layers/@liberty-landing-cms/media/src/composables/**/*.{js,ts,mjs}",
      "/front/layers/@liberty-landing-cms/media/src/composables/**/*.{js,ts,mjs}",
      "/front/layers/@liberty-landing-cms/media/composables/**/*.{js,ts,mjs}",
      "/front/layers/@liberty-landing-cms/media/utils/**/*.{js,ts,mjs}",
      "/front/layers/@liberty-landing-cms/media/{A,a}pp.{vue,js,jsx,mjs,ts,tsx}",
      "/front/layers/@liberty-landing-cms/media/{E,e}rror.{vue,js,jsx,mjs,ts,tsx}",
      "/front/layers/@liberty-landing-cms/media/app.config.{js,ts,mjs}",
      "/front/layers/@liberty-landing-cms/licence/components/**/*.{vue,js,jsx,mjs,ts,tsx}",
      "/front/layers/@liberty-landing-cms/licence/src/components/**/*.{vue,js,jsx,mjs,ts,tsx}",
      "/front/layers/@liberty-landing-cms/licence/src/layouts/**/*.{vue,js,jsx,mjs,ts,tsx}",
      "/front/layers/@liberty-landing-cms/licence/src/pages/**/*.{vue,js,jsx,mjs,ts,tsx}",
      "/front/layers/@liberty-landing-cms/licence/src/plugins/**/*.{js,ts,mjs}",
      "/front/layers/@liberty-landing-cms/licence/src/composables/**/*.{js,ts,mjs}",
      "/front/layers/@liberty-landing-cms/licence/src/composables/**/*.{js,ts,mjs}",
      "/front/layers/@liberty-landing-cms/licence/src/composables/**/*.{js,ts,mjs}",
      "/front/layers/@liberty-landing-cms/licence/src/composables/**/*.{js,ts,mjs}",
      "/front/layers/@liberty-landing-cms/licence/src/composables/**/*.{js,ts,mjs}",
      "/front/layers/@liberty-landing-cms/licence/src/composables/**/*.{js,ts,mjs}",
      "/front/layers/@liberty-landing-cms/licence/src/composables/**/*.{js,ts,mjs}",
      "/front/layers/@liberty-landing-cms/licence/src/composables/**/*.{js,ts,mjs}",
      "/front/layers/@liberty-landing-cms/licence/src/composables/**/*.{js,ts,mjs}",
      "/front/layers/@liberty-landing-cms/licence/src/composables/**/*.{js,ts,mjs}",
      "/front/layers/@liberty-landing-cms/licence/composables/**/*.{js,ts,mjs}",
      "/front/layers/@liberty-landing-cms/licence/utils/**/*.{js,ts,mjs}",
      "/front/layers/@liberty-landing-cms/licence/{A,a}pp.{vue,js,jsx,mjs,ts,tsx}",
      "/front/layers/@liberty-landing-cms/licence/{E,e}rror.{vue,js,jsx,mjs,ts,tsx}",
      "/front/layers/@liberty-landing-cms/licence/app.config.{js,ts,mjs}",
      "/front/layers/@liberty-landing-cms/client/components/**/*.{vue,js,jsx,mjs,ts,tsx}",
      "/front/layers/@liberty-landing-cms/client/src/components/**/*.{vue,js,jsx,mjs,ts,tsx}",
      "/front/layers/@liberty-landing-cms/client/src/layouts/**/*.{vue,js,jsx,mjs,ts,tsx}",
      "/front/layers/@liberty-landing-cms/client/src/pages/**/*.{vue,js,jsx,mjs,ts,tsx}",
      "/front/layers/@liberty-landing-cms/client/src/plugins/**/*.{js,ts,mjs}",
      "/front/layers/@liberty-landing-cms/client/src/composables/**/*.{js,ts,mjs}",
      "/front/layers/@liberty-landing-cms/client/src/composables/**/*.{js,ts,mjs}",
      "/front/layers/@liberty-landing-cms/client/src/composables/**/*.{js,ts,mjs}",
      "/front/layers/@liberty-landing-cms/client/src/composables/**/*.{js,ts,mjs}",
      "/front/layers/@liberty-landing-cms/client/src/composables/**/*.{js,ts,mjs}",
      "/front/layers/@liberty-landing-cms/client/src/composables/**/*.{js,ts,mjs}",
      "/front/layers/@liberty-landing-cms/client/src/composables/**/*.{js,ts,mjs}",
      "/front/layers/@liberty-landing-cms/client/src/composables/**/*.{js,ts,mjs}",
      "/front/layers/@liberty-landing-cms/client/src/composables/**/*.{js,ts,mjs}",
      "/front/layers/@liberty-landing-cms/client/src/composables/**/*.{js,ts,mjs}",
      "/front/layers/@liberty-landing-cms/client/composables/**/*.{js,ts,mjs}",
      "/front/layers/@liberty-landing-cms/client/utils/**/*.{js,ts,mjs}",
      "/front/layers/@liberty-landing-cms/client/{A,a}pp.{vue,js,jsx,mjs,ts,tsx}",
      "/front/layers/@liberty-landing-cms/client/{E,e}rror.{vue,js,jsx,mjs,ts,tsx}",
      "/front/layers/@liberty-landing-cms/client/app.config.{js,ts,mjs}",
      "/front/layers/@liberty-landing-cms/api/components/**/*.{vue,js,jsx,mjs,ts,tsx}",
      "/front/layers/@liberty-landing-cms/api/src/components/**/*.{vue,js,jsx,mjs,ts,tsx}",
      "/front/layers/@liberty-landing-cms/api/src/layouts/**/*.{vue,js,jsx,mjs,ts,tsx}",
      "/front/layers/@liberty-landing-cms/api/src/pages/**/*.{vue,js,jsx,mjs,ts,tsx}",
      "/front/layers/@liberty-landing-cms/api/src/plugins/**/*.{js,ts,mjs}",
      "/front/layers/@liberty-landing-cms/api/src/composables/**/*.{js,ts,mjs}",
      "/front/layers/@liberty-landing-cms/api/src/composables/**/*.{js,ts,mjs}",
      "/front/layers/@liberty-landing-cms/api/src/composables/**/*.{js,ts,mjs}",
      "/front/layers/@liberty-landing-cms/api/src/composables/**/*.{js,ts,mjs}",
      "/front/layers/@liberty-landing-cms/api/src/composables/**/*.{js,ts,mjs}",
      "/front/layers/@liberty-landing-cms/api/src/composables/**/*.{js,ts,mjs}",
      "/front/layers/@liberty-landing-cms/api/src/composables/**/*.{js,ts,mjs}",
      "/front/layers/@liberty-landing-cms/api/src/composables/**/*.{js,ts,mjs}",
      "/front/layers/@liberty-landing-cms/api/src/composables/**/*.{js,ts,mjs}",
      "/front/layers/@liberty-landing-cms/api/src/composables/**/*.{js,ts,mjs}",
      "/front/layers/@liberty-landing-cms/api/composables/**/*.{js,ts,mjs}",
      "/front/layers/@liberty-landing-cms/api/utils/**/*.{js,ts,mjs}",
      "/front/layers/@liberty-landing-cms/api/{A,a}pp.{vue,js,jsx,mjs,ts,tsx}",
      "/front/layers/@liberty-landing-cms/api/{E,e}rror.{vue,js,jsx,mjs,ts,tsx}",
      "/front/layers/@liberty-landing-cms/api/app.config.{js,ts,mjs}",
      "/front/layers/@liberty-landing-cms/core/components/**/*.{vue,js,jsx,mjs,ts,tsx}",
      "/front/layers/@liberty-landing-cms/core/src/components/**/*.{vue,js,jsx,mjs,ts,tsx}",
      "/front/layers/@liberty-landing-cms/core/src/layouts/**/*.{vue,js,jsx,mjs,ts,tsx}",
      "/front/layers/@liberty-landing-cms/core/src/pages/**/*.{vue,js,jsx,mjs,ts,tsx}",
      "/front/layers/@liberty-landing-cms/core/src/plugins/**/*.{js,ts,mjs}",
      "/front/layers/@liberty-landing-cms/core/src/composables/**/*.{js,ts,mjs}",
      "/front/layers/@liberty-landing-cms/core/src/composables/**/*.{js,ts,mjs}",
      "/front/layers/@liberty-landing-cms/core/src/composables/**/*.{js,ts,mjs}",
      "/front/layers/@liberty-landing-cms/core/src/composables/**/*.{js,ts,mjs}",
      "/front/layers/@liberty-landing-cms/core/src/composables/**/*.{js,ts,mjs}",
      "/front/layers/@liberty-landing-cms/core/src/composables/**/*.{js,ts,mjs}",
      "/front/layers/@liberty-landing-cms/core/src/composables/**/*.{js,ts,mjs}",
      "/front/layers/@liberty-landing-cms/core/src/composables/**/*.{js,ts,mjs}",
      "/front/layers/@liberty-landing-cms/core/src/composables/**/*.{js,ts,mjs}",
      "/front/layers/@liberty-landing-cms/core/src/composables/**/*.{js,ts,mjs}",
      "/front/layers/@liberty-landing-cms/core/composables/**/*.{js,ts,mjs}",
      "/front/layers/@liberty-landing-cms/core/utils/**/*.{js,ts,mjs}",
      "/front/layers/@liberty-landing-cms/core/{A,a}pp.{vue,js,jsx,mjs,ts,tsx}",
      "/front/layers/@liberty-landing-cms/core/{E,e}rror.{vue,js,jsx,mjs,ts,tsx}",
      "/front/layers/@liberty-landing-cms/core/app.config.{js,ts,mjs}",
      "/front/app/components/**/*.{vue,js,jsx,mjs,ts,tsx}",
      "/front/layers/@liberty-landing-cms/core/src/components/**/*.{vue,js,jsx,mjs,ts,tsx}",
      "/front/layers/@liberty-landing-cms/api/src/components/**/*.{vue,js,jsx,mjs,ts,tsx}",
      "/front/layers/@liberty-landing-cms/client/src/components/**/*.{vue,js,jsx,mjs,ts,tsx}",
      "/front/layers/@liberty-landing-cms/licence/src/components/**/*.{vue,js,jsx,mjs,ts,tsx}",
      "/front/layers/@liberty-landing-cms/media/src/components/**/*.{vue,js,jsx,mjs,ts,tsx}",
      "/front/layers/@liberty-landing-cms/project/src/components/**/*.{vue,js,jsx,mjs,ts,tsx}",
      "/front/layers/@liberty-landing-cms/website/src/components/**/*.{vue,js,jsx,mjs,ts,tsx}",
      "/front/layers/@liberty-landing-clients/monlabel_fr/base/src/components/**/*.{vue,js,jsx,mjs,ts,tsx}",
      "/front/layers/@liberty-landing-clients/tech_liberty/base/src/components/**/*.{vue,js,jsx,mjs,ts,tsx}",
      "/front/app/src/layouts/**/*.{vue,js,jsx,mjs,ts,tsx}",
      "/front/app/src/pages/**/*.{vue,js,jsx,mjs,ts,tsx}",
      "/front/app/src/plugins/**/*.{js,ts,mjs}",
      "/front/app/src/composables/**/*.{js,ts,mjs}",
      "/front/app/src/composables/**/*.{js,ts,mjs}",
      "/front/app/src/composables/**/*.{js,ts,mjs}",
      "/front/app/src/composables/**/*.{js,ts,mjs}",
      "/front/app/src/composables/**/*.{js,ts,mjs}",
      "/front/app/src/composables/**/*.{js,ts,mjs}",
      "/front/app/src/composables/**/*.{js,ts,mjs}",
      "/front/app/src/composables/**/*.{js,ts,mjs}",
      "/front/app/src/composables/**/*.{js,ts,mjs}",
      "/front/app/composables/**/*.{js,ts,mjs}",
      "/front/app/utils/**/*.{js,ts,mjs}",
      "/front/app/{A,a}pp.{vue,js,jsx,mjs,ts,tsx}",
      "/front/app/{E,e}rror.{vue,js,jsx,mjs,ts,tsx}",
      "/front/app/app.config.{js,ts,mjs}"
    ],
    "theme": {
      "extend": {
        "maxWidth": {
          "1/4": "25%",
          "1/2": "50%",
          "3/4": "75%"
        },
        "@container": "container-type: inline-size;",
        "size-full": "container-type: inline-size;"
      },
      "colors": {
        "inherit": "inherit",
        "current": "currentColor",
        "transparent": "transparent",
        "black": "#000",
        "white": "#fff",
        "slate": {
          "50": "#f8fafc",
          "100": "#f1f5f9",
          "200": "#e2e8f0",
          "300": "#cbd5e1",
          "400": "#94a3b8",
          "500": "#64748b",
          "600": "#475569",
          "700": "#334155",
          "800": "#1e293b",
          "900": "#0f172a",
          "950": "#020617"
        },
        "gray": {
          "50": "#f9fafb",
          "100": "#f3f4f6",
          "200": "#e5e7eb",
          "300": "#d1d5db",
          "400": "#9ca3af",
          "500": "#6b7280",
          "600": "#4b5563",
          "700": "#374151",
          "800": "#1f2937",
          "900": "#111827",
          "950": "#030712"
        },
        "zinc": {
          "50": "#fafafa",
          "100": "#f4f4f5",
          "200": "#e4e4e7",
          "300": "#d4d4d8",
          "400": "#a1a1aa",
          "500": "#71717a",
          "600": "#52525b",
          "700": "#3f3f46",
          "800": "#27272a",
          "900": "#18181b",
          "950": "#09090b"
        },
        "neutral": {
          "50": "#fafafa",
          "100": "#f5f5f5",
          "200": "#e5e5e5",
          "300": "#d4d4d4",
          "400": "#a3a3a3",
          "500": "#737373",
          "600": "#525252",
          "700": "#404040",
          "800": "#262626",
          "900": "#171717",
          "950": "#0a0a0a"
        },
        "stone": {
          "50": "#fafaf9",
          "100": "#f5f5f4",
          "200": "#e7e5e4",
          "300": "#d6d3d1",
          "400": "#a8a29e",
          "500": "#78716c",
          "600": "#57534e",
          "700": "#44403c",
          "800": "#292524",
          "900": "#1c1917",
          "950": "#0c0a09"
        },
        "red": {
          "50": "#fef2f2",
          "100": "#fee2e2",
          "200": "#fecaca",
          "300": "#fca5a5",
          "400": "#f87171",
          "500": "#ef4444",
          "600": "#dc2626",
          "700": "#b91c1c",
          "800": "#991b1b",
          "900": "#7f1d1d",
          "950": "#450a0a"
        },
        "orange": {
          "50": "#fff7ed",
          "100": "#ffedd5",
          "200": "#fed7aa",
          "300": "#fdba74",
          "400": "#fb923c",
          "500": "#f97316",
          "600": "#ea580c",
          "700": "#c2410c",
          "800": "#9a3412",
          "900": "#7c2d12",
          "950": "#431407"
        },
        "amber": {
          "50": "#fffbeb",
          "100": "#fef3c7",
          "200": "#fde68a",
          "300": "#fcd34d",
          "400": "#fbbf24",
          "500": "#f59e0b",
          "600": "#d97706",
          "700": "#b45309",
          "800": "#92400e",
          "900": "#78350f",
          "950": "#451a03"
        },
        "yellow": {
          "50": "#fefce8",
          "100": "#fef9c3",
          "200": "#fef08a",
          "300": "#fde047",
          "400": "#facc15",
          "500": "#eab308",
          "600": "#ca8a04",
          "700": "#a16207",
          "800": "#854d0e",
          "900": "#713f12",
          "950": "#422006"
        },
        "lime": {
          "50": "#f7fee7",
          "100": "#ecfccb",
          "200": "#d9f99d",
          "300": "#bef264",
          "400": "#a3e635",
          "500": "#84cc16",
          "600": "#65a30d",
          "700": "#4d7c0f",
          "800": "#3f6212",
          "900": "#365314",
          "950": "#1a2e05"
        },
        "green": {
          "50": "#f0fdf4",
          "100": "#dcfce7",
          "200": "#bbf7d0",
          "300": "#86efac",
          "400": "#4ade80",
          "500": "#22c55e",
          "600": "#16a34a",
          "700": "#15803d",
          "800": "#166534",
          "900": "#14532d",
          "950": "#052e16"
        },
        "emerald": {
          "50": "#ecfdf5",
          "100": "#d1fae5",
          "200": "#a7f3d0",
          "300": "#6ee7b7",
          "400": "#34d399",
          "500": "#10b981",
          "600": "#059669",
          "700": "#047857",
          "800": "#065f46",
          "900": "#064e3b",
          "950": "#022c22"
        },
        "teal": {
          "50": "#f0fdfa",
          "100": "#ccfbf1",
          "200": "#99f6e4",
          "300": "#5eead4",
          "400": "#2dd4bf",
          "500": "#14b8a6",
          "600": "#0d9488",
          "700": "#0f766e",
          "800": "#115e59",
          "900": "#134e4a",
          "950": "#042f2e"
        },
        "cyan": {
          "50": "#ecfeff",
          "100": "#cffafe",
          "200": "#a5f3fc",
          "300": "#67e8f9",
          "400": "#22d3ee",
          "500": "#06b6d4",
          "600": "#0891b2",
          "700": "#0e7490",
          "800": "#155e75",
          "900": "#164e63",
          "950": "#083344"
        },
        "sky": {
          "50": "#f0f9ff",
          "100": "#e0f2fe",
          "200": "#bae6fd",
          "300": "#7dd3fc",
          "400": "#38bdf8",
          "500": "#0ea5e9",
          "600": "#0284c7",
          "700": "#0369a1",
          "800": "#075985",
          "900": "#0c4a6e",
          "950": "#082f49"
        },
        "blue": {
          "50": "#eff6ff",
          "100": "#dbeafe",
          "200": "#bfdbfe",
          "300": "#93c5fd",
          "400": "#60a5fa",
          "500": "#3b82f6",
          "600": "#2563eb",
          "700": "#1d4ed8",
          "800": "#1e40af",
          "900": "#1e3a8a",
          "950": "#172554"
        },
        "indigo": {
          "50": "#eef2ff",
          "100": "#e0e7ff",
          "200": "#c7d2fe",
          "300": "#a5b4fc",
          "400": "#818cf8",
          "500": "#6366f1",
          "600": "#4f46e5",
          "700": "#4338ca",
          "800": "#3730a3",
          "900": "#312e81",
          "950": "#1e1b4b"
        },
        "violet": {
          "50": "#f5f3ff",
          "100": "#ede9fe",
          "200": "#ddd6fe",
          "300": "#c4b5fd",
          "400": "#a78bfa",
          "500": "#8b5cf6",
          "600": "#7c3aed",
          "700": "#6d28d9",
          "800": "#5b21b6",
          "900": "#4c1d95",
          "950": "#2e1065"
        },
        "purple": {
          "50": "#faf5ff",
          "100": "#f3e8ff",
          "200": "#e9d5ff",
          "300": "#d8b4fe",
          "400": "#c084fc",
          "500": "#a855f7",
          "600": "#9333ea",
          "700": "#7e22ce",
          "800": "#6b21a8",
          "900": "#581c87",
          "950": "#3b0764"
        },
        "fuchsia": {
          "50": "#fdf4ff",
          "100": "#fae8ff",
          "200": "#f5d0fe",
          "300": "#f0abfc",
          "400": "#e879f9",
          "500": "#d946ef",
          "600": "#c026d3",
          "700": "#a21caf",
          "800": "#86198f",
          "900": "#701a75",
          "950": "#4a044e"
        },
        "pink": {
          "50": "#fdf2f8",
          "100": "#fce7f3",
          "200": "#fbcfe8",
          "300": "#f9a8d4",
          "400": "#f472b6",
          "500": "#ec4899",
          "600": "#db2777",
          "700": "#be185d",
          "800": "#9d174d",
          "900": "#831843",
          "950": "#500724"
        },
        "rose": {
          "50": "#fff1f2",
          "100": "#ffe4e6",
          "200": "#fecdd3",
          "300": "#fda4af",
          "400": "#fb7185",
          "500": "#f43f5e",
          "600": "#e11d48",
          "700": "#be123c",
          "800": "#9f1239",
          "900": "#881337",
          "950": "#4c0519"
        },
        "lightBlue": {
          "50": "#f0f9ff",
          "100": "#e0f2fe",
          "200": "#bae6fd",
          "300": "#7dd3fc",
          "400": "#38bdf8",
          "500": "#0ea5e9",
          "600": "#0284c7",
          "700": "#0369a1",
          "800": "#075985",
          "900": "#0c4a6e",
          "950": "#082f49"
        },
        "warmGray": {
          "50": "#fafaf9",
          "100": "#f5f5f4",
          "200": "#e7e5e4",
          "300": "#d6d3d1",
          "400": "#a8a29e",
          "500": "#78716c",
          "600": "#57534e",
          "700": "#44403c",
          "800": "#292524",
          "900": "#1c1917",
          "950": "#0c0a09"
        },
        "trueGray": {
          "50": "#fafafa",
          "100": "#f5f5f5",
          "200": "#e5e5e5",
          "300": "#d4d4d4",
          "400": "#a3a3a3",
          "500": "#737373",
          "600": "#525252",
          "700": "#404040",
          "800": "#262626",
          "900": "#171717",
          "950": "#0a0a0a"
        },
        "coolGray": {
          "50": "#f9fafb",
          "100": "#f3f4f6",
          "200": "#e5e7eb",
          "300": "#d1d5db",
          "400": "#9ca3af",
          "500": "#6b7280",
          "600": "#4b5563",
          "700": "#374151",
          "800": "#1f2937",
          "900": "#111827",
          "950": "#030712"
        },
        "blueGray": {
          "50": "#f8fafc",
          "100": "#f1f5f9",
          "200": "#e2e8f0",
          "300": "#cbd5e1",
          "400": "#94a3b8",
          "500": "#64748b",
          "600": "#475569",
          "700": "#334155",
          "800": "#1e293b",
          "900": "#0f172a",
          "950": "#020617"
        },
        "liberty-landing-p": {
          "100": "#EAE7F3",
          "300": "#BEB3DB",
          "600": "#917FC2",
          "900": "#6750A7",
          "90030": "rgba(103, 80, 167, 0.30)"
        },
        "liberty-landing-ap": {
          "100": "#F3E7EC",
          "300": "#DBB3C3",
          "600": "#C27F9B",
          "900": "#A75074"
        },
        "liberty-landing-n": {
          "0": {
            "light": "#0F0E10",
            "DEFAULT": "#FFFFFF",
            "dark": "#FFFFFF"
          },
          "15": {
            "light": "rgba(15, 14, 16, 0.15)",
            "DEFAULT": "rgba(255, 255, 255, 0.15)",
            "dark": "rgba(255, 255, 255, 0.15)"
          },
          "100": {
            "light": "#29262C",
            "DEFAULT": "#E8E7EA",
            "dark": "#E8E7EA"
          },
          "200": {
            "light": "#423E47",
            "DEFAULT": "#C2BEC6",
            "dark": "#C2BEC6"
          },
          "300": {
            "light": "#5C5662",
            "DEFAULT": "#A8A3AE",
            "dark": "#A8A3AE"
          },
          "400": {
            "light": "#756D7D",
            "DEFAULT": "#8F8796",
            "dark": "#8F8796"
          },
          "500": {
            "light": "#8F8796",
            "DEFAULT": "#756D7D",
            "dark": "#756D7D"
          },
          "600": {
            "light": "#A8A3AE",
            "DEFAULT": "#5C5662",
            "dark": "#5C5662"
          },
          "700": {
            "light": "#C2BEC6",
            "DEFAULT": "#423E47",
            "dark": "#423E47"
          },
          "800": {
            "light": "#E8E7EA",
            "DEFAULT": "#29262C",
            "dark": "#29262C"
          },
          "900": {
            "light": "#FFFFFF",
            "DEFAULT": "#0F0E10",
            "dark": "#0F0E10"
          },
          "90025": {
            "light": "rgba(255, 255, 255, .25)",
            "DEFAULT": "rgba(15, 14, 16, .25)",
            "dark": "rgba(15, 14, 16, .25)"
          },
          "90090": {
            "light": "rgba(255, 255, 255, 0.90)",
            "DEFAULT": "rgba(15, 14, 16, .90)",
            "dark": "rgba(15, 14, 16, .90)"
          }
        }
      },
      "screens": {
        "sm": "600px",
        "md": "960px",
        "lg": "1280px",
        "xl": "1920px",
        "2xl": "2560px"
      }
    },
    "plugins": [{
        "config": {
          "variants": {
            "extend": {
              "backgroundColor": [
                "disabled"
              ],
              "cursor": ["disabled",
                "important"
              ],
              "borderColor": [
                "disabled"
              ],
              "height": ["h", "v",
                "rtl"
              ],
              "width": ["h", "v",
                "rtl"
              ],
              "inset": ["h", "v",
                "h-txt-rtl",
                "merge-h",
                "merge-v", "rtl"
              ],
              "translate": ["h", "v",
                "merge-h", "merge-v"
              ],
              "transitionProperty": [
                "tap"
              ],
              "transitionDuration": [
                "tap"
              ],
              "display": ["tt-focus",
                "tt-focused",
                "tt-drag",
                "tt-dragging"
              ],
              "opacity": ["ghost",
                "disabled",
                "checked",
                "info-group-hover",
                "list-group-hover"
              ],
              "pointerEvents": [
                "disabled"
              ],
              "borderRadius": [
                "important"
              ],
              "borderWidth": [
                "important"
              ],
              "transform": ["focus"],
              "scale": ["focus"],
              "brightness": ["hover"],
              "gap": ["important"],
              "padding": ["rtl"],
              "margin": ["rtl"]
            }
          },
          "theme": {
            "extend": {
              "zIndex": {
                "1": 1,
                "2": 2,
                "3": 3,
                "4": 4,
                "5": 5,
                "6": 6,
                "7": 7,
                "8": 8,
                "9": 9,
                "999": 999,
                "1000": 1000
              },
              "margin": {
                "0.75": "0.1875rem",
                "1/10": "10%"
              },
              "padding": {
                "0.25": "0.0625rem",
                "0.75": "0.1875rem",
                "1.25": "0.3125rem",
                "1.75": "0.4375rem",
                "2.25": "0.5625rem",
                "2.75": "0.6875rem"
              },
              "width": {
                "0.25": "0.0625rem",
                "0.75": "0.1875rem",
                "1.25": "0.3125rem",
                "1.75": "0.4375rem",
                "2.25": "0.5625rem",
                "2.75": "0.6875rem",
                "3.5": "0.875rem",
                "4.5": "1.125rem",
                "1/10": "10%"
              },
              "height": {
                "0.25": "0.0625rem",
                "0.75": "0.1875rem",
                "1.25": "0.3125rem",
                "1.75": "0.4375rem",
                "2.25": "0.5625rem",
                "2.75": "0.6875rem",
                "3.5": "0.875rem",
                "4.5": "1.125rem",
                "8.5": "2.125rem",
                "9.5": "2.375rem",
                "11.5": "2.875rem",
                "1/10": "10%"
              },
              "minWidth": {
                "5": "1.25rem"
              },
              "inset": {
                "-1.25": "-0.3125rem"
              },
              "outline": {
                "zero": [
                  "0px solid var(--vf-ring-color)",
                  "0px"
                ]
              },
              "lineHeight": {
                "px": "1px"
              },
              "transitionProperty": {
                "input": "box-shadow, color, background-color, border-color"
              },
              "borderOpacity": {
                "15": "0.15"
              },
              "fontSize": {
                "0.5xs": ["0.6875rem",
                  {
                    "lineHeight": "0.875rem"
                  }
                ],
                "0.5sm": ["0.8125rem",
                  {
                    "lineHeight": "1.125rem"
                  }
                ]
              },
              "backgroundImage": {}
            }
          }
        }], "_hash": "1717145310585"
    }

I use max-w-sm everywhere but for exemple you can take this out:

In a layer core under /front/layers/cms/core/src/components/ui/popovers/Popover.vue

My app is like that :

/front/app [main app who load the layers]
/front/layers/cms/core [core layer]
/front/layers/cms/layer2 [logical layer]

nuxt.config.ts: 

const layers = [
 '/front/layers/cms/core',
 '/front/layers/cms/layer2'
]

export default defineNuxtConfig({
  devtools: { enabled: true },

  devServer: {
    port: 3050
  },

  extends: layers,
  
  vite: {
    server: {
      watch: {
        usePolling: true,
        interval: 1000,
        ignored: [
            '**/node_modules/**',
            '**/tailwindcss/**',
        ],
      }
    },
  },

  modules: [
    '@nuxtjs/tailwindcss',
    '@vueform/nuxt',
    '@nuxtjs/sitemap',
  ],
  
  }

All the app is under a docker compose containers but i don't have shared .nuxt with my host and container (maybe a trouble to have autocomplete in my IDE)

If you need more info ask me, thanks ☺️

@ineshbose
Copy link
Collaborator

I see there's

      "/front/layers/@liberty-landing-cms/core/components/**/*.{vue,js,jsx,mjs,ts,tsx}",
      "/front/layers/@liberty-landing-cms/core/src/components/**/*.{vue,js,jsx,mjs,ts,tsx}",

in the content configuration.

/front/layers/cms/core/src/components/ui/popovers/Popover.vue is the directory meant to be @liberty-landing-cms?

You mention using Docker environments too, so I wonder if it may be related to this too - #695

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
question Further information is requested
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
2 participants
@Layenzz @ineshbose