Question

使用 Dash 0.22.0 和 Python 2.7.12 。 Plotly是3.1.0，但在以下示例中未使用。

我正在尝试创建一个最小化的应用程序，该应用程序应完全脱机运行。

我不是从远程dash_html_components/bundle.js，dash_renderer/bundle.js，react.min.js和react-dom.min.js加载，而是将它们的本地副本放在/assets/js中。我想告诉Dash仅使用这些文件的本地副本。

我读了Assets files & index customizations #286，如果我很好地理解了以下示例，那么该示例应该可以工作：

# -*- coding: utf-8 -*-    
import dash
import dash_core_components as dcc
import dash_html_components as html

app = dash.Dash()

# default values
app.config.assets_folder = 'assets'     # The path to the assets folder.
app.config.include_asset_files = True   # Include the files in the asset folder
app.config.assets_external_path = ""    # The external prefix if serve_locally == False
app.config.assets_url_path = '/assets'  # the local url prefix ie `/assets/*.js`

app.layout = html.Div(
    [html.H1("this is a test")]
)

if __name__ == '__main__':
    app.run_server(debug=True)

HTML来源：

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8"/>
        <title>Dash</title>

        <link rel="stylesheet" href="/assets/css/materialize.css">
        <link rel="stylesheet" href="/assets/css/materialize.min.css">
        <link rel="stylesheet" href="/assets/material-icons/material-icons.css">
    </head>
    <body>

    <div id="react-entry-point">
        <div class="_dash-loading">
            Loading...
        </div>
    </div>

    <footer>
         <script id="_dash-config" type="application/json"<{"requests_pathname_prefix": "/", "url_base_pathname": "/"}</script>
         <script src="https://unpkg.com/react@15.4.2/dist/react.min.js"></script>
         <script src="https://unpkg.com/react-dom@15.4.2/dist/react-dom.min.js"></script>
         <script src="https://unpkg.com/dash-html-components@0.11.0/dash_html_components/bundle.js"></script>
         <script src="/assets/js/dash_html_components_0.11.0/bundle.js"></script>
         <script src="/assets/js/react_15.4.2/react-dom.min.js"></script>
         <script src="/assets/js/react_15.4.2/react.min.js"></script>
         <script src="/assets/js/dash_renderer_0.13.0/bundle.js"></script>
         <script src="/assets/js/materialize_1.0.0.rc2/materialize.js"></script>
         <script src="/assets/js/materialize_1.0.0.rc2/materialize.min.js"></script>
         <script src="/assets/material-icons/iconjar-map.js"></script>
         <script src="https://unpkg.com/dash-renderer@0.13.0/dash_renderer/bundle.js"></script>
        </footer>
    </body>
</html>

如您所见，我的本地js文件是从/assets加载的，但是它仍然从https://unpkg.com/...加载相同的文件

有办法避免这种情况吗？

Answer 1

似乎我错过了一个更简单的解决方案。如果有人要尝试相同的话，我把它放在这里。

不包含{{1}中的破折号库（dash_html_components/bundle.js，dash_renderer/bundle.js，react.min.js和react-dom.min.js）的本地副本 }。

/assets仅用于与Dash和React不相关的js和css文件。就我而言，/assets，materialize.js及其各自的CSS。

添加：

iconjar-map.js

可以解决问题。

代码现在为：

app.css.config.serve_locally = True
app.scripts.config.serve_locally = True

和生成的html：

# -*- coding: utf-8 -*-
import dash
import dash_core_components as dcc
import dash_html_components as html

app = dash.Dash()

# default values
app.css.config.serve_locally = True
app.scripts.config.serve_locally = True
app.config.assets_folder = 'assets'     # The path to the assets folder.
app.config.include_asset_files = True   # Include the files in the asset folder
app.config.assets_external_path = ""    # The external prefix if serve_locally == False
app.config.assets_url_path = '/assets'  # the local url prefix ie `/assets/*.js`

app.layout = html.Div(
    [ html.H1("This is a test")]
)

if __name__ == '__main__':
    app.run_server(debug=True)

如何完全离线使用Plotly / Dash（Python）？

1 个答案: