Dash Bootstrap Components 教程

1. 项目的目录结构及介绍

facultyai/dash-bootstrap-components
├── demo
├── docs
├── examples
├── readme-images
├── src
│   └── dash_bootstrap_components
├── tests
├── webpack
├── .babelrc
├── .gitignore
├── .prettierrc
├── LICENSE
├── MANIFEST.in
├── NOTICE.txt
├── README.md
├── landing-page.md
├── noxfile.py
├── package-lock.json
├── package.json
├── pyproject.toml
├── requirements-dev.txt
├── setup.cfg
├── setup.py
└── tasks.py

• demo: 包含项目的演示代码。
• docs: 包含项目的文档文件。
• examples: 包含项目的示例代码。
• readme-images: 包含README文件中使用的图片。
• src/dash_bootstrap_components: 包含项目的主要源代码。
• tests: 包含项目的测试代码。
• webpack: 包含Webpack配置文件。
• .babelrc: Babel配置文件。
• .gitignore: Git忽略文件。
• .prettierrc: Prettier配置文件。
• LICENSE: 项目许可证文件。
• MANIFEST.in: 包含打包时需要包含的文件。
• NOTICE.txt: 项目通知文件。
• README.md: 项目介绍文件。
• landing-page.md: 项目首页文件。
• noxfile.py: Nox自动化测试配置文件。
• package-lock.json: npm包锁定文件。
• package.json: npm包配置文件。
• pyproject.toml: Python项目配置文件。
• requirements-dev.txt: 开发依赖文件。
• setup.cfg: 安装配置文件。
• setup.py: 安装脚本文件。
• tasks.py: 自动化任务脚本文件。

2. 项目的启动文件介绍

项目的启动文件通常位于examples目录下，例如app.py。以下是一个典型的启动文件示例：

import dash
import dash_bootstrap_components as dbc

app = dash.Dash(
    __name__,
    external_stylesheets=[dbc.themes.BOOTSTRAP]
)

app.layout = dbc.Container(
    [
        dbc.Row(
            [
                dbc.Col(
                    dbc.Card(
                        [
                            dbc.CardHeader("Header"),
                            dbc.CardBody(
                                [
                                    dbc.CardTitle("Title"),
                                    dbc.CardText("This is some text content."),
                                ]
                            ),
                        ]
                    ),
                    width=6,
                ),
            ]
        ),
    ],
    className="mt-4",
)

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

3. 项目的配置文件介绍

• setup.py: 用于安装项目的配置文件，定义了项目的元数据和依赖项。

from setuptools import setup, find_packages

setup(
    name='dash-bootstrap-components',
    version='1.6.0',
    author='Faculty',
    description='Bootstrap components for Plotly Dash',
    long_description=open('README.md').read(),
    long_description_content_type='text/markdown',
    url='https://github.com/facultyai/dash-bootstrap-components',
    packages=find_packages(where='src'),
    package_dir={'': 'src'},
    install_requires=[
        'dash>=1.0.0',
    ],
    classifiers=[
        'Framework :: Dash',
        'License :: OSI Approved :: Apache Software License',
        'Programming Language :: Python :: 3.8',
        'Programming Language :: Python :: 3.9',
        'Programming Language :: Python :: 3.10',
        'Programming Language :: Python :: 3.11',
        'Programming Language :: Python :: 3.12',
    ],
)

• pyproject.toml: 定义了项目的构建系统和依赖项。

[build-system]
requires = ["setuptools", "wheel"]
build-backend = "setup