如何在Dash应用中使用多个资源文件夹？旧方法失效后的CSS加载咨询

我刚好处理过类似的问题，新版Dash已经简化了多CSS文件的加载方式，不用再依赖旧版的static_url_path配置了，给你两种可行的方案：

首先先明确你的目录结构，方便后续参考：

all_my_apps/
|-- app1/
|   |-- app1.py
|   |-- assets/
|       |-- app1.css
|-- app2/
|   |-- app2.py
|   |-- assets/
|       |-- app2.css
|-- common/
|   |-- common.css

方案1：直接用html.Link引入公共CSS #

Dash有个默认行为：会自动加载当前应用目录下assets文件夹里的所有CSS、JS文件。所以app1.css会被自动加载，你只需要手动引入common目录下的common.css就行。

在app1.py中，直接在布局里添加html.Link组件，指定相对路径即可：

from dash import Dash, html, dcc

app = Dash(__name__)

# Dash自动加载 assets/app1.css，无需手动处理
app.layout = html.Div([
    # 手动引入公共CSS，路径相对于app1.py的位置
    html.Link(
        rel='stylesheet',
        href='../common/common.css'
    ),
    # 你的应用组件
    html.H1("App 1 内容"),
    dcc.Graph(figure={...})
])

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

这种方法简单直接，适合本地开发和部署时目录结构保持不变的场景。

方案2：通过Flask路由托管公共静态文件 #

如果担心相对路径在部署环境中出现问题（比如反向代理、容器部署），可以借助Dash内置的Flask服务器来托管common目录下的静态文件，这样路径更稳定。

代码示例（以app1.py为例）：

from dash import Dash, html, dcc
from flask import send_from_directory
import os

app = Dash(__name__)
server = app.server  # 获取Dash的Flask服务器实例

# 注册一个路由，专门提供common目录下的静态文件
@server.route('/common/<path:filename>')
def serve_common_files(filename):
    # 计算common目录的绝对路径，避免相对路径问题
    current_dir = os.path.dirname(os.path.abspath(__file__))
    common_dir = os.path.join(current_dir, '../common')
    return send_from_directory(common_dir, filename)

app.layout = html.Div([
    # 通过注册的路由引入common.css
    html.Link(
        rel='stylesheet',
        href='/common/common.css'
    ),
    html.H1("App 1 内容"),
    dcc.Graph(figure={...})
])

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

这种方案的优势是路径更可控，部署时只需要调整common_dir的计算逻辑即可，不用担心相对路径的层级问题。

注意事项 #

• 如果你的Dash应用配置了assets_external_path，要确保手动引入的CSS路径和这个配置兼容（默认情况下不需要修改该配置）
• 两种方案都可以在app2.py中复用，只需要对应调整路径即可

内容的提问来源于stack exchange，提问作者Shani Shalgi