用Vue全家桶手工搓了一个类似抖音短视频的软件,全开源

用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(设备仿真模拟)

免责声明:

本项目仅适用于技术研究和分享,不得用于商业使用 作者:zyronon

在这里插入图片描述
在这里插入图片描述

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

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

Octopus V2:设备端super agent的高级语言模型

论文:Octopus v2: On-device language model for super agent论文地址:https://arxiv.org/abs/2404.01744模型主页:https://huggingface.co/NexaAIDev/Octopus-v2 Octopus-V2-2B Octopus-V2-2B 是一款具有20亿参数的开源先进语言模型&#…

性能分析-docker知识

docker的相关概念 docker是一个做系统虚拟化的软件,跟vmware类似,虚拟出来的也是操作系统。我们现在在企业中, 使用docker虚拟出来的系统,大多都是linux系统。 docker镜像image:就是虚拟一个docker容器需要的操作系统…

Ubuntu 20.04.06 PCL C++学习记录(十八)

[TOC]PCL中点云分割模块的学习 学习背景 参考书籍:《点云库PCL从入门到精通》以及官方代码PCL官方代码链接,,PCL版本为1.10.0,CMake版本为3.16 学习内容 PCL中实现欧式聚类提取。在点云处理中,聚类是一种常见的任务,它将点云数据划分为多…

基于单片机三相温度测量控制系统设计

**单片机设计介绍,基于单片机三相温度测量控制系统设计 文章目录 一 概要二、功能设计设计思路 三、 软件设计原理图 五、 程序六、 文章目录 一 概要 基于单片机三相温度测量控制系统设计概要主要包括系统组成、温度测量原理、控制逻辑、软件设计以及测试与验证等…

2.k8s架构

目录 k8s集群架构 控制平面 kube-apiserver kube-scheduler etcd kube-controller-manager node 组件 kubelet kube-proxy 容器运行时(Container Runtime) cloud-controller-manager 相关概念 k8s集群架构 一个Kubernetes集群至少包含一个控制…

PPT 操作

版式 PPT中,巧妙使用母版,可以提高效率。 双击母版,选择其中一个版式,插入装饰符号。 然后选择关闭。 这个时候,在该版式下的所有页面,就会出现新加入的符号。不在该版式下的页面,不会出现新加…

八股面试——数据库——索引

索引的概念 B树的概念: 索引的作用 聚簇索引与非聚簇索引 聚簇索引就是主键值,在B树上,通过主键大小(数据在B树叶子节点按主键顺序排序)寻找对应的叶子节点,叶子节点保存的一整条记录。 非聚簇索引&#x…

Mysql底层原理一:事务

因为数据库操作也是并发操作,多个客户端在操作的时候,可能会存在很多问题 1. 一些问题 ● 脏写(人家还没有提交,我可以改别人的数据),这个在数据库不存在,已经通过锁解决了 ● 脏读&#xff0…

ctfshow web入门 命令执行 web53--web77

web53 日常查看文件 怎么回事不让我看十八 弄了半天发现并不是很对劲,原来我发现他会先回显我输入的命令再进行命令的回显 ?cnl${IFS}flag.php||web54 绕过了很多东西 基本上没有什么命令可以用了但是 grep和?通配符还可以用 ?cgrep${IFS}ctfshow${IFS}???…

分类预测 | Matlab实现ABC-LSSVM人工蜂群算法优化最小二乘支持向量机数据分类预测

分类预测 | Matlab实现ABC-LSSVM人工蜂群算法优化最小二乘支持向量机数据分类预测 目录 分类预测 | Matlab实现ABC-LSSVM人工蜂群算法优化最小二乘支持向量机数据分类预测分类效果基本介绍程序设计参考资料 分类效果 基本介绍 1.Matlab实现ABC-LSSVM人工蜂群算法优化最小二乘支…

SpringBoot 使用redis

目录 一、pom.xml 二、application.properties 三、编写一个配置类用于解决乱码问题和对象真实的类型问题 四、代码案例 4.1 model 准备 因为有可能存对象 4.2 使用redis 操作string 4.3 使用redis 操作list 4.4 使用redis 操作hash 4.5 使用redis 操作set 4.6 使用…

BeautifulSoup数据抓取优化

优化 BeautifulSoup 数据抓取可以帮助提高数据抓取的效率和性能,优化的数据抓取方式更加友好,减少了对目标网站的访问压力,降低了被封禁或限制访问的风险。那边在日常中会遇到一些复杂的问题,如何解决?看看下面的几种解…

React项目如何捕获错误

React项目如何捕获错误 1. 错误捕获的基本方法1.1 组件级别的错误处理1.2 使用错误处理库1.3 React的错误边界(Error Boundaries) 2. 错误边界的限制 在构建React应用程序时,错误处理是一个不可忽视的重要方面。有效地捕获和处理错误不仅可以…

【C++】详解vector二维数组的全部操作(超细图例解析!!!)

目录 一、前言 二、 深度理解vector 的二维数组(重点!) 三、vector 二维数组的空间理解(重点!) ✨问题分析 ✨如何合理定制vector的内存空间 四、vector 二维数组的初始化 五、vector 二维数组的 添加…

性能优化 - 你能说一说,为什么做了骨架屏,FCP的指标还是没有提升吗

难度级别:中高级及以上 提问概率:80% FCP的全程是First Contentful Paint,是衡量网页性能的一个重要指标,很多人把FCP理解为元素内容首次渲染到浏览器上的时间。但由于现在比较流行的Vue或是React项目中,HTML文档最初只有一个id为app的DIV…

自建ceph存储集群方案之从零到一

概述 根据硬件摩尔定律,硬件成本随时间越来越低,性能较之前越来越高,尤其是随着pcie全闪灯普及,理论上作为云服务的基础设施,存储应该越来越便宜。然而,购置商用sds产品的成本却一直居高不下,越…

在unbuntu服务器上使用nginx+uwsgi部署django项目

一、配置nginx 1. 安装nginx apt-get install nginx2. 编写nginx配置文件 进入nginx.conf文件路径:/etc/nginx/nginx.conf 编写以下内容: events {worker_connections 1024; # 工作进程的最大连接数量 }http{include mime.types;# 日志格式及保存路径…

(译) 理解 Elixir 中的宏 Macro, 第五部分:组装 AST

Elixir Macros 系列文章译文 [1] (译) Understanding Elixir Macros, Part 1 Basics[2] (译) Understanding Elixir Macros, Part 2 - Macro Theory[3] (译) Understanding Elixir Macros, Part 3 - Getting into the AST[4] (译) Understanding Elixir Macros, Part 4 - Divin…

【Labview】虚拟仪器技术

一、背景知识 1.1 虚拟仪器的定义、组成和应用 虚拟仪器的特点 虚拟仪器的突出特征为“硬件功能软件化”,虚拟仪器是在计算机上显示仪器面板,将硬件电路完成信号调理和处理功能由计算机程序完成。 虚拟仪器的组成 硬件软件 硬件是基础,负责将…

数字化转型回归底层逻辑

2024年第一季度已然过去,对于我们每个人而言,这都是一次严峻的挑战。2015年,蚓链数字化营销系统踏上研发之路。让我们回顾数字技术对企业的影响阶段:2012-2015 年,互联网在消费端产生巨大影响,引发了虚拟经…