Dash app does not load assets and app.index_string

Hello, I 'm currently trying to add a footer into index_string and set some css for the whole app.

The local deployment is successful and working as it should. But on Heroku is does not load any css and js in assets folder at all. Googling a bit tells me that Heroku doesnt compile them(?). How to get through this?

Another question is about the app.index_string loads locally successfully but not showing on Heroku app as well.

3 Likes

This should work. Which version of dash do you have in requirements.txt?

dash==0.22.0

Here is the link of the webapp that I am deploying: https://desolate-stream-86353.herokuapp.com/khai-quat
And its expected outlook:

Here is the source code of this page

Try adding __name__ to the dash init:

app = dash.Dash(__name__, meta_tags=[...])

1 Like

Just looked at the code, you running index.py ?

I got several encoding errors while trying to run it, you should put # -*- coding: utf-8 -*- at the top of every file where you use strings that contains your language characters.

Update for today, thank you for your suggestion.

My problem was solve as you can see one the web. I never figure out why. Sometimes, it will update on heroku as similar to on my local. Sometimes it will not but no bug reported.

Philippe, you saved me from lots of headaches! I’ve spent the whole day trying to solve a problem where local resources (favicon, css, local images, as explained here) were being served automatically and successfully from assets folder in my local windows machine, but NOT in my linux server. By adding the __name__ inside the dash.Dash(__name__) it has been solved.

Do you know why this change solved the problem? What is doing the __name__ under the hood?
Thanks!

1 Like

Sounds like we could make this clearer in the documentation. Would you mind making an issue in GitHub - plotly/dash-docs: 📖 ISSUE TRACKER ONLY for The Official Dash Userguide & Documentation https://dash.plotly.com/ or a PR? The page is here: https://github.com/plotly/dash-docs/blob/master/tutorial/external_css_and_js.py

Chris, I’m glad to do it! Thanks

Just to understand it, why is it needed to add __name__ for using local resources in linux? I understand that the __name__ variable shows where the script is being run from, but why did it matter on my linux server (heroku)?

I’m data scientist so I still have a long software development learning path in front of me :slight_smile:

It has nothing to do with linux, it’s how you run your application that make the difference. We use flask.helpers.get_root_path which take a module name to resolves the path to the module. By default, we have __main__ as the module name for a fallback that will work when the app is called by it’s module name (eg: python app.py).

When you run it thru some other command line (like the flask command or gunicorn/waitress) the __main__ module is no longer located where app.py is and now refer to some place like /venv/lib/site-packages/flask. Giving __name__ explicitly will always give the right path to the assets folder.

5 Likes

That makes sense. I’m using gunicorn :slight_smile:

Thank you for the explanation Philippe

1 Like

I was trying to load my css files from assets folder and it was not working because I run it from Flask CLI but it just worked when I included the name to the dash init. Thanks @Philippe for the answer. It would be great if this instruction is available in the dash tutorial page: https://dash.plot.ly/external-resources.

would you be interested in creating a pull request? the docs are here: GitHub - plotly/dash-docs: 📖 ISSUE TRACKER ONLY for The Official Dash Userguide & Documentation https://dash.plotly.com/ and they’re written in dash and markdown.

You got it: https://github.com/plotly/dash-docs/pull/187

I am passing name into my Dash app creation and my assets are still not loading once the app is deployed with gunicorn.

I am using Dash 0.22 in both locations.

I create my Flask and Dash app like this:
app = Flask(name, static_url_path=’/static’, static_folder=static_folder, template_folder=template_folder)
dash_app = dash.Dash(name, server=app, url_base_pathname=’/dash’)

Am I doing something wrong with this part of my code?

Can you try updating, there’s been a couple fix since that version.

What version should I update to? I was under the impression that 0.22 was the most recent version. Looking here: https://github.com/plotly/dash/releases. It looks like there isn’t a release between 0.19 and 0.26.5?

We didn’t tag releases until recently so they don’t appear in the github releases. You can look at the changelogs for a complete list of all the changes.

I suggest trying with the latest 0.26.5.

I also recommend just checking the official installation instructions here: Installation | Dash for Python Documentation | Plotly.

I was facing exactly the same issue. I’ve just updated to those versions and solved for me:

pip install dash==0.28.1 # The core dash backend
pip install dash-html-components==0.13.2 # HTML components
pip install dash-core-components==0.30.2 # Supercharged components