ui框架的樣式穿透

以前作項目的時候有遇到過該elementui的默認樣式，後來由於需求不須要了就沒嘗試修改，最近學習並嘗試了一下

個人測試框架使用的element ui框架

在將element框架集成到vue裏面以後（這個很簡單，百度不少的）

使用兩種方法樣式穿透：sass和stylus

首先是配置sass和stylus的環境，

1.下載資源包

npm i node-sass sass-loader -D  

npm install stylus stylus-loader --save

2.添加webpack裏面的配置(scss須要)

  {
        test: /\.scss$/,
        loaders: ['style', 'css', 'sass']
      },

//使用 lang="scss"引入
<style  scoped lang="scss">
//scss的樣式穿透須要/deep/
  .el-row /deep/ .el-button--primary {
    background-color: #eee;
  }
 </style>

3.若是使用stylus穿透的話

<style  scoped lang="stylus">
  .el-row >>> .el-button--primary {
    background-color: #000;
  }
 </style>