Design2Code 项目使用教程

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

Design2Code 项目的目录结构如下：

Design2Code/
├── CogVLM/
│   └── finetune_demo/
│       └── inference_design2code.py
├── data_utils/
│   └── screenshot.py
├── metrics/
│   └── multi_processing_eval.py
├── prompting/
│   ├── cogagent.py
│   ├── gpt4v.py
│   └── gemini.py
├── testset_final/
│   ├── xx.png
│   └── xx.html
├── .gitignore
├── CODE_LICENSE
├── DATA_LICENSE
├── README.md
├── example.png
├── id_to_url_mapping.json
├── requirements.txt
└── setup.py

目录结构介绍

• CogVLM/: 包含与 CogVLM 模型相关的文件，特别是用于微调和推理的脚本。
• data_utils/: 包含数据处理和截图生成的脚本。
• metrics/: 包含用于自动评估的脚本。
• prompting/: 包含用于多模态提示实验的脚本，涉及 GPT-4V 和 Gemini Pro Vision 等模型。
• testset_final/: 包含测试集的截图和对应的 HTML 代码。
• .gitignore: Git 忽略文件。
• CODE_LICENSE: 代码的许可证文件。
• DATA_LICENSE: 数据的许可证文件。
• README.md: 项目介绍和使用说明。
• example.png: 示例截图文件。
• id_to_url_mapping.json: URL 映射文件。
• requirements.txt: 项目依赖库列表。
• setup.py: 项目安装脚本。

2. 项目的启动文件介绍

项目的启动文件主要是 setup.py 和 README.md。

setup.py

setup.py 是 Python 项目的标准安装脚本，用于安装项目的依赖库和配置项目。你可以通过以下命令安装项目的依赖：

pip install -e .

README.md

README.md 文件包含了项目的详细介绍、使用说明和快速链接。它是用户了解项目的第一手资料，建议在启动项目前仔细阅读。

3. 项目的配置文件介绍

项目的配置文件主要包括 requirements.txt 和 api_keys.json。

requirements.txt

requirements.txt 文件列出了项目运行所需的 Python 依赖库。你可以通过以下命令安装这些依赖：

pip install -r requirements.txt

api_keys.json

api_keys.json 文件用于存储 OpenAI 和 Google Gemini 的 API 密钥。在使用多模态提示实验时，你需要将 API 密钥填入该文件中。文件格式如下：

[
  {
    "organization_id": "",
    "openai_key": "",
    "openai_endpoint": "",
    "gemini_api_key": ""
  }
]

请确保在运行提示实验前正确配置此文件。