KevinZhang13579

你有没有这样的体验：每次打开 Cursor / Copilot 开始新对话，AI 就像失忆了一样，上次踩过的坑、你反复强调的代码风格、项目里约定俗成的模式……全部归零，从头来过。

本文将指导你从零开始，在本地搭建完整的 Text-to-BI 系统开发环境。 完成后，你将拥有： - ✅ 完整的后端服务（FastAPI + Agno） - ✅ 完整的前端应用（Vue 3）

在前面的章节中，我们已经完成了聊天界面和数据可视化功能的开发。本章将深入探讨前端的性能优化技巧，包括 HTTP 客户端封装、SSE 流式响应优化、Vue 3 响应式状态管理以及组件性能优化。

数据分析可视化是 Text-to-BI 系统的核心功能。本节我们将学习如何构建 Workflow 查询界面，展示从查询分析到结果展示的完整过程。

聊天界面是用户与 AI 交互的核心。本节将介绍如何使用 Vue 3 构建一个现代化的聊天界面，支持流式响应和 Markdown 渲染。

从本节开始，我们将进入前端开发部分。Vue 3 配合 TypeScript 和 Vite，能够提供出色的开发体验和性能。本节我们将学习如何初始化项目并配置开发环境。

2026年3月31日，Anthropic 的 npm 包因一个 .map 文件配置失误，将 Claude Code 完整的 TypeScript 源码暴露在公网上。

测试是保证代码质量的重要手段。本节我们将学习如何为 Text-to-BI 系统编写测试，以及如何使用各种工具进行调试和性能优化。

流式响应能够显著提升用户体验，让用户实时看到 AI 的思考过程。本节我们将学习如何使用 SSE 协议实现流式响应，将 Workflow 的输出实时传递给前端。