TailwindCSS compiler not working as expected

Unanswered

kaizer posted this in #help-forum

2023-09-25T18:28:02.000Z

Hello ðŸ‘‹

I'm having an issue with NextJS 13.5.3 and tailwindcss compiler.
My http://localhost:3000/panel work fine it compiles and loads all components as expected but landing page sometimes compiles sometimes not.

8 Replies

kaizerOP

2023-09-25T18:28:24.000Z

This is how it should look like :

Panel:

With

npm run build && npm start

landing page works fine but when I run it with

npm run dev

it doesn't work

i get :

tailwind.config.js:

import type { Config } from 'tailwindcss'
const { nextui } = require("@nextui-org/react");

const config: Config = {
  content: [
    './components/**/*.{js,ts,jsx,tsx,mdx}',
    './app/**/*.{js,ts,jsx,tsx,mdx}',

    "./node_modules/@nextui-org/theme/dist/**/*.{js,ts,jsx,tsx}",
  ],
  theme: {
    screens: {
      xs: '320px',
      sm: '480px',
      md: '768px',
      lg: '976px',
      xl: '1440px'
    },
    extend: {
      colors: {
        panelBackground: "#1F2136",
        cardColor: "#282343",
        ultraViolet: "#5F4F7F",
        royalPurple: "#7449A0",
        lavender: "#B67AE4",

        primaryColor: "#A78BFA",
        secondaryColor: "#7d54f8",
        whiteSoft: "#F7EBFF",
        greenSoft: "#005243"
      },
      fontFamily: {
        'lexend': ['Lexend', 'sans-serif']
      },
      backgroundImage: {
        'gradient-radial': 'radial-gradient(var(--tw-gradient-stops))',
        'gradient-conic':
          'conic-gradient(from 180deg at 50% 50%, var(--tw-gradient-stops))',
      },
    },
  },
  darkMode: "class",
  plugins: [nextui()],
}
export default config

Folder structure:

Layout file

globals.css