i-love-video
一个简单好用且免费的视频剪辑网站❤
上线地址：http://8good.top
项目源码：https://github.com/axing521/i-love-video
1.功能列表
- 视频轨道
- 上传视频（P0）：支持mp4格式的视频上传，作为编辑器的基础素材，编辑器中的视频时长和上传的视频保持一致。上传视频后可在编辑器中查看和播放。✅
- 视频裁剪（P2）：可将视频在指定位置做裁剪，裁剪后视频将从裁剪出分成两个视频片段✅
- 删除（P2）：可删除指定视频片段✅
- 字幕轨道
- 自定义时间（P0）：支持字幕开始和结束时间的编辑✅
- 多字幕-单轨（P1）：支持不同时间段出现多个字幕✅
- 多字幕-双轨（P2）：支持在同一时刻上出现两个字幕轨道，即画面同时可出现两种字幕✅
- 自定义位置（P1）：提供用户编辑字幕位置的功能✅
- 自定义字号、颜色（P1）：提供字号、颜色的编辑功能✅
- 艺术字（P2）：支持字幕的花样展示设置，具体形式不限，可充分发挥想象力🚧
- 贴图轨道
- 自定义时间（P0）：支持贴图开始和结束时间的编辑✅
- 自定义位置（P1）：提供用户编辑贴图位置的功能✅
- 自定义放缩、旋转（P2）：提供放缩、旋转的编辑功能🚧（放缩功能完成）
- 多轨道（P2）：最多支持三轨道，即最多在同一时刻出现3张贴图✅
- 酷炫设置（P2）：具体形式不限，可充分发挥想象力，支持各种贴图酷炫效果🚧
- 预览
- 从头预览（P0）：点击预览按钮，支持预览当前的效果✅
- 指定位置预览（P1）：拖动游标，支持任意时刻的效果预览✅
- 其他功能
- 删除（P1）：支持各元素的删除功能✅
- 回退（P2）：支持在编辑过程中，按Ctrl+Z或指定按钮，回退当前的操作🚧
- 导出（P0）：无需真正导出制作好的视频，定义好数据接口，点击导出按钮弹一个对话框把要传给后端的数据展示出来即可✅
- 附加功能（音频轨道）
- 自定义时间：支持音频开始和结束时间的编辑✅
2.源码地址
项目源码：https://github.com/axing521/i-love-video
3.线上演示
上线地址：http://8good.top
4.方案设计
见附件（方案设计.pdf）
5.演示视频
录屏演示：https://i-love-video.oss-cn-beijing.aliyuncs.com/i-love-video.mp4
技术栈：
- 🎪 基于 vue3 框架开发
- ⚡ 基于 vite 开发，获取更快速的启动速度
- 🦾 完全使用 typescript 提供完备的代码类型检查
- 🔋 使用pinia 提供状态管理服务，极大地简化了组件间通信
UI库：
- Element-plus
音视频工具包:
- FFmpeg
📦 Install
pnpm install🦄 serve
pnpm run dev🧱 build
pnpm run build