Is there a way to use SCSS in payload custom components while using tailwind in the frontend?

[linobino1]

Using @import '~payload/scss' in a .scss file that is being imported (maybe indirectly) in payload.config.ts raises an error:

Error: Can't find stylesheet to import.
    ╷
  1 │ @import "~payload/scss";
    │   

[linobino1]

A simple solution: Do not use @import "~payload/scss" 😆 it will still work

[linobino1]

Better solution: use @import 'payload/scss';, that gives you access to the payload variables/functions.

[xHomu]

The ~ tsconfig path alias tends to create compatibility issues like this, that's why a lot of Remix templates are moving toward using package.json alias instead:

https://github.com/epicweb-dev/epic-stack/blob/main/docs/decisions/026-path-aliases.md

I'll probably switch over once Typescript's adoption of this standard stabilize here microsoft/TypeScript#55015

[linobino1]

I see, thank you for the explanation!On 11 Feb 2024, at 21:13, xHomu ***@***.***> wrote: The ~ tsconfig path alias tends to create compatibility issues like this, that's why a lot of Remix templates are moving toward using package.json alias instead: https://github.com/epicweb-dev/epic-stack/blob/main/docs/decisions/026-path-aliases.md I'll probably switch over once Typescript's adoption of this standard stabilize here microsoft/TypeScript#55015 —Reply to this email directly, view it on GitHub, or unsubscribe.You are receiving this because you modified the open/close state.Message ID: ***@***.***>