本地运行 Google AI Studio 应用（部署前先跑一遍）
从 Google AI Studio 导出应用后打开一片空白？这篇讲清楚 index.html 为什么打不开，外加两种在本地跑起来的办法——其中一种完全不用装任何东西。
长话短说
你从 AI Studio 导出了应用，解压，双击 index.html——结果是一片空白。这很正常。AI Studio 导出的其实是一个 Vite 项目，得先构建或者跑起一个服务，浏览器才能运行它。本地跑起来有两条路：在浏览器里直接构建 + 预览，完全不用装东西；或者用 Node.js 起一个开发服务器。两种方法下面都会讲到。
为什么双击 index.html 只会看到空白页
AI Studio 给的 index.html 只是个模板，里面指向一个 TypeScript + JSX 的入口文件（类似 /src/index.tsx），而浏览器没法直接运行 TypeScript 或 JSX。你直接从磁盘打开这个文件——也就是一个 file:// 地址——没有任何东西去编译这些源码，所以看到的是空白页面，控制台里一堆模块报错。项目没坏，只是还没构建过而已。
方法一：在浏览器里直接预览（不用装任何东西）
如果你没装 Node.js，或者压根不想碰终端，用 React2Static 就行——它在你的浏览器里直接构建项目，构建完就能预览：
构建全程用 WebContainers 在本地跑，你的代码完全不会离开你的电脑。这份产物跟你最终要部署的一模一样——预览里能跑通，上线后也一样能跑通。
方法二：用 Node.js 跑起来
如果你装了 Node 18 或更高版本，在解压后的项目文件夹里打开终端，跑：
npm install
npm run devVite 会打印一个本地地址（通常是 http://localhost:5173）。打开它，应用就跑起来了，还带热更新，改代码马上就能看到效果。如果你打算继续改代码，用这种方式更合适。
如果 npm run dev 提示脚本不存在，打开 package.json 看看 "scripts" 那一段——有些导出用的是 start 或 preview 这样的名字。
配置 Gemini API 密钥
不少 AI Studio 应用会调用 Gemini API，本地运行时从环境变量里读密钥。去项目里找找有没有 .env.example 文件，或者直接在代码里搜一下它到底要的是哪个变量名——常见的是 GEMINI_API_KEY 这种（注意 Vite 只会把 VITE_ 开头的变量暴露给浏览器）。在项目根目录建一个 .env.local 文件，把这个变量写进去：
GEMINI_API_KEY=your_key_here加完之后重启一下开发服务器。这个文件别提交进版本控制，并且只把密钥用于本地运行——写进前端代码的密钥，一旦部署上线就等于对所有人公开，这是另一个问题，部署指南里会讲到。
还是空白？按这几条排查
本地跑通之后，怎么部署？
把它构建成静态文件，扔到一个免费的托管平台上就行——不需要服务器。完整步骤看 免费部署 Google AI Studio 应用（不用 Cloud Run）。
FAQ
怎么在自己电脑上运行 Google AI Studio 应用？
要么用 React2Static 在浏览器里直接构建预览（不用装任何东西），要么装好 Node.js 18+ 之后，在项目文件夹里跑 npm install 和 npm run dev，打开命令行里打印出来的 localhost 地址。
为什么打开 index.html 是一片空白？
因为这是个用 TypeScript 和 JSX 写的 Vite 项目，浏览器没法直接从文件运行这些源码，得先经过构建工具或开发服务器编译。
运行 AI Studio 应用一定要装 Node.js 吗？
不需要。如果你不想装任何东西，React2Static 可以完全在浏览器里帮你构建并预览应用。只有当你想要带热更新的本地开发服务器时，才需要 Node.js。
本地运行时，Gemini API 密钥放哪里？
放在项目根目录的 .env.local 文件里，变量名要用代码里要求的那个（通常是 GEMINI_API_KEY）。加完之后重启开发服务器，这个文件千万别提交进版本库。