Skip to content

[v4] Tailwind fails to compile if there is no parent directory #15987

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Closed
eirikhanasand opened this issue Jan 29, 2025 · 1 comment · Fixed by #15988
Closed

[v4] Tailwind fails to compile if there is no parent directory #15987

eirikhanasand opened this issue Jan 29, 2025 · 1 comment · Fixed by #15988
Assignees

Comments

@eirikhanasand
Copy link

eirikhanasand commented Jan 29, 2025

What version of Tailwind CSS are you using?
v4

What build tool (or framework if it abstracts the build tool) are you using?
Nextjs 15.6.1

What version of Node.js are you using?
v22.9.0

What browser are you using?
N/A

What operating system are you using?
macOS but running in Docker with node:alpine

Reproduction URL
All thats required is tailwind v4 and a Dockerfile without a WORKDIR. Ive created a public repo that showcases the issue.
https://github.com/eirikhanasand/tailwindnoparentdirbug

Describe your issue
When using tailwindcss in a Docker container without a WORKDIR statement tailwind will panic at crates/oxide/src/scanner/detect_sources.rs:117:78 due to calling Option::unwrap() on a None value as it fails to find a parent directory:

if forced_static_directories.contains(&entry.path().parent().unwrap().to_path_buf())

 > [tailwindnoparentdirbug 8/8] RUN npm run build:                                                                                                                                              
0.165                                                                                                                                                                            
0.165 > tailwindnoparentdirbug@0.1.0 build                                                                                                                                                      
0.165 > next build                                                                                                                                                               
0.165                                                                                                                                                                            
0.687 Attention: Next.js now collects completely anonymous telemetry regarding usage.
0.688 This information is used to shape Next.js' roadmap and prioritize features.
0.688 You can learn more, including how to opt-out if you'd not like to participate in this anonymous program, by visiting the following URL:
0.688 https://nextjs.org/telemetry
0.688 
0.791     Next.js 15.1.6
0.791 
0.853    Creating an optimized production build ...
9.142 thread '<unnamed>' panicked at crates/oxide/src/scanner/detect_sources.rs:117:78:
9.142 called `Option::unwrap()` on a `None` value
9.142 note: run with `RUST_BACKTRACE=1` environment variable to display a backtrace
9.146 fatal runtime error: failed to initiate panic, error 2908277840
[+] Running 0/1rker exited with code: null and signal: SIGABRT
  Service tailwindnoparentdirbug  Building                                                                                                                                         10.4s 
failed to solve: process "/bin/sh -c npm run build" did not complete successfully: exit code: 1
@eirikhanasand eirikhanasand changed the title Tailwind fails to compile if there is no parent directory [v4] Tailwind fails to compile if there is no parent directory Jan 29, 2025
@RobinMalfait RobinMalfait self-assigned this Jan 29, 2025
@RobinMalfait
Copy link
Member

Hey!

Thanks for the issue and the PR, this will be available in the next release.

DenysKarmazynDFINITY added a commit to dfinity/oisy-wallet that referenced this issue Feb 20, 2025
# Motivation

## Problem
After migrating to Tailwind 4, building OISY via Docker was no longer
possible due to the issue on the screenshot below. Investigation showed
that there was a problem with transforming files that contain tailwind
classes. [The function that was throwing the
error](https://github.com/tailwindlabs/tailwindcss/blob/main/crates/oxide/src/scanner/allowed_paths.rs#L111)
implied that we somehow try to parse some unexpected by tailwind files.
Also, there were [some
complains](tailwindlabs/tailwindcss#15987) on
the exact same issue recently.

<img width="573" alt="Screenshot 2025-02-19 at 18 28 41"
src="https://github.com/user-attachments/assets/b8be362a-3d52-44b8-ab4a-bfa3cdef2641"
/>

## Solution
Apparently, the previous way of specifying content for parsing in
Tailwind.config file doesn't work in the 4th version. Instead, we need
to set [the base
path](https://tailwindcss.com/docs/detecting-classes-in-source-files#setting-your-base-path)
when importing tailwindcss module. After adding the `source` directive,
`npm run build` works in both local and Docker environment. Also, it
explains why we suddenly started seeing CSS warning that were coming
from `e2e` folder - Tailwind was trying to process files outside of
`src`.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging a pull request may close this issue.

2 participants