使用视频
了解如何使用外部链接或 GitHub 上传将视频嵌入您的项目中
Lovable 提供两种方法来将视频嵌入您的项目中。以下,我们将逐步说明这两种选项:
链接到外部视频
最简单且推荐的方式是将视频链接到外部托管服务(如 YouTube)上。
示例提示:
嵌入此视频
https://www.youtube.com/watch?v=dQw4w9WgXcQ
到英雄内容部分。
使用 GitHub 公共文件夹中的视频
将大型视频上传到您的 GitHub 仓库可能会导致仓库大小增加,从而影响 Lovable 的性能(例如,仓库克隆时间延长、预览或沙箱启动变慢)。
更好的选择是使用托管服务(如 YouTube)或文件存储选项(如 S3),从而获得一个可引用的 URL,正如前述步骤所述。
您可以将视频上传到项目的 GitHub 仓库中,并直接引用它们。以下是具体步骤:
1. 连接您的 GitHub 仓库
首先,确保您的项目已链接到一个 GitHub 仓库。了解如何设置仓库。
2. 访问公共文件夹
在已连接的仓库中,导航到 public
目录。该文件夹专门用于托管项目资产,例如图像、视频和其他媒体文件。
3. 上传视频
现在,您可以通过拖拽方式添加视频,或点击 “选择文件” 以从本地计算机浏览并上传文件,将其放入公共文件夹中。
4. 提交文件
选择视频文件后,输入一个简短的提交消息(例如,“添加一个用于应用的 Mars 视频”),然后点击 “提交更改”。
5. 获取视频路径
上传完成后,点击视频文件,然后使用复制图标复制其路径。您将在下一步中使用该路径。
6. 在 Lovable 中引用视频
现在,您可以通过在提示中指定文件路径来嵌入视频。例如,可以使用以下提示:
示例提示:
在介绍部分插入一个额外的视频,使用此文件:
public/mars-video-nasa.mp4
请确保使用您之前复制的确切文件路径。
要查看这些方法的实际应用,请探索以下示例项目:Lovable 使用视频示例项目。您将在其中找到真实提示,演示了如何使用这两种方法集成视频。
此外,对于视频添加过程的更技术性细节,请查看此公共仓库:GitHub: 视频上传示例。它包含了视频上传和项目中使用的实现细节。