vue中使用西瓜视频中引入自定义样式,绝对可以

首先配置sass-loader和raw-loader

方法,再vue-config.js中加上这一段代码

module.exports = {
    chainWebpack: config => {
        const svgRule = config.module.rule('svg')

        // 清除已有的所有 loader。
        // 如果你不这样做,接下来的 loader 会附加在该规则现有的 loader 之后。
        svgRule.uses.clear()

        // 添加要替换的 loader
        svgRule
            .use('raw-loader')
            .loader('raw-loader')
    }
}

然后命令行输入npx xgplayer eject [targetDir] [skinName]实现将播放器样式相关代码复制到指定相对路径[targetDir]下的.xgplayer/skin文件夹中,然后就可以任意修改实现自定义样式了。[skinName]为自定义样式名,可不输入。

页面中引入

import Player from 'xgplayer';
import './.xgplayer/skin/index.js';

  这样你就可以随心所欲地更改样式了么么哒

 

posted @ 2020-05-13 00:30  菜鸟小何  阅读(2767)  评论(2编辑  收藏  举报