CSS doesn't work

[hawkesburygeek]

I have run "yarn" and then "symfony serve". The demo site works but the style seems not to work. Is there anyone who can help me? Jesus Watts

[bocharsky-bw]

Try to run these commands:

$ bin/console assets:install
$ yarn install
$ yarn dev

If still not work, I'd recommend you to remove the repo and follow the instruction from readme: https://github.com/symfony/demo#installation

[Guikingone]

Hi 👋🏻

I can confirm the issue of @hawkesburygeek, in my case, I'm facing the issue when using Docker, if I decide to use the Symfony CLI, no issues but with Docker, the CSS is not used.

Could be the Nginx configuration but the files are not under a 404 error 🤔

[bocharsky-bw]

Hm, but this project does not provide any Docker configuration out of the box IIRC. Did you write that Docker setup yourself? If so, then in that case you're responsible for configuring it properly and it has nothing with this project to be reported

[Guikingone]

Yes, sorry for the context that I gave, when I first tried the symfony/demo, it was with the Symfony CLI then I've faced the same issue as the one described by @hawkesburygeek, same with Docker (in the end, the Docker issue was a configuration one).

The Docker configuration is fixed but with the Symfony CLI, I needed to update it before it works, strange situation here, maybe just a server configuration that trigger this kind of behaviour?

[stof]

I needed to update it before it works

updating what ? The symfony CLI ? Well, if you are not on the latest version of a tool, updating it is a prerequisite before reporting issues (as they might be fixed already).

[Guikingone]

Well, if you are not on the latest version of a tool, updating it is a prerequisite before reporting issues (as they might be fixed already).

As it wasn't a major or minor version that was "skipped", that wasn't the first thing that came in my mind regarding a server issue 🙂

[seb-jean]

@hawkesburygee, is it resolved?

[marksmanpilotcurler]

Hi all -- I also ran into this issue. I had used git clone to pull down the symfony/demo source from github. I now believe git was the issue. Apologies -- the below is from memory, I don't have all the of the filenames and locations, but I do remember what happened.

If the website runs, but the styles look all messed up, hit F12 in your browser  window, and look at either the console, or the error messages.   If you see "integrity violation" or similar, on 2 or 3 files, then what's happening to you is probably the same as what happened to me.   For completeness, I was developing in Windows10, using IntelliJ.

The newest version (PHP 8, SF6) of symfony demo uses integrity checking on some of the .js and .css files.   If the integrity check fails, it won't use the files, but since the php, apache, twig/other are still working, the website underneath still works.   It just looks terrible, because the .css and .js files aren't rendering (since they are disabled by the browser).   That this isn't really all that helpful for security is a discussion for elsewhere -- that's just what it does.

When I checked the integrity checksum in the symfony/demo, by using an online checker (https://www.srihash.org/), and passing the website URL for the raw version of the symfony/demo file, it MATCHED what the symfony demo had -- so what could be wrong -- they match!?!?!?!    The integrity checksum for the symfony demo is buried in some configuration file, but it's easy to find if you have an IDE -- put the output of the SRI Hash generator in the search box of your IDE, and it will pop out.

When I finally decided that there must be some small difference between the .css and .js files on my computer, and the ones on the website, I pulled up a Windows PowerShell, and downloaded those .css and .js files, one by one, using the curl command.   As I downloaded each file that was offending, I would re-run the website, and re-look in the browser, and sure enough, one-by-one, those integrity violations went away.

When I pulled that last file down, the demo website rendered.

 I hope it helps.
         Best....Doug

[stof]

if you are on Windows, make sure that your git is not configured to automatically convert LF line endings to CRLF (as such change would indeed invalidate checksums)

[javiereguiluz]

Let's close this old issue because we haven't received any other reports from users and looks like it could be some local misconfiguration. Thanks.