一.引入video.js
yarn add video.js @videojs-player/vue --save
或者
npm install video.js @videojs-player/vue --save
二.vue3项目main.js引入
import VueVideoPlayer from "@videojs-player/vue"
import "video.js/dist/video-js.css"
const app = createApp(App)
app.use(VueVideoPlayer)
三.测试是否引入成功
找到随便一个页面文件粘贴以下代码(其中的src改成具体视频url)
<video id="myVideo" class="video-js vjs-default-skin vjs-big-play-centered" controls preload="auto">
<source
src="http://192.168.10.100:111/api/file/download/3c52c250-876b-449f-9ac1-48c6bb1ef72f?token=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpZCI6IjEiLCJ1c2VybmFtZSI6InJvb3QiLCJpYXQiOjE2OTA4NTE2ODgsImV4cCI6MTc3NzI1MTY4OH0.6jbaN9a_55w9MBT1JoM3pASeVatsDOiq6rrnrIaE740"
type="video/mp4"
/>
</video>