EasyPlayer.js 在VUE中使用

最新推荐文章于 2025-09-09 20:00:59 发布

原创最新推荐文章于 2025-09-09 20:00:59 发布 · 1.2w 阅读

10 ·

CC 4.0 BY-SA版权

程序人生专栏收录该内容

23 篇文章

订阅专栏

本文介绍如何在遇到UncaughtReferenceError:videojsisnotdefined错误时，通过安装和配置@easydarwin/easyplayer及copy-webpack-plugin来解决前端音视频播放问题。包括详细步骤和在index.html中正确引用资源。

楔子

不是专业的前端，只是需要使用，网上各种博客都是官方那些，可以按照操作后提示Uncaught ReferenceError: videojs is not defined

解决

官网地址

npm install @easydarwin/easyplayer --save
npm install --save-dev copy-webpack-plugin

1 copy-webpack-plugin

在这里插入图片描述

npm install --save-dev copy-webpack-plugin

webpack.dev.conf.js

## 引入
const CopyWebpackPlugin = require('copy-webpack-plugin')

在 module  plugins 配置 上述
    new CopyWebpackPlugin([

        { from: 'node_modules/@liveqing/liveplayer/dist/component/crossdomain.xml'},
            { from: 'node_modules/@liveqing/liveplayer/dist/component/liveplayer.swf'},
            { from: 'node_modules/@liveqing/liveplayer/dist/component/liveplayer-lib.min.js', to: 'js/'},
          {from :'node_modules/@easydarwin/easyplayer/dist/component/EasyPlayer.swf'},
          {from :'node_modules/@easydarwin/easyplayer/dist/component/crossdomain.xml'},
          {from :'node_modules/@easydarwin/easyplayer/dist/component/EasyPlayer-lib.min.js'},
            {
              from: path.resolve(__dirname, '../static'),
              to: config.dev.assetsSubDirectory,
              ignore: ['.*']
            },
    ])