CSS not loaded in local environment

[Dexalt142]

Hello, I forked this repo and cloned it into my computer and ran yarn install. All deps installed and yarn.lock hasn't been affected.
After all the deps are installed I ran yarn dev. Files built, development started with no errors.

The issue is every time I opened localhost:4000 in my browser the CSS is not loaded. Are there any steps that I missed? Thanks.

[smarroufin]

Hi @Dexalt142
I can't reproduce it and have never experienced that.
Are you on main branch and are you sure you have no changes? I would suggest removing node_modules/, .nuxt/ and retrying yarn ; yarn dev 🤷

Anyone else having this issue?

[felipe-heredia]

Hi @Dexalt142
Can you tell us more about your development environment?

• Which browser were you using and the version
• Node/npm and yarn version
• What operating system are you using
• Does your browser have any extensions that you suspect are blocking CSS?
• Your terminal doesn't show any error?

[Dexalt142]

Hi @Dexalt142 I can't reproduce it and have never experienced that. Are you on main branch and are you sure you have no changes? I would suggest removing node_modules/, .nuxt/ and retrying yarn ; yarn dev 🤷

Anyone else having this issue?

Yes I'm on main branch and I have no changes. Already tried removing node_modules/, .nuxt/ and ran yarn install, yarn dev several times but still no luck.

[Dexalt142]

Hi @Dexalt142 Can you tell us more about your development environment?

• Which browser were you using and the version
• Node/npm and yarn version
• What operating system are you using
• Does your browser have any extensions that you suspect are blocking CSS?
• Your terminal doesn't show any error?

• Google Chrome 97.0.4692.71 and Microsoft Edge 97.0.1072.62
• Node 14.17.4 and Yarn 1.22.17
• Windows 10 21H1
• Nope
• No warnings and no errors

[felipe-heredia]

@Dexalt142 try upgrading your node version to LTS.

[Dexalt142]

@felipesuri Node upgraded to LTS version, installed the deps using npm install instead of yarn install. Unfortunately, I still got the same issue.

[felipe-heredia]

@Dexalt142 With the LTS version, exclude the folder and clone again, and install dependencies with yarn.

[Dexalt142]

@felipesuri Cloned the repository, I installed the dependencies both with npm install and yarn install, and the issue is still there. I also tried repeating the same process on the other machine and I still got the same issue 😕

[felipe-heredia]

@Dexalt142 This is so strange. When you run yarn dev and open the site in your browser, see what is on the console and if has an error, send a screenshot, please.

[smarroufin]

@Dexalt142 I actually thought of something. Do you have an .env file, copied from .env.example?
If not, please create it. The missing RECAPTCHA_SITE_KEY variable breaks partners pages.

But I guess this is not your issue. I re-cloned the repo and did not have any issues 😞

[felipe-heredia]

@smarroufin .env file is not the problem, because I tried here and worked without .env. I made the same steps from the description and worked.

Maybe the problem is with Windows, I really don't know.

[Dexalt142]

@smarroufin Yes, I have an .env file.

@felipesuri Yeah I tried this on 2 Windows machines and got the same result, Windows might be the problem.
And here is the screenshot of the browser console.

[felipe-heredia]

@Dexalt142 Can you try running the app on Firefox Browser?

[kevinmarrec]

@Dexalt142 Everything works fine for me on Windows 11 with WSL2.
I'm using Brave Browser wich is chromium-based.

Furthermore, I have exactly same outputs in my browser console.

Could you inspect an element (Right click => Inspect) that should be styled (any text should be fine) and check Styles panel ?

When it's working it says that the CSS classes are defined within a <style> tag, you can click on it and it jumps in the page html source code to show you where the CSS is defined.

If the CSS is here, it can be a browser issue, try disabling all extensions and also try with a different browser.
If the CSS isn't here, it's pretty hard to know yet what's going on right now without being able to reproduce it but we'll try our best to figure out with the information you provide.

[Dexalt142]

@felipesuri Firefox gives the same result

@kevinmarrec I compared local and nuxtjs.org version, and here are the results:
local

nuxtjs.org

[qq406601626]

I have the same problem😅

[yinqiangw]

I have the same problem😅