当前位置: 首页 > news >正文

element-plus 自定义命名空间 el-config-provider namespace 不起作用,html 的class值改变了,但是样式不对

今天按照文档,对elemen plus + vite 的项目,进行qiankun嵌套,发现子应用的element和主应用的element plus样式冲突,所以决定用element plus 的自定义命名空间处理下。
使用方法,按照文档来
第一步:vue文件内部添加自定义命名空间标签,自定义命名 ep

<template><el-config-provider namespace="ep"><!-- ... --></el-config-provider>
</template>

第二步:修改 namespace的变量值,将下面的代码,添加到你的文件内部

@forward 'element-plus/theme-chalk/src/mixins/config.scss' with ($namespace: 'ep'
);

第三步:将sass文件引入

import { defineConfig } from 'vite'
// https://vitejs.dev/config/
export default defineConfig({// ...css: {preprocessorOptions: {scss: {additionalData: `@use "~/styles/element/index.scss" as *;`,},},},// ...
})

文档到此结束。就是个大坑,结果就是,html变了,但是element css 的文件还是el-开头的,
所以还需要:替换element css 文件引入路径,我是再main.ts内引入的。

import 'element-plus/theme-chalk/src/index.scss'

到此,算是成功了。
如果报错,math.div****之类的,那就是sass版本太低了,更新下,升级下就好了。

相关文章:

  • 【中年危机】程序猿自救指南
  • 【C#】多线程中,跨线程实现对UI控件更新
  • 【并发程序设计】15.信号灯(信号量)
  • 企业百度百科词条怎么修改
  • Python 将Word、Excel、PDF、PPT文档转为OFD文档
  • 使用老毛桃制作USB安装盘并安装WIN10系统完整过程
  • 基于SpringBoot+Vue租房网站设计和实现(源码+LW+部署文档+讲解等)
  • 德国RS SMA100A原装二手sma100a信号发生器6G
  • Springboot校园美食推荐系统的开发-计算机毕业设计源码44555
  • 【Java面试】七、SpringMvc的执行流程、SpringBoot自动装配原理
  • docker 启动关闭,设置仓库地址
  • USB - ACK、NAK和STALL的含义
  • Android ANR Trace日志阅读分析技巧
  • STM32-14-FSMC_LCD
  • 2024年5月架构试题
  • __proto__ 和 prototype的关系
  • 《微软的软件测试之道》成书始末、出版宣告、补充致谢名单及相关信息
  • 【编码】-360实习笔试编程题(二)-2016.03.29
  • 2017-09-12 前端日报
  • CSS实用技巧
  • JavaScript对象详解
  • Map集合、散列表、红黑树介绍
  • node学习系列之简单文件上传
  • PHP的类修饰符与访问修饰符
  • Redis的resp协议
  • SwizzleMethod 黑魔法
  • 包装类对象
  • 初识MongoDB分片
  • 从零开始的webpack生活-0x009:FilesLoader装载文件
  • 聊聊flink的TableFactory
  • 设计模式(12)迭代器模式(讲解+应用)
  • 事件委托的小应用
  • 用Visual Studio开发以太坊智能合约
  • 最简单的无缝轮播
  • 06-01 点餐小程序前台界面搭建
  • ​Java基础复习笔记 第16章:网络编程
  • (21)起落架/可伸缩相机支架
  • (7)STL算法之交换赋值
  • (BAT向)Java岗常问高频面试汇总:MyBatis 微服务 Spring 分布式 MySQL等(1)
  • (搬运以学习)flask 上下文的实现
  • (南京观海微电子)——示波器使用介绍
  • (转)Linq学习笔记
  • (转)大道至简,职场上做人做事做管理
  • (转载)(官方)UE4--图像编程----着色器开发
  • .gitignore文件_Git:.gitignore
  • .NET DataGridView数据绑定说明
  • .NET MVC之AOP
  • .NET Standard 的管理策略
  • .NET/C# 推荐一个我设计的缓存类型(适合缓存反射等耗性能的操作,附用法)
  • .NET下的多线程编程—1-线程机制概述
  • /var/lib/dpkg/lock 锁定问题
  • [ C++ ] STL_vector -- 迭代器失效问题
  • []AT 指令 收发短信和GPRS上网 SIM508/548
  • [20171101]rman to destination.txt
  • [240903] Qwen2-VL: 更清晰地看世界 | Elasticsearch 再次拥抱开源!