shadcn-ui / ui

Beautifully designed components that you can copy and paste into your apps. Accessible. Customizable. Open Source.
https://ui.shadcn.com
MIT License
75.14k stars 4.69k forks source link

[bug]: CLI `add` command breaks on comments in `tailwind.config.ts` #5459

Open lacymorrow opened 1 month ago

lacymorrow commented 1 month ago

Describe the bug

image

      fontFamily: {
        sans: [
          // "var(--font-sans)",
          "var(--font-geist-sans)",
          ...fontFamily.sans,
        ],
        serif: ["var(--font-serif)", ...fontFamily.serif],
      },

Became

        fontFamily: {
            sans: [\\n          // "var(--font-sans)",\\n          "var(--font-geist-sans)",\\n          ...fontFamily.sans,\\n        ],\n             serif: ["var(--font-serif)", ...fontFamily.serif]
        },

Affected component/components

CLI

How to reproduce

Install something with a comment at the top of the fontfamily in tailwind config:

npx shadcn@latest add sidebar-01 sidebar-02 sidebar-03 sidebar-04 sidebar-05 sidebar-06 sidebar-07 sidebar-08 sidebar-09 sidebar-10 sidebar-11 sidebar-12 sidebar-13 sidebar-14 sidebar-15

https://github.com/lacymorrow/juicy-stack/pull/2/files#diff-655dc9e3d0aa561e3fa164bf48bd89cb0f5da65e0a567f8ebbf9dd791a0e7f40

Codesandbox/StackBlitz link

No response

Logs

No response

System Info

Latest CLI

Before submitting

JMartinCollins commented 1 month ago

This also occurs with a fresh install of Remix and Shadcn. Just follow the official instructions to see.

I'm honestly a little confused about how to write this part correctly--

fontFamily: {
  sans: [
    '"var(--font-sans)"', // single and double quote
    '"Inter"',
    "ui-sans-serif",
    "system-ui",
    "sans-serif",
    '"Apple Color Emoji"',
    '"Segoe UI Emoji"',
    '"Segoe UI Symbol"',
    '"Noto Color Emoji"'
  ]
}

This is the only way (single quote+double quote) that works without manually adding a --font-sans variable to my tailwind.css file. Otherwise fonts are completely broken and it falls back to some system serif font.

adithyaharun commented 4 weeks ago

I think the only workaround is manually delete the \n stuff for now.

WalterGit commented 2 days ago

it is coming as line breaks "\n" whenever installing a new component or block