CrabNote螃蟹笔记

Lovable 官方的 Prompting 1.1 手册

Lovable 官方的 Prompting 1.1 手册

Lovable 官方的 Prompting 1.1 手册 Lovable 官方的 Prompting 1.1 手册 Modified October 1, 2025 No access 6bc9d6c16ed34514842ac4afecea71d2 00:00 Code block Plain Text Copy Add a profile feature Code block Plain Text Copy Support notifications ✅正确示例:后者明确了范围和预期结果。 Code block Plain Text Copy Add a user profile page with fields X, Y, Z. Code block Plain Text Copy Send an email notification on form submission. 注意语气和礼貌 虽然这不会改变功能,但礼貌的语气有时能带来更好的结果。诸如“请”或礼貌的请求等措辞可以增加上下文,使提示更具描述性,从而帮助人工智能。例如, 请勿修改主页,仅专注于仪表板组件。 这看起来很礼貌,并且明确告诉了 AI 不该做什么。这无关乎 AI 的感受——关键在于详细说明。(而且,友善总是没错的!) 有意使用 Lovable 的模式 如前所述,使用 Chat 模式进行规划,使用 默认模式进行构建。例如,在开始一个新功能时,你可能会进入 Chat 模式并构思组件的分解: 我想在我的应用中添加一个博客部分。让我们讨论如何构建数据和页面。 AI 可能会给出一个大纲。一旦你满意了,你可以切换到默认模式,然后说: 创建一个 BlogPost 页面,并基于上述计划创建一个 supabase 表或博客文章模式。 善用格式化功能 在适当的时候对列表或步骤进行结构化。如果你希望 AI 输出列表或遵循顺序,请在提示中列举它们。通过编号步骤,你暗示 AI 以相同的方式回应。 Code block Plain Text Copy Let's think through the process of setting up a secure authentication system: 1. What are the necessary components? 2. How should they interact? 3. Provide the implementation code. 首先,解释方法。其次,展示代码。第三,提供一个测试示例。 利用示例或参考 如果你有一个目标设计或代码风格,请提及它或提供一个示例。提供示例(图像或代码片段)可以为 AI 提供一个具体的参考以模仿。 设定背景 Code block Plain Text Copy We are building a project management tool that helps teams track their tasks.This tool should have features like: user authentication project creation task assignments reporting Now, for the first task, create the UI for project creation. 另一个例子: Code block Plain Text Copy I need a CRM app with Supabase integration and a secure auth flow. Start by setting up the backend. 另一个例子: Code block Plain Text Copy We are developing an e commerce platform focusing on eco friendly products. Generate a product listing page with filters for category and price. 使用图像提示 Lovable 甚至允许您在提示中上传图像,这样您就可以展示一个设计并说“匹配这种风格”。这里有两种主要方法。第一种是一种简单的提示方法。 简单的图片上传提示你可以上传一张图片,然后像这样添加一个示例提示: Code block Plain Text Copy Create and implement a UI that looks as similar as possible to the image attached. Code block Plain Text Copy This screenshot shows a layout issue on mobile. Adjust margins and padding to make it responsive while keeping the same design structure. 或者,你可以帮助 AI 更好地理解图片的内容以及一些额外的具体信息。通过为上传的图片添加具体指令,可以取得优异的结果。虽然图片胜过千言万语,但添加一些你自己的描述来描述期望的功能会大有帮助——特别是由于交互有时无法从静态图片中明显看出。 带详细说明的图片提示 Code block Plain Text Copy I want you to create the app as similar as possible to the one shown in this screenshot. It's essentially a kanban clone. It should have the ability to add new cards (tickets) in each column, have the ability to change the order of those tickets within a single column, and even move those cards between columns. Feel free to use the Pangea home dnd npm package for drag and drop functionality. 反馈整合 审查 AI 的输出并提供具体的反馈以进行改进。 Code block Plain Text Copy The login form looks good, but please add validation for the email field to ensure it contains a valid email address. 强调可访问性 鼓励生成符合可访问性标准和现代最佳实践代码。这确保输出不仅功能性强,而且用户友好,并符合可访问性指南。 Code block Plain Text Copy Generate a React component for a login form that follows accessibility best practices, including appropriate ARIA labels and keyboard navigation support. 预定义组件和库 指定使用某些 UI 库或组件以保持项目的一致性和效率。这引导 AI 使用特定工具,确保兼容性并在整个应用程序中采用统一的设计语言。 Code block Plain Text Copy Create a responsive navigation bar using the shadcn/ui library with Tailwind CSS for styling. 多语言提示 在多语言环境中,请为代码注释和文档指定所需的语言。这确保了生成的内容可以被说不同语言的团队成员访问,从而增强协作。 Code block Plain Text Copy Generate a Python script that calculates the Fibonacci sequence. Provide comments and documentation in French. 定义项目结构和文件管理 明确概述项目结构,包括文件名和路径,以确保代码生成的有序性和可维护性。这有助于明确新组件应在项目中放置的位置,保持一致的文件组织。 Code block Plain Text Copy Create a new React component named 'UserProfile' and save it as 'components/user profile.tsx'. Ensure it includes a profile picture, username, and bio section. 提供精确的编辑指令(聚焦 AI) 默认情况下,当你要求 Lovable AI 进行修改时,它可能会重写整个文件或多个文件。为了避免无意中的更改,请非常具体地说明 要修改的位置 和 要修改的内容 。你可以使用 Lovable 的“选择”功能来突出显示组件或文件,然后仅针对该选择进行提示。或者,在提示中明确命名文件/组件。例如: 在 Header组件中,将注册按钮的文本改为“Get Started”,并将其移动到导航栏的左侧。 这样,AI 就会知道专注于 Header 组件,并仅调整该部分。另一个技巧:告诉 AI 不要触碰 什么。你可以添加,“不要修改任何与头部无关的其他组件或逻辑。”这可以防止 AI 偏离方向并可能破坏其他内容。这种做法(有时称为“Diff & Select”方法)确保了最小化、有针对性的更改——从而实现更快的响应和更少的回归错误。 锁定文件(解决方案) 目前 Lovable 可能没有显式的文件锁定功能,但你可以通过调整提示词来模拟。如果有一些关键文件 AI 永远不应该修改(可能是一个运行良好的复杂组件),你可以在每个提示中重复一条指令,例如: 不要更改 authentication.js 文件。 通过持续告诉 AI 避免修改,你可以减少不希望进行的编辑。类似地,如果你只想让 AI 在项目的某个部分工作,可以明确限制它: Focus changes solely on the ProfilePagecomponent; assume all other parts of the app remain as is. 在提示中明确这一点有助于将 AI 限制在范围内。 设计和界面调整 在 Lovable 中提示 UI 更改时,清晰度至关重要,以免破坏功能: • 如果你想要 纯粹的视觉变化 ,请说明。 “将登录按钮改为蓝色并放大 20%,但不要改变其任何功能或 onClick 逻辑。” 这样可以确保 AI 在重新设计时不会意外地重命名 ID 或更改逻辑。 • 对于 响应式设计 (使设计适合移动设备),请引导 AI 制定计划。例如: “优化移动端着陆页:采用移动优先的方法。首先概述每个部分在小屏幕上的重新排列方式,然后实现这些 CSS 更改。使用标准的 Tailwind 断点(sm、md、lg),并避免自定义断点。确保功能没有变化,只是布局。” 通过提供这类详细说明,你可以获得全面的移动端适配,而不会破坏桌面布局。 • 如果你有设计变更的考虑,描述期望的结果和任何限制(例如“保持相同的 HTML 结构,只需更新 CSS”)将帮助 AI 专注于正确的解决方案。AI 设计变更后,始终测试应用程序以确保一切按预期工作。 重构和优化代码 随着你的项目发展,Lovable 的 AI 可能会建议重构以提升性能或可维护性。重构提示是一个高级但非常有价值的应用场景: • 强调行为不变 : “重构代码以提高清晰度和效率,但 应用程序的功能和输出必须保持完全相同。” 这告诉 AI 重构不应引入错误或功能变更。 • 你可以先请求一个重构计划 : “扫描utils/文件夹,并建议代码结构或重复代码的改进。列出变更但不要立即应用。” AI 可能会给你一份需要改进的报告。然后你可以决定哪些变更需要提示实施。 • 对于大规模重构,分阶段进行。一次提示一个模块,测试后再继续。这符合逐步原则。例如:先重构状态管理逻辑,再重构 API 调用,而不是一次性全部完成。 • 重构后,建议提示一个快速的后检查 :“代码已重构,快速检查清单:界面是否相同,所有测试或关键流程是否仍然通过?” AI 可以自我验证或列出需要手动检查的事项。 AI 辅助调试 错误在所难免。Lovable 有一个“尝试修复”功能用于快速修复,但你也可以通过提示来调用 AI: • 当出现错误时,将任何 error 日志或消息复制到提示中(最好在聊天模式下),并询问:“这里提供了错误和相关代码片段——是什么导致了这个问题?我们该如何解决?” 详细的错误上下文有助于 AI 找到问题所在。 • 在调试时使用 CLEAR 原则:明确说明代码本应做什么以及实际发生了什么。有时,向 AI 详细解释错误就能引导它找到解决方案。 No access 6bc9d6c16ed34514842ac4afecea71d2 00:00 No access 6bc9d6c16ed34514842ac4afecea71d2 00:00 ✅正确示例:后者明确了范围和预期结果。 注意语气和礼貌 虽然这不会改变功能,但礼貌的语气有时能带来更好的结果。诸如“请”或礼貌的请求等措辞可以增加上下文,使提示更具描述性,从而帮助人工智能。例如, 请勿修改主页,仅专注于仪表板组件。 这看起来很礼貌,并且明确告诉了 AI 不该做什么。这无关乎 AI 的感受——关键在于详细说明。(而且,友善总是没错的!) 有意使用 Lovable 的模式 如前所述,使用 Chat 模式进行规划,使用 默认模式进行构建。例如,在开始一个新功能时,你可能会进入 Chat 模式并构思组件的分解: 我想在我的应用中添加一个博客部分。让我们讨论如何构建数据和页面。 AI 可能会给出一个大纲。一旦你满意了,你可以切换到默认模式,然后说: 创建一个 BlogPost 页面,并基于上述计划创建一个 supabase 表或博客文章模式。 善用格式化功能 在适当的时候对列表或步骤进行结构化。如果你希望 AI 输出列表或遵循顺序,请在提示中列举它们。通过编号步骤,你暗示 AI 以相同的方式回应。 首先,解释方法。其次,展示代码。第三,提供一个测试示例。 利用示例或参考 如果你有一个目标设计或代码风格,请提及它或提供一个示例。提供示例(图像或代码片段)可以为 AI 提供一个具体的参考以模仿。 设定背景 另一个例子: 另一个例子: 使用图像提示 Lovable 甚至允许您在提示中上传图像,这样您就可以展示一个设计并说“匹配这种风格”。这里有两种主要方法。第一种是一种简单的提示方法。 简单的图片上传提示你可以上传一张图片,然后像这样添加一个示例提示: 或者,你可以帮助 AI 更好地理解图片的内容以及一些额外的具体信息。通过为上传的图片添加具体指令,可以取得优异的结果。虽然图片胜过千言万语,但添加一些你自己的描述来描述期望的功能会大有帮助——特别是由于交互有时无法从静态图片中明显看出。 带详细说明的图片提示 反馈整合 审查 AI 的输出并提供具体的反馈以进行改进。 强调可访问性 鼓励生成符合可访问性标准和现代最佳实践代码。这确保输出不仅功能性强,而且用户友好,并符合可访问性指南。 预定义组件和库 指定使用某些 UI 库或组件以保持项目的一致性和效率。这引导 AI 使用特定工具,确保兼容性并在整个应用程序中采用统一的设计语言。 多语言提示 在多语言环境中,请为代码注释和文档指定所需的语言。这确保了生成的内容可以被说不同语言的团队成员访问,从而增强协作。 定义项目结构和文件管理 明确概述项目结构,包括文件名和路径,以确保代码生成的有序性和可维护性。这有助于明确新组件应在项目中放置的位置,保持一致的文件组织。 提供精确的编辑指令(聚焦 AI) 默认情况下,当你要求 Lovable AI 进行修改时,它可能会重写整个文件或多个文件。为了避免无意中的更改,请非常具体地说明 要修改的位置 和 要修改的内容 。你可以使用 Lovable 的“选择”功能来突出显示组件或文件,然后仅针对该选择进行提示。或者,在提示中明确命名文件/组件。例如: 在 Header组件中,将注册按钮的文本改为“Get Started”,并将其移动到导航栏的左侧。 这样,AI 就会知道专注于 Header 组件,并仅调整该部分。另一个技巧:告诉 AI 不要触碰 什么。你可以添加,“不要修改任何与头部无关的其他组件或逻辑。”这可以防止 AI 偏离方向并可能破坏其他内容。这种做法(有时称为“Diff & Select”方法)确保了最小化、有针对性的更改——从而实现更快的响应和更少的回归错误。 锁定文件(解决方案) 目前 Lovable 可能没有显式的文件锁定功能,但你可以通过调整提示词来模拟。如果有一些关键文件 AI 永远不应该修改(可能是一个运行良好的复杂组件),你可以在每个提示中重复一条指令,例如: 不要更改 authentication.js 文件。 通过持续告诉 AI 避免修改,你可以减少不希望进行的编辑。类似地,如果你只想让 AI 在项目的某个部分工作,可以明确限制它: Focus changes solely on the ProfilePagecomponent; assume all other parts of the app remain as is. 在提示中明确这一点有助于将 AI 限制在范围内。 设计和界面调整 在 Lovable 中提示 UI 更改时,清晰度至关重要,以免破坏功能: • 如果你想要 纯粹的视觉变化 ,请说明。 “将登录按钮改为蓝色并放大 20%,但不要改变其任何功能或 onClick 逻辑。” 这样可以确保 AI 在重新设计时不会意外地重命名 ID 或更改逻辑。 • 对于 响应式设计 (使设计适合移动设备),请引导 AI 制定计划。例如: “优化移动端着陆页:采用移动优先的方法。首先概述每个部分在小屏幕上的重新排列方式,然后实现这些 CSS 更改。使用标准的 Tailwind 断点(sm、md、lg),并避免自定义断点。确保功能没有变化,只是布局。” 通过提供这类详细说明,你可以获得全面的移动端适配,而不会破坏桌面布局。 • 如果你有设计变更的考虑,描述期望的结果和任何限制(例如“保持相同的 HTML 结构,只需更新 CSS”)将帮助 AI 专注于正确的解决方案。AI 设计变更后,始终测试应用程序以确保一切按预期工作。 重构和优化代码 随着你的项目发展,Lovable 的 AI 可能会建议重构以提升性能或可维护性。重构提示是一个高级但非常有价值的应用场景: • 强调行为不变 : “重构代码以提高清晰度和效率,但 应用程序的功能和输出必须保持完全相同。” 这告诉 AI 重构不应引入错误或功能变更。 • 你可以先请求一个重构计划 : “扫描utils/文件夹,并建议代码结构或重复代码的改进。列出变更但不要立即应用。” AI 可能会给你一份需要改进的报告。然后你可以决定哪些变更需要提示实施。 • 对于大规模重构,分阶段进行。一次提示一个模块,测试后再继续。这符合逐步原则。例如:先重构状态管理逻辑,再重构 API 调用,而不是一次性全部完成。 • 重构后,建议提示一个快速的后检查 :“代码已重构,快速检查清单:界面是否相同,所有测试或关键流程是否仍然通过?” AI 可以自我验证或列出需要手动检查的事项。 AI 辅助调试 错误在所难免。Lovable 有一个“尝试修复”功能用于快速修复,但你也可以通过提示来调用 AI: • 当出现错误时,将任何 error 日志或消息复制到提示中(最好在聊天模式下),并询问:“这里提供了错误和相关代码片段——是什么导致了这个问题?我们该如何解决?” 详细的错误上下文有助于 AI 找到问题所在。 • 在调试时使用 CLEAR 原则:明确说明代码本应做什么以及实际发生了什么。有时,向 AI 详细解释错误就能引导它找到解决方案。 • 如果 AI 的初次修复无效,使用自适应原则:说明发生了什么变化或提供新的错误信息,并请求它再次尝试或提出替代方案。 • 利用聊天模式讨论错误:“修复无效。运行时状态仍然未定义。还有其他可能的问题吗?让我们一起分析可能的原因。” 你可以进行来回讨论,直到找到合理的解决方案,然后在默认模式下应用它。 • 对于 UI 问题,你可以甚至分享一个截图(如果 Lovable 在聊天中支持图片输入)或描述视觉问题。例如,“侧边栏应该在移动端隐藏,但它仍然可见。这是 CSS……为什么它可能失效?”如果提供足够的信息,AI 可以推理 CSS 或布局问题。 • 修复后一定要进行测试。如果修复有效,可以考虑使用反向元提示让 AI 总结根本原因以及如何在未来避免,从而丰富你的知识库。 何时(以及何时不要)涉及 AI • 一个熟练的提示者知道,有时候根本不需要提示。如果改动非常小,或者你已经知道如何快速完成(例如,修改文本标签、调整一个 padding 值),直接在代码编辑器中手动操作可能更快。过度依赖 AI 处理琐碎任务会拖慢你的速度并消耗你的提示配额。在 AI 能增加价值的地方使用它——复杂的逻辑、模板生成、多步骤操作,或者你不确定的事情。对于简单问题,你可以: ◦ 利用自己的知识或快速搜索(甚至可以在 Lovable 之外询问 ChatGPT)来解决问题,特别是如果这能避免在 AI 可能误解的事情上消耗提示配额。 ◦ 使用开发者工具:打开浏览器 DevTools 控制台来检查元素或实时调试 JavaScript 错误。一旦你找到解决方案,可以直接实施,或者通过提示来确认。 ◦ 利用自己的知识或快速搜索(甚至可以在 Lovable 之外询问 ChatGPT)来解决问题,特别是如果这能避免在 AI 可能误解的事情上消耗提示配额。 ◦ 使用开发者工具:打开浏览器 DevTools 控制台来检查元素或实时调试 JavaScript 错误。一旦你找到解决方案,可以直接实施,或者通过提示来确认。 如果你发现按钮颜色不对,可能直接自己修复 CSS 类会比向 AI 描述问题更快,而且还能避免 AI 做出超出预期的修改。另一方面,如果你需要从头实现一个新功能,那正是 AI 的用武之地——你描述需要做什么以及为什么,它就会在代码中找出如何实现的方法。 记住,Lovable 的 AI 就像一个助手开发者。你需要通过给出明确的任务和监督来管理它。它可以大幅加快开发速度,但你仍然是负责审核和指导工作的人。 在不同工具中应用这些策略 上述提示原则不仅适用于 Lovable 的聊天界面,也适用于你与 AI 或自动化工具的任何交互场景: 在 Lovable 的构建器中 你将主要在 Lovable 的聊天界面中使用这些提示来构建和优化你的应用。 1. 从一个宽泛的项目提示开始,然后逐个迭代功能。 2. 当你需要讨论或调试而不更改代码时,使用仅聊天模式。 使用 make.com 或 n8n(工作流自动化) 使用 make.com 或 n8n(工作流自动化) 你可能无法以同样的自然语言方式提示这些平台,但设计自动化仍然受益于清晰的 AI 指令 。例如,你可以让 Lovable 生成集成逻辑: 当表单提交时,将数据发送到 Make.com 的 webhook 以进行 Slack 通知。 当表单提交时,将数据发送到 Make.com 的 webhook 以进行 Slack 通知。 事实上,Lovable 可以通过与 webhooks 集成来帮助设置自动化。如果你的应用需要交接任务(比如发送邮件、更新 CRM),你可以提示 Lovable 使用 Make 或 n8n。 当用户在应用中注册后,触发 Make.com 工作流,在 Salesforce 中创建记录。 当用户在应用中注册后,触发 Make.com 工作流,在 Salesforce 中创建记录。 Lovable 将编写调用该 webhook 或 API 的代码。保持提示结构化,确保 AI 确切知道如何将 Lovable 与这些外部服务连接起来。 边缘案例和外部集成 Lovable 与许多服务(Stripe、GitHub、Supabase 等)集成。在提示这些服务时,将集成细节视为您上下文/约束的一部分。例如, 将表单连接到 Stripe(测试模式)进行支付。成功后,重定向到/thank you。 明确说明外部服务应该做什么。使用 n8n(自托管自动化)也是如此——您可以这样写, 在表单提交后向 n8n webhook URL 发送 POST 请求,并等待其响应以显示确认消息。 此处清晰度至关重要,以便 AI 生成正确的调用。 摘要 • 强烈的提示在于清晰度、结构和上下文 。无论是告诉 Lovable 构建功能,还是协调 Make.com 场景,目标都是描绘出你想要的样子。 Make.com • 如果你不确定,可以从结构化提示开始,随着自信的提升逐渐过渡到更对话式的风格。 • 使用元技术来改进并从每次交互中学习。 • 通过练习,你将像扩展你的开发团队一样引导 AI——并且获得你需要的精确输出会感觉自然。 结论 到如今,你应该已经牢固掌握了如何制作清晰、有效且针对 Lovable AI 量身定制的提示。从基础的 CLEAR 原则到高级策略,如少量示例和元提示,这些技术赋予你从 AI 获取所需的能力——不多不少。你学会了如何构建你的请求、提供背景信息、避免幻觉等陷阱,并利用 Lovable 特定功能(知识库、聊天模式等)来简化你的工作流程。大师级的提示是变革性的:它将 AI 从噱头转变为可靠的队友。通过练习,你会发现你能更快地构建应用,减少调试的挫败感,甚至通过简单地提出正确的问题和给予正确的指导来探索创意解决方案。关键在于你的指令要保持聪明、简洁、直接和适应性强 ——就像经验丰富的工程师与团队沟通一样。最后,始终从每次互动中学习(培养反思的习惯)。每个提示/响应都是让你进一步改进技术的反馈。随着你在 Lovable 中不断构建,你会逐渐形成一种直觉,知道 AI 需要听到什么才能产生出色的结果。结合你自己的创造力,几乎没有你无法实现的目标。专注于你的大想法 ——一旦你清晰地告诉 Lovable 要做什么,就让它来处理执行细节。祝你提示愉快,构建愉快! 原文链接:https://x.com/luoleiorg/status/1972928152507978196 原文链接:https://x.com/luoleiorg/status/1972928152507978196 强烈建议各位 开发者/产品经理 朋友花 15 分钟看看这个文档 Lovable 官方的 Prompting 1.1 手册太棒了,这份手册是 Vibe Coding 的完整方法论:从 C.L.E.A.R. 框架到元提示等高阶技巧,帮你告别无效尝试,让 AI 协作更精准。不仅省时间,还能节省 Tokens 和成本! Prompting 1.1 提示结构、提示级别、元/反向元提示以及基础策略,并附有示例。 注意! 为了帮助您充分利用 Lovable,我们整理了一系列提示策略和方法。其中一些来自我们团队的经验,另一些则由我们的社区成员分享给我们。由于 Lovable 依赖于大型语言模型(LLMs),有效的提示策略可以显著提高其效率和准确性。 什么是提示? 提示是指您向 AI 系统提供的用于执行任务的文本指令。在 Lovable(一个 AI 驱动的应用构建器)中,提示是您“告诉”AI 要做什么的方式——从创建 UI 到编写后端逻辑。有效的提示至关重要,因为 Lovable 使用大型语言模型(LLMs),因此清晰、精心设计的提示可以大大提高 AI 在构建您的应用时的效率和准确性。简而言之,更好的提示带来更好的结果。 提示的重要性 大多数人认为提示只是将请求输入到 AI 中并希望最好的结果——不是这样 。 mediocre AI 响应与让 AI 为您构建整个工作流程之间的区别在于如何提示 。无论您是开发者还是非技术人员,掌握Lovable 中的提示工程可以帮助您: • 通过精确指示 AI 来自动化重复任务 。 • 更快地调试 ,借助 AI 生成的洞察和解决方案。 • 轻松构建和优化工作流程 ,让 AI 在正确引导后承担繁重工作。 最好的部分是什么?你不需要成为专家程序员。通过正确的提示技巧,你可以在 Lovable 中解锁 AI 的全部潜力,而无需浪费时间和精力进行无效尝试。这本指南将带你从基础概念到高级提示策略,让你能够有效地与 AI 沟通并更快地构建。 理解 AI 的思考方式 与传统编程不同,与 AI 合作的关键在于清晰地传达你的意图。像 Lovable 所使用的那些驱动大型语言模型(LLMs)并不以人类的方式“理解”——它们根据训练数据中的模式来预测输出。这对你应该如何提示具有重要影响:为了获得一致的结果,将你的提示结构化为清晰的段落会很有帮助。一个推荐的格式(可以作为提示的“训练轮”)使用标记的段落来表示上下文 、任务 、指南和约束 : • 提供上下文和详细信息:AI 模型没有常识或超出你给予它们的隐含上下文。始终提供相关的背景或要求。例如,不要只说“构建一个登录页面”,而应指定细节:“使用 React 创建一个登录页面,具有电子邮件/密码认证和 JWT 处理。” 明确包含任何技术栈或工具(例如,“使用 Supabase 进行认证”)。 • 明确指令和约束: 不要假设 AI 会推断你的目标。如果你有约束或偏好,请说明。例如,如果输出需要使用特定库或保持在特定范围内,应提前告知模型 。AI 将严格遵循你的指令 字面意思 ——模糊不清可能导致不期望的结果或 AI“幻觉”(编造的信息)。 • 结构很重要(顺序和强调): 由于 Transformer 架构,模型会特别关注提示的开头和结尾 。利用这一点,将最关键的信息或请求放在开头,并在需要时在结尾处重申任何绝对要求。同时请记住模型有一个固定的上下文窗口 ——过长的提示或非常长的对话可能会导致 AI 忘记早期的细节。保持提示的焦点,并在必要时刷新上下文(例如,如果会话较长,提醒模型关键点)。 • 了解模型的局限:AI 的知识来源于训练数据。它无法了解近期事件或你没有提供专有信息。即使它在猜测,也会试图 显得自信(这会导致幻觉)。对于事实性问题,始终提供参考文本或数据,或准备好验证其输出。 将提示视为告诉一个非常字面意思的实习生确切需要什么。你的指导越清晰、越结构化,结果就越好。接下来,我们将深入探讨使提示有效的核心原则。 核心提示原则:C.L.E.A.R.框架 好的提示遵循一套简单的原则。一个方便记住它们的方法是清晰 :简洁、逻辑、明确、适应、反思 。在编写指令时,使用这些作为检查清单: • 简洁: 清晰简洁。多余的废话或模糊语言会迷惑模型。使用直接的语言:例如,错误:“你能写一些关于科学话题的东西吗?” 正确:“写一个 200 字的总结,说明气候变化对沿海城市的影响 。” 避免填充词——如果细节没有指导性,就会分散注意力。在描述你想要的内容时,力求精确和简洁。 • 逻辑: 按步骤或结构化方式组织你的提示。将复杂请求分解为有序步骤或项目符号,以便 AI 轻松理解。避免一次性提出连续请求,而应分清主次。 错误:“为我构建一个用户注册功能,并展示一些使用统计。” 正确:“首先,使用 Supabase 实现一个带有电子邮件和密码的用户注册表单。然后,在成功注册后,显示一个展示用户数量统计的仪表板。” 逻辑流程确保模型系统性地处理你的每个请求部分。 • 明确: 明确说出你想要和不想要的内容。如果某件事很重要,请详细说明。如果可能,提供格式或内容的示例。模型拥有广泛的知识,但它不会读心术来了解具体细节。 错误:“告诉我关于狗的事情。”(过于开放。) 正确:“以项目符号列表形式列出 5 个关于金毛猎犬的独特事实。” 同样,如果你有期望的输出风格,请说明(例如“以 JSON 格式回应”或“使用休闲语气”)。将 AI 当作初学者对待:假设没有任何事情对它来说是显而易见的。 • 自适应: 如果第一个答案不完美,不要满足于它——提示可以迭代优化 。Lovable AI(以及 LLMs 的一般优势)在于可以进行对话。如果初始输出不理想,调整你的方法 :在后续提示中澄清指令或指出错误。例如,“你提供的解决方案缺少身份验证步骤。请在代码中包含用户认证。” 通过迭代,你可以引导模型获得更好的结果。你甚至可以询问 AI 如何改进提示本身(这是 元提示 ,后面会介绍)。 • 反思: 每次与 AI 交互后,花时间回顾哪些地方有效,哪些地方无效。这更多是关于 你而不是模型——作为提示工程师,记下哪些提示措辞得到了良好结果,哪些导致了困惑。在复杂会话后,你甚至可以要求 AI 总结最终解决方案或推理 (我们很快会讨论反向元提示)。反思有助于你在未来编写更好的提示,建立 AI 沟通中的持续改进循环。 在开发提示时,请牢记这些清晰的准则。接下来,我们将从基础到高级,探讨具体的提示技巧,包括如何构建提示以及如何利用 AI 作为合作伙伴。 提示的四个层次 有效的提示是一种随着练习而提升的技能。这里我们概述了四个提示掌握层次,从结构化的“训练轮”到高级元技术。每个层次都有其适用场景——根据需要组合使用: 1. 结构化的“训练轮子”提示 (明确格式) 当你刚开始或处理一个非常复杂的任务时,在提示中使用标记结构会很有帮助。这就像训练轮一样,确保你提供所有必要的信息。Lovable 中一个经过验证的格式是将提示分成如下几个部分: • 背景: 为 AI 设置的背景或角色。(例如:“你是一个世界级的 Lovable AI 编程助手。”) • 任务: 你想要达成的具体目标。(例如:“构建一个全栈待办事项应用,包含用户登录和实时同步。”) • 指南: 首选的方法或风格。(例如:“使用 React 进行前端开发,使用 Tailwind 进行样式设计,使用 Supabase 进行认证和数据库操作。”) • 约束: 严格的限制或必须避免的事项。(例如:“不要使用任何付费 API。应用应在移动端和桌面端运行。”) 通过清晰地标记每个部分,可以减少误解的空间。例如,提示可能看起来像: 上下文: 你是一个使用 Lovable 的全栈开发专家。 任务: 使用 React 和 Supabase(邮箱/密码认证)创建一个安全的登录页面。 指南:UI 应该极简,并遵循 Tailwind CSS 规范。为每个步骤提供清晰的代码注释。 限制: 仅修改 LoginPage 组件;不要更改其他页面。确保最终输出是 Lovable 编辑器中的一个可工作页面。 这个详细程度指导 AI 一步步操作。Training Wheels 提示非常适用于新手或复杂的分步任务——它迫使你精确思考你需要什么,并通过结构化请求帮助模型。 2. 对话式提示(无训练轮子) 随着你逐渐熟悉,你将不再需要如此严格的结构。对话式提示意味着你可以更自然地写给 AI,类似于你向同事解释任务的方式,同时仍然保持清晰。关键在于保持清晰和完整而不需要正式标签。例如: 让我们开发一个上传头像的功能。它应该包含一个表单,带有图片文件输入框和提交按钮。提交时,应将图片存储在 Supabase 存储中并更新用户资料。请编写必要的 React 组件以及任何所需的后端函数,并确保优雅地处理错误(如文件过大)。 这是一个更自由形式的提示,但仍然在逻辑顺序和明确要求方面 。没有辅助轮,但它是有效的。一旦你相信自己不会忘记重要细节,对话式提示就会效果很好。它们使互动更自然,尤其是在持续对话中,你正在迭代结果。 💡 即使在对话式风格中,你也可以通过分段或使用项