element-plus配置自定义类名

效果

在这里插入图片描述
element plus 的 el-前缀更改为 eplus-

安装sass

npm install -D sass-loader@^10 sass
npm install -D node-sass

在这里插入图片描述

新建更改样式类名文件index.scss

// styles/element/index.scss
// we can add this to custom namespace, default is 'el'
@forward 'element-plus/theme-chalk/src/mixins/config.scss' with (
  $namespace: 'eplus'
);
// ...

在这里插入图片描述

配置webpack

  loaderOptions: {
    
    
      // 给 sass-loader 传递选项
      sass: {
    
    
        // @/ 是 src/ 的别名
        // 这些是公共的scss变量和混合方法等
        additionalData:`@import "@style/element/index.scss";`,
  
      }
    }

mian.js导入element-ui.scss

@import "~element-plus/theme-chalk/src/index";

猜你喜欢

转载自blog.csdn.net/qq_22167557/article/details/126579287
今日推荐