Changes to public/style.css not showing up in live app


#1

I have changed the h1 style to red in public/style.css and it is not reflecting in the live app.
What gives?


#2

I’m seeing the h1 as darkorange, which is what it now says in style.css. So it looks like you solved the issue?


#3

Strange!

23

Actually I am seeing changes to my header, but the colour won’t change.
I actually used the console to kill the server process (running server.py).
And still the colour won’t change for me!


#4

…and that is the screenshot from my mobile.
Somehow, the Show Live button on the Chrome browser (on my Chromebook) does not force a refresh.
Has this something to do with the fact that I am running a Python script (server.py)?

I see a node index.js process running. How do I make that “refresh” again automatically?


#5

Yes, Glitch is built around Node.js primarily although other things like Python do work. In this case, it looks like the changes aren’t reflected until your server restarts and changing the .css file doesn’t do that automatically. If you don’t need Python specifically, I’d recommend you use Node.js on Glitch.


#6

Seems like this was not a problem with earlier versions of Flask and Python. Here’s how I resolved it myself.


Firstly, adding the following debug option in the server.py file.

app.debug = True

Secondly, add some code as follows:

@app.after_request
def apply_kr_hello(response):
    """Adds some headers to all responses."""  
    ...
    response.headers['Cache-Control'] = 'no-cache' 
    return response

Thirdly, do a Ctrl-Shift-R on the specific browser tab where your application is being rendered.

That is it! Now, when you make changes to static file, they should be reflected in your app.

I presume one might also benefit from reading https://stackabuse.com/serving-static-files-with-flask as well.