海外访问：www.kdjingpai.com

Ctrl + D 收藏本站

当前位置：首页 » AI答疑

如何在现有React项目中安装和配置Onlook？

2025-09-10

1.9 K

配置Onlook需要三个关键步骤：

1. 环境准备

通过GitHub获取工具源码（git clone或下载ZIP）
确保Node.js环境（推荐最新稳定版）
安装依赖项（npm install）

2. 项目集成

对于Next.js项目:

在next.config.mjs中添加swcPlugins配置
指定projectRoot参数指向项目根目录

3. 运行配置

启动Onlook开发服务器（npm run dev）
确保目标React项目同时运行（npm start）
通过浏览器访问Onlook界面即可开始设计

注意：不同框架可能需查阅官方文档获取具体配置方式，版本兼容性需要特别注意。

本答案来源于文章《Onlook：面向前端设计开源Cursor，在React应用中设计并发布代码》

相关文章

未经允许不得转载：AI生产力工具 » 如何在现有React项目中安装和配置Onlook？

相关推荐