vuelessjs / vueless

Vue Styleless UI Component Library, powered by Tailwind CSS 💚
https://vueless.com
MIT License
7 stars 1 forks source link

The components are presented without design at all #205

Open meirlamdan opened 1 month ago

meirlamdan commented 1 month ago

I installed the library The components appear But without any design

I get a warning about tailwind-merge image

Is it maybe because the configuration of tailwind-merge is not compatible with the current version?

itsJohnnyGrid commented 1 month ago

Hi, @meirlamdan could you try to install the latest version of the packages and check if the issue still present:

And also provide more details about your environment / package manager etc.

And please check this alsо: https://docs.vueless.com/#minimal-requirements

meirlamdan commented 1 month ago

"@vueless/plugin-vite": "^0.0.74", "vueless": "^0.0.433"

Operating System: Windows IDE/Text Editor: Visual Studio Code (VSC) Shell: Bash Package Manager: npm

meirlamdan commented 1 month ago

The mistake was that I left the default setting in tailwind.config.js

content: [
    "./index.html",
    "./src/**/*.{vue,js,ts,jsx,tsx}",
  ], theme: {
    extend: {},
  },

Maybe it should be highlighted in the documents

itsJohnnyGrid commented 1 month ago

@meirlamdan I guess you forgot to add vuelessPreset into your tailwind.config.js. See step 3 in the docs here. This config already set there to make the configuration more easier.

If the issue persists after that, please let us know.

meirlamdan commented 1 month ago

I set it right But I also left the section below

content: [
    "./index.html",
    "./src/**/*.{vue,js,ts,jsx,tsx}",
  ], theme: {
    extend: {},
  },
itsJohnnyGrid commented 1 month ago

I set it right But I also left the section below

content: [
    "./index.html",
    "./src/**/*.{vue,js,ts,jsx,tsx}",
  ], theme: {
    extend: {},
  },

Could you share the full file of your tailwind.config file please?

meirlamdan commented 1 month ago
/** @type {import('tailwindcss').Config} */
import { vuelessPreset } from "vueless/preset.tailwind.js";

export default {
  presets: [vuelessPreset],
  content: [
    "./index.html",
    "./src/**/*.{vue,js,ts,jsx,tsx}",
  ]
}

If I don't remove these lines:

  content: [
    "./index.html",
    "./src/**/*.{vue,js,ts,jsx,tsx}",
  ],

then there is the problem

itsJohnnyGrid commented 1 month ago

@meirlamdan I'll double check this and let you know, thanks. By default it should work without content config property.