开源了!用 AI 生成 Vue 组件,好玩又好用
创始人
2025-07-10 22:01:30
0

三个月前,Vercel 推出了其 AI 代码生成工具 —— v0(v0.dev),这款工具可以快速生成前端组件代码,引起了前端圈的广泛关注。通过简单的描述,v0能够快速生成前端页面,让AI在前端开发领域的潜力更进一步展现出来,距离 AI 替代前端开发更近一步?在此之后,陆续出现了多个 v0 的替代品,下面就来分享两个好玩又好用的 AI 代码生成工具!

vue0

vue0 是最近刚开源的一个 AI 工具,借助 Open AI 实现。通过简单的描述,就可以快速生成一个 Vue 页面,目前支持 shadcn/vue,但很快就会支持更多的 UI 库。

vue0 的特性如下:

  • 编写多遍步骤
  • 编写迭代步骤
  • 将组件存储在 fs 中
  • 渲染生成的代码
  • 添加用户功能
  • 屏幕截图生成组件
  • 简单元数据
  • 改进缓存

在 vue0 的网站上,有很多已经生成的页面及源码:

比如,对于以下页面:

生成的代码如下:



Github:https://github.com/zernonia/vue0

openv0

openv0 是一个生成式UI组件框架,凭借AI技术,可以轻松实现UI组件的实时预览、生成与迭代。它深度整合丰富的开源组件库与图标,为生成式工作流提供一站式资源。其设计核心理念在于高度模块化与精细的生成过程管理,确保流程的灵活与高效。组件生成采用多步骤管道化流程,每一步都由独立插件执行,进一步提升了整个流程的灵活性和效率。

openv0 目前支持的前端框架有:

  • React
  • Next.js
  • Svelte

支持的 UI 库有:

  • NextUI
  • Flowbite
  • Shadcn

Github:https://github.com/raidendotai/openv0/。

相关内容

热门资讯

PHP新手之PHP入门 PHP是一种易于学习和使用的服务器端脚本语言。只需要很少的编程知识你就能使用PHP建立一个真正交互的...
网络中立的未来 网络中立性是什... 《牛津词典》中对“网络中立”的解释是“电信运营商应秉持的一种原则,即不考虑来源地提供所有内容和应用的...
各种千兆交换机的数据接口类型详... 千兆交换机有很多值得学习的地方,这里我们主要介绍各种千兆交换机的数据接口类型,作为局域网的主要连接设...
什么是大数据安全 什么是大数据... 在《为什么需要大数据安全分析》一文中,我们已经阐述了一个重要观点,即:安全要素信息呈现出大数据的特征...
如何允许远程连接到MySQL数... [[277004]]【51CTO.com快译】默认情况下,MySQL服务器仅侦听来自localhos...
如何利用交换机和端口设置来管理... 在网络管理中,总是有些人让管理员头疼。下面我们就将介绍一下一个网管员利用交换机以及端口设置等来进行D...
P2P的自白|我不生产内容,我... 现在一提起P2P,人们就会联想到正在被有关部门“围剿”的互联网理财服务。×租宝事件使得劳...
Intel将Moblin社区控... 本周二,非营利机构Linux基金会宣布,他们将担负起Moblin社区的管理工作,而这之前,Mobli...
施耐德电气数据中心整体解决方案... 近日,全球能效管理专家施耐德电气正式启动大型体验活动“能效中国行——2012卡车巡展”,作为该活动的...
Windows恶意软件20年“... 在Windows的早期年代,病毒游走于系统之间,偶尔删除文件(但被删除的文件几乎都是可恢复的),并弹...