Streamit v5.4.0 - 视频流 VueJS、React JS、Laravel、HTML 管理模板 + RTL preview 1

Streamit v5.4.0 - 视频流 VueJS、React JS、Laravel、HTML 管理模板 + RTL

bookmark

StreamIT 是一个完整的视频流媒体平台模板,提供影视内容展示、电商周边商城、用户账号体系等完整功能。模板包含 Vue、React、Next.js、Nuxt.js、Laravel Blade 五种技术实现,适合搭建影视点播平台、在线课程网站或视频内容聚合站。

HTML

项目简介

StreamIT 是一个完整的视频流媒体平台模板,提供影视内容展示、电商周边商城、用户账号体系等完整功能。模板包含 Vue、React、Next.js、Nuxt.js、Laravel Blade 五种技术实现,适合搭建影视点播平台、在线课程网站或视频内容聚合站。

技术栈

  • 前端框架: Vue 3 (Composition API)
  • 构建工具: Vite
  • 样式: Tailwind CSS + Bootstrap
  • 国际化: vue-i18n
  • 可选后端: Laravel + Blade

项目结构

text
streamithtml-540/streamit-html/
├── code-vue/                    # Vue 3 主实现
│   ├── dashboard/               # 管理后台
│   │   ├── .env.example
│   │   ├── index.html
│   │   └── vite.config.js
│   └── frontend/                # 用户前端
│       ├── .env.example
│       ├── index.html
│       └── vite.config.js
├── code-react/                  # React 实现
│   ├── dashboard/
│   └── frontend/
├── code-next/                   # Next.js 实现
├── code-nuxt/                   # Nuxt.js 实现
└── laravel+blade/               # Laravel 后端实现
    └── .env.example

核心文件说明

  • code-vue/frontend/ — 用户端主应用,包含首页、影片详情、播放器等页面
  • code-vue/dashboard/ — 管理后台,用于内容管理和数据分析
  • code-next/ — Next.js SSR 实现,含完整路由配置和 i18n 国际化
  • code-nuxt/ — Nuxt.js 实现,使用 Pinia store 管理状态
  • laravel+blade/.env.example — Laravel 后端环境变量模板,配置数据库、Redis、邮件等服务

快速开始

bash
# Vue 前端
cd streamithtml-540/streamit-html/code-vue/frontend
npm install
npm run dev

# Vue 管理后台
cd streamithtml-540/streamit-html/code-vue/dashboard
npm install
npm run dev

# Next.js 版本
cd streamithtml-540/streamit-html/code-next
npm install
npm run dev

使用建议

该模板功能完整但体积较大,部署前建议按需裁剪。Next.js 版本支持 SSR 利于 SEO,适合作为主要生产方案。国际化配置集中在 i18n.tsi18n.config.ts 中,正式使用前请完成多语言文案填充。

help_outline

常见问题