Use Dash offline (Dash-Bootstrap-Components)

Dash Python
1

Is there a trick to using Dash offline? Sometimes I wish to work where there is no internet, but my app crashes because it is trying to load dash-bootstrap-components from the CDN.

dash-bootstrap-components is in my requirements.txt file, but it is still trying to load it from a CDN

Is there a way around this?

My app.py looks like this:

import dash
import dash_bootstrap_components as dbc
from dash_extensions.enrich import DashProxy, MultiplexerTransform, NoOutputTransform
import logging
import os
BASE_PATH = os.getenv('BASE_PATH_NAME', '/')
app = DashProxy(__name__, transforms=[MultiplexerTransform(), NoOutputTransform()], external_stylesheets=[
                dbc.themes.BOOTSTRAP, 'cb-dash.css'], url_base_pathname=BASE_PATH, suppress_callback_exceptions=True)
server = app.server
log = logging.getLogger('werkzeug')
log.setLevel(logging.ERROR)
2

Evening!
You could download the bootstrap css files and add them to your assets folder.

There was also a stackoverflow page that was attempting to do this exact same thing.

The critical properties you are looking for are

app.css.config.serve_locally = True
app.scripts.config.serve_locally = True
2 Likes
3

Excellent, thank you very much.

Question: Does it matter where I add those properties in my app.py (assuming that is where they should be added - see my app.py file above)?

That is, do I add them above or below the line:

server = app.server

Or does it even matter?

Thanks!

4

Hmm i don’t think it matters where as long as it’s after your app call

from dash import dash
import dash_bootstrap_components as dbc

app = dash.Dash(__name__, 
    external_stylesheets=[dbc.themes.BOOTSTRAP], 
    meta_tags=[
        {'name':'The Bourbonhuntr', 'content':'Virginias Bourbon Tracker'},
        {'name': 'viewport', 'content': 'width=device-width, initial-scale=1'},
        {'http-equiv': 'X-UA-Compatible', 'content': 'IE=edge'},
        {'property':'og:url', 'content': 'https://app.bourbonhuntr.com'},
        {'property':'og:type', 'content': 'website'},
        {'property':'og:title', 'content': 'The Bourbonhuntr'},
        {'property':'og:description','content':'The Bourbonhuntr provides daily information and analytics on the availability of certain bourbons across Virginia.'},
        {'property':'og:image', 'content':'https://app.bourbonhuntr.com/assets/TheBourbonHuntr_Logo_1000x200.png'},
        {'property':'og:image:width', 'content':'500'},
        {'property':'og:image:height', 'content':'100'}],
    suppress_callback_exceptions=True)

app.title = 'The Bourbonhuntr'

Like my app.py file has a title defined below it.

2 Likes
5

Worked perfectly. Thanks!

1 Like
6

Hi all,

im behind a proxy at the company without any internet connection. Where can i download all the assets like css and min.js files that dash needs to work properly??

Thanks,

7

hi @madevis844
This is the CSS file that is used in some Dash examples on the Dash docs.