Use Dash offline (Dash-Bootstrap-Components)

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 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')

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

Excellent, thank you very much.

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

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

server = app.server

Or does it even matter?


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__, 
        {'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': ''},
        {'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':''},
        {'property':'og:image:width', 'content':'500'},
        {'property':'og:image:height', 'content':'100'}],

app.title = 'The Bourbonhuntr'

Like my file has a title defined below it.


Worked perfectly. Thanks!

1 Like

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??


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