search

statamic / starter-kit-cool-writings

Statamic Starter Kit: Cool Writings
https://statamic.com/starter-kits/statamic/cool-writings
107 stars 33 forks source link

failed to load a stylesheet from a url #47

Closed bub88 closed 9 months ago

bub88 commented 9 months ago

Problem with statamic starter-kit-cool-writings and ssg on netlify. After deploy my homepage the website have an error: “Failed to load resource: the server responded with a status of 404 ()".

website url

jasonvarga commented 9 months ago

Check your devtools console and network tab and you'll be able to see the issue.

You are serving the site at https://weltspot.netlify.app, but your assets are pointed at https://weltspot.com.

Make sure you have the appropriate URLs set in .env.

bub88 commented 9 months ago

I temporarily added a snippet for css and js in netlify, but that's just a stopgap solution. I guess I have to activate an addon for Vite.

jasonvarga commented 9 months ago

No addon needed. We have a tag. https://statamic.dev/tags/vite

bub88 commented 9 months ago

No addon needed. We have a tag. https://statamic.dev/tags/vite

What do I have to do then so that my homepage is generated correctly with SSG so that CSS and JS work?

jasonvarga commented 9 months ago

Set the right APP_URL in your .env

bub88 commented 9 months ago

Set the right APP_URL in your .env

I've tried everything possible. I also asked Netlify in the support forum. By the way, my main domain is weltspot.com. I suspect that SSG (Static Site Generator) cannot find the url for css and js exported by Vite. Which is also logical.

That's why I'm asking specifically. How to turn off or replace Vite when generating the static website so that the Antlers template uses the locally saved folders for css and js. Like in the Cool Writings demo website.

Thank you 😀

jackmcdade commented 9 months ago

Just don’t use vite then — use a regular style/script tags and point them at the css/JS files directly.

bub88 commented 9 months ago

Thank you for your reply Mr. McDade. The solution was almost at hand. The only thing is that the hamburger menu doesn't work. I have included the following code for js. Do I need to add anything else?

<script type="module" src="js/site.js"></script>

jackmcdade commented 9 months ago

Looks like Alpine isn't loaded? You could try loading it from the CDN with:

<script src="//unpkg.com/alpinejs" defer></script>

Also, I see your script/style sources don't start with a slash, but should. Make sure you do /js/ and not js/ or they won't load on subpages.

bub88 commented 9 months ago

Looks like Alpine isn't loaded? You could try loading it from the CDN with:

<script src="//unpkg.com/alpinejs" defer></script>

Also, I see your script/style sources don't start with a slash, but should. Make sure you do /js/ and not js/ or they won't load on subpages.

Thank you for your response and your support. This works wonderfully. That was the final solution. I can now successfully build my blog on statamic cms with ssg 😀