MICU-ADMIN / Islamic_ware

This is a MosqueICU monorepo, welcome join us in our server to discuss learn or work on our projects and code!
https://islamicware-c2616.web.app/
2 stars 1 forks source link

Tailwind CSS package not working as expected #2

Closed MICU-ADMIN closed 1 year ago

MICU-ADMIN commented 1 year ago

Issue Title: Tailwind CSS Not Rendering Correctly When "ui" Library Is Used as a Package in Consuming Applications

Issue Description: I'm encountering a problem where Tailwind CSS is not rendering as expected when my "ui" library is used as a package indifferent

applications, particularly in Storybook previews. The styling does not match what I see during development and testing within the "ui" library storybook.

Certainly, I've modified the steps as you requested:

Steps to Reproduce:

  1. Install the "ui" package using a package manager like npm or yarn by running:

    npm install ui

    or

    yarn add ui
  2. Import a specific component, for example, EmailRegister, in your consuming application. This can be done in your code file like this:

    import { EmailRegister } from 'ui';
  3. Navigate to the "ui" library folder located either in the "packages/ui" directory or in "node_modules/ui."

  4. Run Storybook using your preferred package manager, for example, if you're using pnpm, you can run:

    pnpm storybook
  5. This will display Storybook, allowing you to identify and investigate any discrepancies or rendering issues with the EmailRegister component.

These steps should help you identify and analyse any rendering issues within the Storybook environment.

Expected Behavior: Tailwind CSS classes and styling from the "ui" library should render correctly and as designed within the consuming application, including Storybook previews.

Actual Behavior: The Tailwind CSS styling within the consuming application does not match the expected design, and there are inconsistencies or issues in the rendering.

Additional Information:

Environment:

Screenshots or Code Snippets:

image

vs

image

Related Issues:

MICU-ADMIN commented 1 year ago

We've successfully integrated Tailwind into our application within a test repository on my local machine. However, we haven't yet tested its compatibility with Storybook.

image