CSS is not loading while running Radiant template

[manish-baghel]

What component (if applicable)

• URL for category: https://tailwindui.com/templates/radiant

Describe the bug

1. I downloaded the Radiant template, ran npm start, setup sanity as stated in the README and ran npm run dev but there seems to be an issue with the css and it's not loading.

2. Additionally, npm run build fails in the typescript version with the following error

➜ npm run build

> radiant@0.1.0 build
> next build

  ▲ Next.js 14.2.11
  - Environments: .env.local

   Creating an optimized production build ...
 ✓ Compiled successfully
   Linting and checking validity of types  .Failed to compile.

./src/sanity/lib/image.ts:2:10
Type error: 'SanityImageSource' is a type and must be imported using a type-only import when 'verbatimModuleSyntax' is enabled.

  1 | import createImageUrlBuilder from '@sanity/image-url'
> 2 | import { SanityImageSource } from "@sanity/image-url/lib/types/types";
    |          ^
  3 |
  4 | import { dataset, projectId } from '../env'
  5 |

To Reproduce
Steps to reproduce the behavior:

1. Download Radiant template
2. Run either radiant-js or ts template
3. Navigate to http://localhost:3000
4. See error

Expected behavior
CSS should load and it should look exactly like the demo

Screenshots
This is how it looks like after following the README steps

Browser/Device (if applicable)

• OS: Manjaro(Arch) with i3 WM
• Browser Google Chrome
• Version Version 131.0.6778.85 (Official Build) (64-bit)

Additional context

➜ npm --version
10.5.0
➜ node --version
v21.7.1

Please refer to package-lock.json file for module versions
package-lock.json

[thecrypticace]

Hey, I'm not seeing this here. I:

• Downloaded the template
• Extracted the zip file
• Switched to Node v21.7.1 to match your environment
• Went into both radiant-ts or radiant-js and did the following per the readme:
• npm install
• npm create sanity@latest -- --env=.env.local --create-project "Radiant Blog" --dataset production
• npm run dev

And it seemed to work in both projects. The TypeScript error you're getting is interesting though. The code in our project has a import type and the file path looks a bit different.

I wonder if Sanity scaffolded something in the project. What options did you use to set it up?

[manish-baghel]

@thecrypticace
I think the issue is beacuse of .gitignore

I had a .gitignore file in my home directory

* <- issue

after deleting gitgnore from all parent directories, it worked.

The issue is limited to Tailwind v4

[manish-baghel]

Fixed with tailwindlabs/tailwindcss#15941