首先推荐的方式是通过SCSS变量来修改Element样式，这种方式需要我们创建一个SCSS文件。一般是在项目中src中新建一个styles文件夹，在文件夹中创建element-variables.scss。我们可以从Element官网中将这个拷贝
这里的$--color-primary:teal就是SCSS变量，通过修改这个变量的值，就可以改变Element的主要颜色。font-path必须保留，我们不用管。最后一个@import就是引入Element所有组件中的SCSS文件。
接下来我们在项目中引入这个SCSS文件 ，现在我们项目中的样式就可以通过SCSS变量修改
如何查看有哪些变量可以修改呢？这里官网中并没有介绍。我们打开项目目录，展开根目录下的node_modules文件夹，输入element-ui找到elememt-ui包，接着我们展开packges/theme-chalk/src/comoon找到var.scss文件。这个文件包含了ElementUI提供的SCSS变量，当我们想修改某个组件样式时，就可以在这个文件中检索关键字，找到我们想修改的变量。复制到element-variables文件中去，这种修改SCSS变量方式的好处在于，通过SCSS变量名，我们可以很快知道样式的作用，样式文件简洁明了，非常容易管理和维护。另外Element中像主题色这样的样式变量，是组件间共用的，通过这种方式修改们可以保证组件间主题的一致性，可以避免产生差异带来违和感。
如果是按需引入我们需要修改一下写法，按需引入需要借助babel-plugin-component插件，element包导出来一个入口文件里面导出来所有的element组件，这就意味着我们在引用这个入口文件时，会将所有组件文件引入到项目中也就是全局引入，而babel-plugin-component的主要作用是将我们从element包中引用的语句转换为两句话。一，从包的lib文件夹下单独引用组件文件。二单独引用组件的css文件也就是按需引入，而css文件已经被编译过了，自然不会应用SCSS变量。我们接下来做的就是自己从lib下引用组件文件，不引入css,使用SCSS文件。
在引入element文件中将路径进行修改
，接下来对element-variabls.scss文件修改
如果有SCSS变量无法修改的样式，我们可以直接覆盖element的class，这里推荐在styles文件下创建components文件夹，每一个组件的样式单独放到一个文件中，这样方便我们之后的管理和维护。之后就是打开画面，打开开发者工具，查看element样式，element的class名采用了BEM命名思想。现在我们来修改组件的样式，在styles/components文件夹下，创建组件名.scss文件，键入我们要修改的class,使用优先级更高的选择器，修改对应属性的值。然后在项目中引用
