Bolt DIY搭建教程：免费开源AI编程工具完整指南

想要免费构建网站、应用和各种工具？Bolt DIY 是一个完全免费的开源 AI 编程工具，配合 Google Gemini 等免费 API，你可以在几分钟内完成过去需要数天甚至数周的开发工作。本文将详细介绍如何从零开始搭建 Bolt DIY，并展示它的强大能力。

什么是 Bolt DIY？

Bolt DIY 是 Bolt.new 的开源免费版本，托管在 GitHub 上。Bolt.new 由 StackBlitz 团队开发，其核心技术是基于 WebContainers——一种能在浏览器中运行完整 Node.js 开发环境的突破性技术。开源版 Bolt DIY 将这一能力解放出来，允许开发者在本地部署并自由集成任意 LLM（大型语言模型）API，形成「自带模型」（BYOM, Bring Your Own Model）的开放架构，代表着 AI 工具从封闭 SaaS 向开放基础设施演进的重要趋势。

与付费版 Bolt.new 相比，它不仅完全免费，还提供了更多自定义功能——你可以自由选择和切换不同的 AI 模型 API，包括 Google Gemini、Anthropic Claude、Perplexity 等。

它的核心优势在于：

完全免费：工具本身不收费，配合免费 API 即可使用
本地部署：数据和项目都在你自己的机器上，隐私有保障
API 灵活切换：可以根据不同任务选择最合适的 AI 模型
功能更丰富：支持附件上传、语音指令、聊天导出等付费版不具备的功能

环境搭建：两分钟快速上手

前置准备

搭建 Bolt DIY 需要两个免费工具：Node.js 和 Docker。确保它们已安装并在后台运行。然后前往 Bolt DIY 的 GitHub 仓库，按照说明操作。

具体步骤非常简单：打开终端，按照 GitHub 页面上的指令依次复制粘贴命令即可。整个过程大约只需两分钟。如果遇到任何报错，可以将错误截图发给 ChatGPT，它会帮你快速排查问题。

搭建完成后，终端会给出一个本地访问地址（localhost URL），将其复制到浏览器中打开，你就能看到 Bolt DIY 的界面了。

配置免费 API 密钥

在开始编程之前，需要插入 API 密钥。推荐使用 Google Gemini 2.0 Flash，这是 Google DeepMind 于 2025 年推出的多模态旗舰模型，专为速度与效率优化。它支持文本、图像、音频等多模态输入，上下文窗口高达 100 万 token，在代码生成任务上表现尤为突出。通过 Google AI Studio 提供的免费 API 配额，个人开发者每分钟可发起数十次请求，足以支撑日常开发需求——这与 OpenAI GPT 系列的纯付费模式形成鲜明对比，是目前对独立开发者最友好的顶级模型之一。

获取方式如下：

访问 AI Studio
创建一个 API 密钥（完全免费）
回到 Bolt DIY，在 API 列表中选择 Google Gemini 2.0 Flash
粘贴你的 API 密钥

除了 Gemini，你还可以选择 Perplexity（支持实时联网）、Anthropic Claude 3.5 Sonnet（编程能力最强）等模型，随时在项目中切换。

Bolt DIY 构建键盘应用示例

实战演示：用 Bolt DIY 构建应用和网站

快速生成交互式应用

Bolt DIY 的使用方式和 ChatGPT 类似——左侧是对话窗口，右侧是实时生成的代码和预览。例如输入"build me a magical keyboard app"，几秒钟内就能生成一个可交互的键盘应用。

你还可以通过自然语言持续迭代。比如对一个"爸爸笑话生成器"应用说"把按钮改成亮橙色，添加动画，加上彩虹背景"，Bolt 会自动修改之前的项目代码，保留原有功能的同时应用所有更改。

应用构建与迭代示例

构建 SEO 友好的高性能网站

这是 Bolt DIY 最实用的场景之一。你可以用一段提示词快速生成完整的博客网站或着陆页。例如：

"Create an affiliate SEO blog about bird watching. My name is Julian Goldie. Here's my Amazon affiliate ID. Make this website about birdwatching."

生成的网站不仅结构完整，而且代码质量远超 WordPress。原因在于：WordPress 网站通常依赖大量插件（页面构建器、SEO 插件、缓存插件等），产生冗余的 JavaScript 和 CSS，而 AI 直接生成的静态代码天然避免了这一问题，输出的 HTML/CSS/JS 结构精简，无多余依赖。

构建计算器页面示例

实测数据令人印象深刻：将 AI 生成的网站放入 Google PageSpeed Insights 检测，性能得分 99，SEO 得分 100。这一工具基于 Lighthouse^广告引擎，综合评估 LCP（最大内容绘制）、INP（交互到下一次绘制）、CLS（累积布局偏移）等核心 Web 指标（Core Web Vitals）——自 2021 年起，这些指标已被 Google 纳入搜索排名算法，直接影响网站在搜索结果页中的位置。而同类 WordPress 网站往往连核心 Web 指标都无法通过，这意味着用 Bolt DIY 构建的网站在搜索引擎排名上天然具有结构性优势。

一键部署上线

完成项目后，你可以通过以下步骤将网站发布到互联网：

点击"Download"下载完整代码
使用"Push to GitHub"将代码推送到 GitHub 仓库
在 Netlify 等免费托管平台上导入 GitHub 项目，一键部署上线

Netlify 是目前最主流的静态网站托管平台之一，采用 JAMstack 架构理念，其免费套餐提供每月 100GB 带宽、自动 HTTPS 和全球 CDN 分发。更关键的是，它支持「Git 即部署」的 CI/CD 工作流——每次推送代码到 GitHub，网站会自动重新构建并发布，极大降低了运维门槛。类似平台还有 Vercel 和 Cloudflare Pages，三者均提供慷慨的免费套餐，是独立开发者的首选基础设施。

整个流程中，唯一需要付费的环节就是域名托管费用。

进阶技巧：截图驱动的设计优化

当你对生成的网站外观不满意时，有一个非常实用的技巧：截图模仿法。

操作方法：

在网上找到一个你喜欢的网站设计
截图并上传到 Bolt DIY 的聊天窗口
输入"Follow the same design style as this screenshot"

截图上传与设计模仿

这一功能之所以可行，依赖的是现代 LLM 的多模态视觉理解能力。模型会对截图进行语义分析，识别色彩层级（主色/辅色/背景色）、排版规律（字体大小比例、行高）、组件模式（卡片、导航栏、CTA 按钮样式）以及整体布局网格，本质上是将「设计稿转代码」（Design-to-Code）这一传统上需要专业前端工程师完成的工作自动化。Bolt 会将你的项目重新设计为类似的风格，效果提升非常显著——从朴素页面瞬间变成专业级设计。

这里还有一个关键建议：在设计优化阶段，将 API 切换到 Anthropic Claude 3.5 Sonnet。它在此场景下表现更优，原因在于其训练数据中包含大量高质量 UI 代码示例，对视觉细节的还原精度更高，能更准确地将视觉意图转化为语义化的 CSS 和组件结构。虽然是付费 API，但价格很低，非常适合用来做项目的最后打磨。

Bolt DIY 与 Bolt.new 功能对比

特性	Bolt DIY（免费）	Bolt.new（付费）
费用	免费	需购买 Token
API 选择	自由选择任意 API	固定，无法自定义
附件上传	✅	❌
语音指令	✅	❌
聊天导出	✅	❌
部署方式	本地托管	云端托管

总体来看，Bolt DIY 在功能和灵活性上都优于付费版本，唯一的门槛是需要自己搭建环境。但正如前文所述，这个过程只需要两分钟。

总结

Bolt DIY 代表了 AI 编程工具的一个重要趋势：专业级开发能力的平民化。无论你是想快速搭建一个 SEO 博客、构建一个小工具，还是开发一个完整的应用，它都能在几分钟内帮你完成。配合免费的 Google Gemini API，整个过程零成本。

对于非技术背景的创业者和内容创作者来说，这可能是目前性价比最高的建站和应用开发方案。

核心要点

Bolt DIY 是完全免费的开源 AI 编程工具，配合 Google Gemini 免费 API 可零成本构建网站和应用
搭建过程仅需两分钟，安装 Node.js 和 Docker 后按 GitHub 指令操作即可
AI 生成的网站代码质量远超 WordPress，PageSpeed 性能得分可达 99，SEO 得分 100
支持截图驱动设计——上传喜欢的网站截图即可让 AI 模仿其风格重新设计项目
相比付费版 Bolt.new，免费的 Bolt DIY 提供更多功能且支持自由切换 API 模型