用Vue全家桶手工搓了一个高仿抖音源码 全开源

用Vue全家桶手工搓了一个高仿抖音,全开源

PC浏览器请用手机模式访问。先按F12调出控制台,再按Ctrl+Shift+M切换到手机模式,手机请用Via浏览器或者Chrome浏览器预览。其他浏览器会强制将视频全屏,导致样式都失效。

运行项目:

本项目是基于 Vue 开发的,需要 node 环境来运行。

1. 安装 NodeJS,参考官方文档

2. 安装 pnpm 包管理工具,运行 npm install -g pnpm 来安装

3. 上传项目源码到项目根目录

4. 进入项目目录cd douyin,在项目根目录下,运行pnpm install来下载依赖。

5. 执行pnpm dev来启动项目,项目默认地址为http://localhost:3000

6. 在浏览器中打开http://localhost:3000 来访问项目。 Chrome 切换成手机模式快捷键,先按 F12 调出控制台,再按 Ctrl+Shift+M(设备仿真模拟)

源码下载:https://download.csdn.net/download/m0_66047725/89080748

更多资源下载:关注我。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:/a/563095.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

【C++】STL:vector常用接口的使用和模拟实现

Hello everybody!这篇文章主要给大家讲讲vector常用接口的模拟实现,STL库中的实现一层套着一层,十分复杂,目前阶段还不适合看源代码。而模拟实现可以让我们从底层上了解这些接口的原理从而更好的使用这些接口。另外我还会讲一些在vector使用过…

【第34天】SQL进阶-SQL高级技巧-Window Funtion(SQL 小虚竹)

回城传送–》《100天精通MYSQL从入门到就业》 文章目录 零、前言一、练习题目二、SQL思路初始化数据什么是Window Funtion窗口函数的分类语法结构第一种写法:第二种写法: 实战体验序号函数:row_number()序号函数:rank()序号函数&…

【树莓派Linux内核开发】入门实操篇(虚拟机Ubuntu环境搭建+内核源码获取与配置+内核交叉编译+内核镜像挂载)

【树莓派Linux内核开发】入门实操篇(虚拟机Ubuntu环境搭建内核源码获取与配置内核交叉编译内核镜像挂载) 文章目录 【树莓派Linux内核开发】入门实操篇(虚拟机Ubuntu环境搭建内核源码获取与配置内核交叉编译内核镜像挂载)一、搭建…

什么是0-day漏洞,怎么防护0-day漏洞攻击

随着信息技术的快速发展,网络安全问题日益凸显,其中0day漏洞攻击作为一种高级威胁手段,给企业和个人用户带来了极大的风险。下面德迅云安全就对0day漏洞攻击进行简单讲解下,并分享相应的一些安全措施,以期提高网络安全…

网络空间地图测绘理论体系白皮书(2023年)02网络空间测绘研究背景(想法比较好,着重看)

01前言 02 网络空间测绘研究背景 2.1 网络空间的起源 2.2 传统测绘理论 2.3 网络空间测绘相关工作 03 测绘体系框架概念定义 3.1 网络空间 3.2 网络空间地图测绘 3.3 体系框架总体思路 04 测绘体系框架应用实践 4.1 网络空间地形图 4.2 网络空间地志图 4.3 网络空间战略图 05 总…

Python 全栈安全(一)

原文:annas-archive.org/md5/712ab41a4ed6036d0e8214d788514d6b 译者:飞龙 协议:CC BY-NC-SA 4.0 前言 序言 多年前,我在亚马逊搜索了一本基于 Python 的应用程序安全书。我以为会有多本书可供选择。已经有了很多其他主题的 Pyt…

【ZYNQ】Zynq 芯片介绍

Zynq 是 Xilinx 公司提出的全可编程 SoC 架构,集成了单核或多核 ARM 处理器与 Xilinx 16nm 或 28nm 可编程逻辑,包括 Zynq 7000 Soc,Zynq UltraScale MPSoC 和 Zync UltraScale RFSoC 等系列。本文主要介绍 Xilinx Zynq 7000 系列芯片架构、功…

Hadoop1X,Hadoop2X和hadoop3X有很大的区别么?

Hadoop的演进从Hadoop 1到Hadoop 3主要是为了提供更高的效率、更好的资源管理、更高的可靠性以及对更多数据处理方式的支持。下面是Hadoop 1, Hadoop 2, 和 Hadoop 3之间的主要区别和演进的原因: Hadoop 1 特点: 主要包括两大核心组件:HDFS&a…

simple-jwt快速入门(包含自定制)

simple-jwt快速入门(包含自定制) 目录 simple-jwt快速入门(包含自定制)安装路由层视图层全局配置前端传入参数配置文件定制登录返回格式定制payload格式自定制签发-认证 安装 pip install djangorestframework-simplejwt路由层 from rest_framework_simplejwt.views import T…

【 AIGC 研究最新方向(上)】面向平面、视觉、时尚设计的高可用 AIGC 研究方向总结

目前面向平面、视觉、时尚等设计领域的高可用 AIGC 方向有以下 4 种: 透明图层生成可控生成图像定制化SVG 生成 本篇(上篇)介绍 1、2,而下篇将介绍 3、4。 透明图层生成 LayerDiffuse 代表性论文:Transparent Imag…

Qt基础之四十六:Qt界面中嵌入第三方程序的一点心得

本文主要讲解QWidget和QWindow的区别,以及如何在QWidget中嵌入第三方程序,并完美解决在QWidget中嵌入某些程序(比如Qt程序)时出现的白边问题。 下面是嵌入QQ音乐的样子,这首歌还不错。 先用spy++查看QQ音乐的窗口信息,如果安装了Visual Studio,工具菜单里自带spy++ 然后…

Spring Boot | Spring Boot 默认 “缓存管理“ 、Spring Boot “缓存注解“ 介绍

目录: 一、Spring Boot 默认 "缓存" 管理 :1.1 基础环境搭建① 准备数据② 创建项目③ 编写 "数据库表" 对应的 "实体类"④ 编写 "操作数据库" 的 Repository接口文件⑤ 编写 "业务操作列" Service文件⑥ 编写 "applic…

Redis入门到通关之数据结构解析-QuickList

文章目录 ☃️前提概要☃️ 配置项相关☃️简要源码☃️总结 Redis中的 QuickList 是一种特殊的数据结构,用于存储列表类型的数据。它的设计目的是在内存中高效地存储和操作大量的列表元素,尤其是当列表长度很大时。 QuickList的内部结构是一个由多个节…

政安晨:【Keras机器学习示例演绎】(八)—— 利用 PointNet 进行点云分割

目录 简介 导入 下载数据集 加载数据集 构建数据集 预处理 创建 TensorFlow 数据集 PointNet 模型 排列不变性 变换不变性 点之间的相互作用 实例化模型 训练 直观了解培训情况 推论 最后说明 政安晨的个人主页:政安晨 欢迎 👍点赞✍评论…

【PCL】教程 implicit_shape_model.cpp 3D点云数据的对象识别 利用隐式形状模型进行训练和识别...

ism_test_cat.pcd 参数:ism_train_cat.pcd 0 ism_train_horse.pcd 1 ism_train_lioness.pcd 2 ism_train_michael.pcd 3 ism_train_wolf.pcd 4 ism_test_cat.pcd 0 这里红点表示对应感兴趣类别的对象预测中心 ./ism_t…

字节FE:JavaScript学习路线图

JavaScript简介 JavaScript是一种高级的、解释执行的编程语言。它是互联网的三大核心技术之一,与HTML和CSS一同工作,用于创建交互式的网页。JavaScript被所有现代网页浏览器支持而不需要任何插件。它可以增强用户界面和网页的交互性,可以进行…

【讲解下Spring Boot单元测试】

🌈个人主页: 程序员不想敲代码啊 🏆CSDN优质创作者,CSDN实力新星,CSDN博客专家 👍点赞⭐评论⭐收藏 🤝希望本文对您有所裨益,如有不足之处,欢迎在评论区提出指正,让我们共…

FineBi中创建自定义的图表

FineBi中增加自己的自定义图表组件,比如: 的相关笔记: 1 获取有哪些BI自定义图表组件:http://localhost:8080/webroot/decision/v5/plugin/custom/component/list?_=1713667435473[{"name": "图表DEMO_EK","chartType": "amap_demo&q…

GO环境及入门案例

文章目录 简介一、win GO开发环境安装二、Linux go运行环境二、GO代码入门2.1 导包案例2.2 赋值2.3 变量、函数2.4 三方库使用 简介 go不是面向对象语言, 其指针、结构体等比较像C,知名的go 开源项目有docker k8s prometheus node-exporter等 一、win …

如何在3dMax中快速打包mzp 文件?

如何在3dMax中创建mzp 文件? 我喜欢将我的Maxscript脚本发布为mzp文件。这是一个为3dMax构建的自解压zip文件。在mzp文件中,您可以捆绑Maxscript脚本文件、图片、预设或其他文件,并链接安装时执行的特殊操作。 在3dMax中使用大型脚本时&…