Vue使用element-ui自定义主题色

218 阅读1分钟

一、安装element-ui

yarn add element-ui

二。安装Sass-loader、node-sass、安装node-sass的时候可能会遇到安装报错的原因,可以查看对应的node版本下载不同版本的node-sass

yarn add sass-loader

yarn add node-sass

三、在webpack中配置sass

{
      test: /\.scss$/,
      use: [
        'vue-style-loader',
        'css-loader',
        'sass-loader'
      ]
 }

四、创建sass文件

$--color-primary: #F8B500;
$--font-path: '~element-ui/lib/theme-chalk/fonts';
@import "~element-ui/packages/theme-chalk/src/index";

五、在main.js中引入sass文件就可生效

六、如何是没有入口文件,直接在.vue文件中引入就可以。