Question

我正在尝试在本地托管4个css文件时运行Dash Vanguard demo app。我已成功地使用解决方法并在Dash中本地托管单个css文件，但无法同时调用所有4个。

这是当前的Vanguard破折号应用程序，外部托管了css文件：

external_css = 
["https://cdnjs.cloudflare.com/ajax/libs/normalize/7.0.0/normalize.min.css",    
"https://cdnjs.cloudflare.com/ajax/libs/skeleton/2.0.4/skeleton.min.css",
"//fonts.googleapis.com/css?family=Raleway:400,300,600",
"https://codepen.io/bcd/pen/KQrXdb.css",
"https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css"]

for css in external_css:
   app.css.append_css({"external_url": css})

我尝试在本地托管css文件：

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

app.layout = html.Div([
    html.Link(href='/assets/skeleton.min.css', rel='stylesheet'),
    html.Link(href='/assets/skelly.css', rel='stylesheet'),
    html.Link(href='/assets/normalize.min.css', rel='stylesheet'),
    html.Link(href='/assets/font.css', rel='stylesheet'),
    dcc.Location(id='url', refresh=False),
    html.Div(id='page-content')
])
....

@app.server.route('/assets/<path:path>')
def static_file(path):
    static_folder = os.path.join(os.getcwd(), 'assets')
    return send_from_directory(static_folder, path)

该应用目前正在加载，没有任何样式。不知道为什么它甚至不会加载其中一个css文件。

Answer 1

我在加载本地文件时遇到了同样的问题。问题发生在@ app.server.route中。我改成了：

@app.server.route('/static/<path>')

它有效。

编辑：从Dash 0.22开始，您现在只需要将css文件放在assets文件夹中。 See the docs

Answer 2

我目前遇到同样的问题，所以如果你找到答案，请在这里添加！...我没有解决方案，但这里是我做过的研究，以防你没有看到任何这些：

https://github.com/plotly/dash/pull/171

https://dash.plot.ly/external-resources

https://github.com/plotly/dash-recipes/blob/master/dash-local-css-link.py

在Dash App中调用本地CSS文件

2 个答案: