企业官网建设流程全解析

简介：这是一份可直接运行的 DeepSite V2 项目源码包，基于 DeepSeek 大语言模型实现的 AI 建站工具。输入一句自然语言，如“制作一个科技感十足的个人博客”，即可自动生成完整的 HTML、CSS、JavaScript 页面，并支持实时预览、细粒度修改和源码导出。对于前端开发者、AI 应用研究者以及希望快速搭建网站产品的用户，它提供了低门槛、高自由度的原型生成体验。压缩包共 3 个文件，核心是一个可运行的 HTML 页面，另有环境配置与版本管理文件，整体仅 6KB，轻量易用。通过学习这套源码，可以掌握自然语言生成前端代码的实现思路，理解实时预览、增量差异补丁、多模态内容支持等功能的落地方式，也能直接改造扩展为自己所用的建站工具。目前已有 295 人学习，适合用作 AI 辅助开发入门与二次开发参考。

1. DeepSite V2：AI一句话生成整站，不是套模板的玩具

“帮我把咖啡店官网做出来，要有菜单、预约和博客，风格偏日式极简。”这句话丢给DeepSite V2，几十秒后你拿到的不只是一张截图，而是一整份可以直接双击打开、也能扔进Nginx里部署的HTML/CSS/JS源码。它不是那种从固定模板库里套壳的建站工具，而是把大模型生成能力直接接到建站流程里的开源项目：你提需求，它在对话里生成完整网页，还能反复修改。对前端开发者来说，它在原型阶段能省下大半天搭建时间；对独立开发者和自媒体人来说，不用啃完三件套也能做出像样的落地页。这篇笔记把我拆解这个V2源码包的完整过程写出来，包括部署方式、参数调优、提示词写法，以及五个最常翻车的坑。

2. 跑之前先看骨架：Flask服务与模型API的调用链路

2.1 核心组件拆解：聊天界面、生成服务与API适配层

DeepSite V2本质上是一个带聊天界面的Python后端服务。前端页面负责收集你的自然语言描述，后端把描述拼进一段系统提示词，再组合成请求发送给大模型API。大模型返回的不是JSON、不是Markdown，而是一整段HTML代码。前端拿到这段代码后，直接把它渲染进预览区，整个过程对用户来说就是“打字——等待——看到页面”。

整套链路里没有传统建站那套“数据库+模板引擎+静态资源打包”的概念。不需要MySQL，不需要Node构建。数据就是对话记录，产物就是一段又一段HTML字符串。源码包里最核心的东西只有两个方向：前端页面（聊天区+预览区）和后端服务（接收请求、调用API、流式返回）。

我拆包时重点看的是后端服务层。V2默认用Python的Flask框架，对外暴露一个HTTP接口。浏览器往这个接口发消息，接口内部按照预设模板组装请求体、设置模型参数，然后用流式方式把生成结果一点一点推回浏览器。这也是为什么你在预览区能看到一个页面逐步渲染出来，而不是干等三十秒然后整页跳出——流式返回体感上会顺很多。

生成策略上，V2的提示词里明确要求模型“只输出一个完整HTML文件，所有CSS写在style或CDN引用中，不要解释”。这样做的好处是产物单一、便于预览、也方便用户直接另存为静态页面。代价是生成的页面一旦复杂度上去，单次生成消耗的token相当可观。后面调参那章我会展开说。

2.2 环境变量与密钥配置：写死在源码里的密钥迟早出事

源码包拿到手，第一件事不是急着跑，而是把配置和代码分离。V2代码里预留了环境变量读取的入口，我一般会新建一个.env文件存放密钥和模型参数，避免直接改动源码文件。下面这段是V2后端常见的配置读取方式，不同版本写法上可能略有差异，但思路是通用的：

import os from dotenv import load_dotenv # 加载项目根目录下的 .env 文件，必须在创建Flask应用之前执行 load_dotenv() # 从环境变量读取模型服务的 API Key API_KEY = os.getenv("ANTHROPIC_API_KEY", "") # 模型名称，V2 默认走 claude 系列，可以在 .env 里替换成其他模型 MODEL_NAME = os.getenv("MODEL_NAME", "claude-sonnet-4-20250514") # 关闭 thinking 时允许生成的最大 token 数 MAX_TOKENS = int(os.getenv("MAX_TOKENS", "8192"))

这段代码注释里藏着两个关键点。load_dotenv()必须在导入Flask应用之前调用，否则你.env里填的密钥根本不会被加载，服务启动后调用API时一直报鉴权失败，排查半天才发现是加载顺序的问题。MAX_TOKENS控制的是最终HTML内容的最大长度，注意它不等同于“输出字数”，因为整段HTML源码连同标签、缩进、注释都会占token。一个信息量中等的落地页很容易吃掉五六千token，设小了页面会被拦腰截断。

密钥配置上有一条血泪经验：不要用源码包里自带的示例密钥，更别把真实密钥写进app.py再推到仓库。正确做法是复制一份.env.example为.env，填入你自己的密钥，然后确认.gitignore里包含了.env。原因是这类源码包经常被二次分发，你永远不知道下一个clone你仓库的人会拿你的密钥干什么。

提示：如果DeepSite部署在公网服务器上，请务必给服务加一层登录校验或IP白名单，否则任何能访问到端口的人都能借用你的API额度生成页面，账单会非常难看。

最后说启动入口。V2打包后一般是一个app.py或main.py，里面创建Flask实例、注册路由、监听端口。默认监听地址常见是0.0.0.0:5000，本地调试时我会把它改成127.0.0.1:5000，减少暴露面。改法很简单，找到启动那行的host参数把值换掉即可。

3. 本地跑起来：从环境准备到第一次生成完整站点

3.1 依赖安装与Python版本选择：一半的报错都出在这一步

V2这个项目对Python版本有要求，建议直接用Python 3.10及以上。低于3.10会出现类型语法不兼容，比如str | None这种写法在3.9及以下直接SyntaxError。依赖方面，源码包一般带一个requirements.txt，典型安装命令如下：

cd deepsite-v2 python -m venv .venv source .venv/bin/activate pip install -r requirements.txt

python -m venv .venv是在项目目录下建一个独立的虚拟环境，避免污染系统Python。source .venv/bin/activate是激活这个环境，Windows上对应的命令是.venv\Scripts\activate。pip install -r requirements.txt按文件里声明的依赖安装Flask、Anthropic SDK、python-dotenv等库。这里有个细节：requirements.txt里如果没锁版本，装出来的可能不是项目作者调试时用的版本，后面容易冒出兼容性问题。我拿到这类包会先翻开requirements.txt看一眼，把Flask锁到2.x，anthropic用当前稳定版。

依赖装完后，先跑一个最简单的检查：

python -c "import flask, anthropic, dotenv; print('deps ok')"

这条命令能过滤掉一半的“装了个寂寞”问题。很多人pip install之后以为成功了，实际装进了另一个Python环境，命令行里能import但项目跑不起来，多半就是这个原因。

3.2 启动服务与首次生成：验证全链路是否打通

依赖就绪、.env填好后，启动服务：

python app.py

正常情况下终端会打印类似Running on http://127.0.0.1:5000的日志。这时打开浏览器访问该地址，会看到一个聊天界面。首次生成建议用一个短需求试水，比如“一个简单的个人名片页，深色背景，包含姓名、头像占位、联系方式”。

请求发出后，预览区内容应该在几十秒内逐渐完整，最终渲染出一个可交互的页面。我一般会在这一步顺手验证三件事：生成结果是否包含完整的<html>到</html>结构；页面里的图片、字体是不是全部走CDN；有没有生成器自带的说明文字混进页面里。这三个检查直接关系到后面避坑章节的内容。

如果日志里能看到完整的请求和响应记录，说明链路已经通了。这时再试一个更复杂的页面，比如带导航、卡片、表格、FAQ的落地页，主要目的是观察生成时长和是否出现截断。这两项数据会告诉你当前参数配置是否够用。

注意：如果你本地开了代理工具，可能会导致流式响应被截断，表现是页面渲染到一半停下来。遇到这种情况先关掉代理再试一次，排查身份应该是“先本地后网络”。

4. 提示词就是生产力：把一句话升级成稳定可复现的建站指令

4.1 提示词三件套：角色设定、页面结构清单、风格约束

DeepSite这类工具的生成质量，七成取决于提示词。我拆过不少AI建站源码包，发现大多数用户把它当聊天机器人用，丢一句“做个公司官网”就完事，出来的东西自然平庸。V2的模型能力上限不低，差的是指令没给到位。

我常用的提示词模板分三段。第一段是角色和目标：告诉模型“你是一个资深前端工程师，只输出一个完整的HTML页面”。第二段是页面结构清单：把需要的区块按顺序列全，比如“顶部导航、Hero区、产品卡片、资质栏、页脚”。第三段是风格约束：给具体数值，比如“主色#4F46E5，背景#F8FAFC，卡片圆角12px，间距统一为32px”。

我需要一个SaaS产品落地页，整个页面放在一个HTML文件里。 页面结构依次为：顶部导航（包含产品名和两个按钮）、Hero大标题区、 三个特性卡片、一个定价表格、一个FAQ折叠区、页脚。 风格要求：现代简洁，主色#4F46E5，背景#F8FAFC， 正文使用Inter字体（走CDN），卡片阴影要轻，hover有轻微上浮效果。 请直接输出完整可运行的HTML代码，不要给解释。

这里有一个反常识的点：很多人不敢在提示词里提太多要求，怕模型“理解不了”。实际上模型对精确数值的遵循度远高于模糊形容词。你写“轻阴影”，它可能给你一个随意的box-shadow，每次生成还不一样；你写“box-shadow: 0 1px 3px rgba(0,0,0,0.1)”，它基本会照抄。所以提示词里的数值越具体，结果越接近你想要的样子，也更适合反复微调。

风格约束这块还有一个实用技巧：直接粘贴一套你认可的配色值和字体栈，把主色、次要色、背景色、文本色四个值写死，页面风格就基本跑偏不了。再补一句“所有区块间距一致”这类全局性约束，对多区块页面特别管用。

4.2 参数调优：temperature、max_tokens与thinking预算的配合

V2后端调用模型的代码里，通常会看到max_tokens、temperature以及启用扩展思考时的budget_tokens。这三个参数各管一摊，调法不一样。

先看temperature。它控制随机性，值越接近0输出越确定。V2默认给得很低，我试过调到0.7，同一句话连续生成两次，页面结构都不同，这对需要反复微调的场景是灾难。我的习惯是稳定在0.1以下，确定性优先。DeepSite这类生成任务不需要创造性试验，低temperature能保证页面结构可复现。

再看max_tokens。它决定最终HTML能生成多长。注意它只是最终内容的预算，V2启用扩展思考时还会单独有一个budget_tokens给思考链路，那个不占max_tokens的份额。参考配置如下：

model_kwargs = { "model": MODEL_NAME, "max_tokens": 8192, "temperature": 0.1, } if ENABLE_THINKING: model_kwargs["thinking"] = {"type": "enabled", "budget_tokens": 25000}

主要参数说明：max_tokens是最终HTML的token预算，单页信息量大时要往上加；temperature控制在0.1左右，别超过0.5；budget_tokens是思考链路的预留额度，复杂页面需求会大量消耗它。如果发现页面结构完整但某些区块被“偷工减料”——比如要求三个特性卡片只生成了一张，那多半是思考预算不够，模型没来得及把所有区块列全就被截断了。

调参有一个直接信号：生成结果总是提前断掉，页面底部缺少闭合标签，优先调大max_tokens；生成结果结构不完整但标签闭合，优先看budget_tokens是否太小。这两个方向别搞反，否则调半天没有效果。

# 排查截断的常见手段：看后端日志里的 finish_reason # 如果日志显示 "finish_reason": "stop"，说明是正常结束 # 如果是 "max_tokens"，说明长度溢出，需要调参

5. DeepSite V2避坑指南：五个最常翻车的点

5.1 页面生成到一半卡住，预览区永远停在50%

现象：点发送后，预览区内容生成到一半就不动了，等几分钟还是没有进展，浏览器控制台也没明显报错。

原因分两类。一是token预算不够，思考部分消耗过多，最终内容被截断但流式返回还没结束；二是网络链路对长连接不友好，流式响应被中间层掐断，本地挂代理工具时尤其常见。排查思路：先看后端日志里有没有完整的调用记录，确认接口是否正常返回完毕；再把max_tokens和thinking预算各自调高重试一次。

我的习惯是先把max_tokens从8192调到12000，同时把thinking预算从25000降到12000。这样做的逻辑是让更多额度流向最终HTML，而不是被思考过程吃掉。像“做一个落地页”这类相对直接的需求，不需要那么多推理预算，压缩掉反而是好事。

5.2 页面能渲染出来，但样式全部“裸奔”

现象：生成结果里文字和布局都在，但所有颜色、间距、卡片阴影全部丢失，看起来像2005年的网页。

原因：V2生成页面时默认依赖Tailwind CSS的CDN脚本，源码里通常会有<script src="https://cdn.tailwindcss.com"></script>这一行。你所在环境的网络访问不了这个CDN地址，样式就会全部失效，但HTML结构还在，所以页面“能看但不正常”。

解决分两步。第一步，打开生成页面的源码确认有没有这行CDN引用。第二步，如果CDN不可达，把脚本下载到本地，或者更稳妥的做法是在提示词里直接规定“不要使用Tailwind CDN，所有CSS写在style标签内”。我实测下来第二种方案生成的页面在离线环境也能正常展示，部署到内网服务器尤其好用。

5.3 从预览区复制的HTML，另存后在别处打开是空白

现象：你在DeepSite预览区按Ctrl+A复制全部内容，存成.html文件，换台电脑双击打开，页面白屏或者只显示半截。

原因：预览区里看到的元素树是浏览器解析后重新生成的DOM结构，而不是模型输出的原始HTML字符串。你复制到的内容可能被浏览器补全、压缩过，引号、标签嵌套已经变形，另存后自然跑不起来。

解决方法是绕开浏览器复制，直接从后端拿原始响应。常见做法是在后端加一层记录逻辑，每次生成后把完整HTML写进本地文件；或者在浏览器开发者工具的网络面板里找到那条流式响应，把完整内容另存为文件。从那以后我再也不从预览区复制代码，这是DeepSite使用里最容易被忽视的一个陷阱。

5.4 Docker部署时镜像拉不下来

现象：用源码包自带的Dockerfile或docker-compose启动，卡在拉取镜像这一步，报错信息里出现Error response from daemon字样的错误。

原因：这类报错的本质是镜像仓库访问不稳定，不一定是项目本身的问题。很多情况下是当前机器访问默认镜像源超时，或者Docker守护进程没有正确配置网络代理。

解决思路分三个层级。先检查当前机器访问镜像仓库是否正常，最简单的方式是直接curl一下仓库地址看通不通；然后考虑给Docker配置镜像源加速，常见做法是修改/etc/docker/daemon.json里的registry-mirrors字段；如果两边都不行，干脆放弃容器化，回到裸机运行。DeepSite这类轻量Python服务，用venv跑起来和容器方式没有任何功能差异，不必死磕。

5.5 源码包解压后跑不起来：缺模块、版本冲突、密钥未加载

现象：pip install -r requirements.txt执行成功后启动服务，报ModuleNotFoundError: No module named 'anthropic'，或者Flask启动后调用API时报鉴权失败。

原因：两个常见来源。一是依赖装错了环境，项目用的是某个Python解释器，而pip install装进了另一个；二是.env文件根本没被读取，或者load_dotenv()执行得太晚。这两个问题踩中任何一个，表现都是“装好了但跑不起来”。

解决办法：新建一个干净的虚拟环境重装，装完先跑python -c "import flask, anthropic, dotenv; print('deps ok')"验证；密钥没加载就检查.env文件是否在项目根目录、文件名是否正确、load_dotenv()是否在Flask启动前执行。这两步走完，这类问题能解决九成。

6. 进阶玩法：把DeepSite生成结果收编成自己的长期资产

DeepSite生成的东西本质上是一段HTML字符串，如果只停留在聊天界面里，价值就少了一大半。我后来摸索出一套固定工序：把每次生成的HTML落盘保存、替换外部依赖、接入自己的页面骨架。

落盘这块，我在后端加了一段响应记录逻辑，在生成完成时把完整内容写入本地文件，文件名带上时间戳，方便追溯：

import time generated_html = response_text # 完整生成的HTML字符串 filename = f"output/{time.strftime('%Y%m%d_%H%M%S')}_landing.html" with open(filename, "w", encoding="utf-8") as f: f.write(generated_html)

落盘之后是替换外部依赖。模型生成的页面通常带多个CDN引用，我会统一改成本地文件引用。做法是先把需要的静态资源下载到项目的static/目录，然后把<script src="https://...">改成相对路径<script src="/static/...">。对于Tailwind CDN这类大文件，如果只是做原型可以保留，但正式交付时我会强制本地化，否则对方内网环境打开就是裸样式页面。这一步是让AI生成页面“能交付”的关键分水岭。

最后是把生成页面接入自己的工程骨架。常见做法是把HTML里的主体内容抽出来做成模板，再用Flask或纯静态方式套上统一的导航和页脚。接入后，DeepSite生成的内容就变成一个可复用的页面区块，不再是聊天窗口里的一次性成果。验证时我一般会先本地启动服务确认页面完整可访问，再部署到Nginx托管静态文件：

cp output/20250101_landing.html /var/www/mysite/index.html nginx -t && nginx -s reload

以上这套工序我现在每次跑DeepSite都会强制走一遍：落盘、去外链、接骨架，三步缺一不可。没有这套工序，AI生成页面永远只是聊天窗口里的一个“一次性成果”；有了它，每一次生成都能沉淀成能反复使用、能交付给别人的资产。希望帮到你。

本文还有配套的精品资源，点击获取