CODEWITHSUNDEEP
pythonhtmlcssflask
Ganga Manoj
Ganga Manoj

Reputation: 67

I'm trying to build a web app using flask, but changes I make to the CSS no longer reflect on it. Does anyone know how to fix this?

The changes used to reflect on it when I'd refresh the page, but then it just stopped and stayed stuck on that same style. Changes I make to the html and the python code continue to reflect on it though. I read a similar question here about it, that made me notice that the terminal now says

Restarting with stat

instead of

Restarting with reloader

I tried installing the watchdog package like that thread had suggested, but that didn't work either.

Upvotes: 0

Views: 76

Answers (1)

Dave W. Smith
Dave W. Smith

Reputation: 24966

You "cache bust" the CSS by appending the modification stamp of the file. Something like

css_path = os.path.join(os.dirname(__file__), 'static', 'style.css')
css_time = int(os.stat(css_path).st_mtime)
...
@app.context_processor
def inject_css_mtime()
    return {'css_mtime', css_mtime}

This makes css_mtime available to templates.

<link rel=stylesheet href="{{ url_for('static', filename='style.css') }}?v={{ css_mtime }}">

When the .css file changes, its mtime will change, and browsers will know to request it again. Adjust the css_path calculation to match your app structure.

You'll need to do this for any JavaScript files, too.

Upvotes: 1

Related Questions