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]为自定义样式名,可不输入。

页面中引入

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

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

 

posted @   菜鸟小何  阅读(2779)  评论(2编辑  收藏  举报
编辑推荐:
· SQL Server 2025 AI相关能力初探
· Linux系列:如何用 C#调用 C方法造成内存泄露
· AI与.NET技术实操系列(二):开始使用ML.NET
· 记一次.NET内存居高不下排查解决与启示
· 探究高空视频全景AR技术的实现原理
阅读排行:
· 阿里最新开源QwQ-32B,效果媲美deepseek-r1满血版,部署成本又又又降低了!
· SQL Server 2025 AI相关能力初探
· AI编程工具终极对决:字节Trae VS Cursor,谁才是开发者新宠?
· 开源Multi-agent AI智能体框架aevatar.ai,欢迎大家贡献代码
· Manus重磅发布:全球首款通用AI代理技术深度解析与实战指南
点击右上角即可分享
微信分享提示