diff --git a/packages/actionsheet/index.pcss b/packages/actionsheet/index.pcss
index d4aa11e8..e0400f98 100644
--- a/packages/actionsheet/index.pcss
+++ b/packages/actionsheet/index.pcss
@@ -1,4 +1,5 @@
-@import '../common/index.pcss';
+@import '../common/style/var.pcss';
+@import '../common/style/hairline.pcss';
 
 .van-actionsheet {
   color: $text-color;
diff --git a/packages/badge-group/index.pcss b/packages/badge-group/index.pcss
index ff81b8da..347d613e 100644
--- a/packages/badge-group/index.pcss
+++ b/packages/badge-group/index.pcss
@@ -1,4 +1,5 @@
-@import '../common/index.pcss';
+@import '../common/style/var.pcss';
+@import '../common/style/hairline.pcss';
 
 .van-badge-group {
   width: 85px;
diff --git a/packages/badge/index.pcss b/packages/badge/index.pcss
index 685f8cab..cacba174 100644
--- a/packages/badge/index.pcss
+++ b/packages/badge/index.pcss
@@ -1,4 +1,5 @@
-@import '../common/index.pcss';
+@import '../common/style/var.pcss';
+@import '../common/style/hairline.pcss';
 
 .van-badge {
   display: block;
diff --git a/packages/button/index.pcss b/packages/button/index.pcss
index ea4b9c08..d149563c 100644
--- a/packages/button/index.pcss
+++ b/packages/button/index.pcss
@@ -1,4 +1,4 @@
-@import '../common/index.pcss';
+@import '../common/style/var.pcss';
 
 .van-button {
   position: relative;
diff --git a/packages/card/index.pcss b/packages/card/index.pcss
index 5b1901fe..0669670d 100644
--- a/packages/card/index.pcss
+++ b/packages/card/index.pcss
@@ -1,4 +1,5 @@
-@import '../common/index.pcss';
+@import '../common/style/var.pcss';
+@import '../common/style/mixins/ellipsis.pcss';
 
 .van-card {
   color: $text-color;
diff --git a/packages/cell-group/index.pcss b/packages/cell-group/index.pcss
index 3379ba27..b0989df2 100644
--- a/packages/cell-group/index.pcss
+++ b/packages/cell-group/index.pcss
@@ -1 +1,2 @@
-@import '../common/index.pcss';
+@import '../common/style/var.pcss';
+@import '../common/style/hairline.pcss';
diff --git a/packages/cell/index.pcss b/packages/cell/index.pcss
index 1ea33fb6..15f9de06 100644
--- a/packages/cell/index.pcss
+++ b/packages/cell/index.pcss
@@ -1,4 +1,5 @@
-@import '../common/index.pcss';
+@import '../common/style/var.pcss';
+@import '../common/style/hairline.pcss';
 
 .van-cell {
   width: 100%;
diff --git a/packages/common/index.pcss b/packages/common/index.pcss
index f521c139..867ce9be 100644
--- a/packages/common/index.pcss
+++ b/packages/common/index.pcss
@@ -6,4 +6,3 @@
 @import "./style/ellipsis.pcss";
 @import "./style/clearfix.pcss";
 @import "./style/hairline.pcss";
-@import "./style/animation.pcss";
diff --git a/packages/common/style/animation.pcss b/packages/common/style/animation.pcss
deleted file mode 100644
index 94acb20e..00000000
--- a/packages/common/style/animation.pcss
+++ /dev/null
@@ -1,61 +0,0 @@
-@keyframes van-slide-bottom-enter {
-  from {
-    transform: translate3d(0, 100%, 0);
-  }
-}
-
-@keyframes van-slide-bottom-leave {
-  to {
-    transform: translate3d(0, 100%, 0);
-  }
-}
-
-@keyframes van-fade-in {
-  from {
-    opacity: 0;
-  }
-
-  to {
-    opacity: 1;
-  }
-}
-
-@keyframes van-fade-out {
-  from {
-    opacity: 1;
-  }
-
-  to {
-    opacity: 0;
-  }
-}
-
-@keyframes van-rotate {
-  from {
-    transform: rotate(0deg);
-  }
-
-  to {
-    transform: rotate(360deg);
-  }
-}
-
-.van-fade {
-  &-enter-active {
-    animation: .3s van-fade-in;
-  }
-
-  &-leave-active {
-    animation: .3s van-fade-out;
-  }
-}
-
-.van-slide-bottom {
-  &-enter-active {
-    animation: van-slide-bottom-enter .3s both ease;
-  }
-
-  &-leave-active {
-    animation: van-slide-bottom-leave .3s both ease;
-  }
-}
diff --git a/packages/field/index.pcss b/packages/field/index.pcss
index 43f62e2d..d82b7848 100644
--- a/packages/field/index.pcss
+++ b/packages/field/index.pcss
@@ -1,4 +1,4 @@
-@import '../common/index.pcss';
+@import '../common/style/var.pcss';
 
 .van-field {
   &__body {
diff --git a/packages/icon/index.pcss b/packages/icon/index.pcss
index 8fd5b39b..7a21fd63 100644
--- a/packages/icon/index.pcss
+++ b/packages/icon/index.pcss
@@ -1,4 +1,4 @@
-@import '../common/index.pcss';
+@import '../common/style/var.pcss';
 
 @font-face {
   font-style: normal;
diff --git a/packages/loading/index.pcss b/packages/loading/index.pcss
index 9dcdeb47..53f0f922 100644
--- a/packages/loading/index.pcss
+++ b/packages/loading/index.pcss
@@ -1,4 +1,4 @@
-@import '../common/index.pcss';
+@import '../common/style/var.pcss';
 
 .van-loading {
   z-index: 0;
@@ -54,3 +54,13 @@
     transform: rotate(calc($i * 30deg));
   }
 }
+
+@keyframes van-rotate {
+  from {
+    transform: rotate(0deg);
+  }
+
+  to {
+    transform: rotate(360deg);
+  }
+}
diff --git a/packages/panel/index.pcss b/packages/panel/index.pcss
index b71eae51..d9c38844 100644
--- a/packages/panel/index.pcss
+++ b/packages/panel/index.pcss
@@ -1,4 +1,5 @@
-@import '../common/index.pcss';
+@import '../common/style/var.pcss';
+@import '../common/style/hairline.pcss';
 
 .van-panel {
   background: $white;
diff --git a/packages/popup/index.pcss b/packages/popup/index.pcss
index 0c18b8a8..f98a89fa 100644
--- a/packages/popup/index.pcss
+++ b/packages/popup/index.pcss
@@ -1,4 +1,4 @@
-@import '../common/index.pcss';
+@import '../common/style/var.pcss';
 
 .van-popup {
   top: 50%;
@@ -92,4 +92,14 @@
   from {
     transform: translate3d(100%, -50%, 0);
   }
-}
\ No newline at end of file
+}
+
+@keyframes van-fade-in {
+  from {
+    opacity: 0;
+  }
+
+  to {
+    opacity: 1;
+  }
+}
diff --git a/packages/search/index.pcss b/packages/search/index.pcss
index 3a2559a9..2bbd4c81 100644
--- a/packages/search/index.pcss
+++ b/packages/search/index.pcss
@@ -1,4 +1,4 @@
-@import '../common/index.pcss';
+@import '../common/style/var.pcss';
 
 .van-search {
   display: flex;
diff --git a/packages/stepper/index.pcss b/packages/stepper/index.pcss
index 3b1959e7..4e286e0a 100644
--- a/packages/stepper/index.pcss
+++ b/packages/stepper/index.pcss
@@ -1,4 +1,4 @@
-@import '../common/index.pcss';
+@import '../common/style/var.pcss';
 
 .van-stepper {
   font-size: 0;
diff --git a/packages/steps/index.pcss b/packages/steps/index.pcss
index 0e469633..a8b199d7 100644
--- a/packages/steps/index.pcss
+++ b/packages/steps/index.pcss
@@ -1,4 +1,5 @@
-@import '../common/index.pcss';
+@import '../common/style/var.pcss';
+@import '../common/style/hairline.pcss';
 
 .van-steps {
   overflow: hidden;
diff --git a/packages/switch/index.pcss b/packages/switch/index.pcss
index 751c91f2..2e5435f3 100644
--- a/packages/switch/index.pcss
+++ b/packages/switch/index.pcss
@@ -1,4 +1,4 @@
-@import '../common/index.pcss';
+@import '../common/style/var.pcss';
 
 .van-switch {
   height: 1em;
diff --git a/packages/tag/index.pcss b/packages/tag/index.pcss
index 3f1a3a71..367d2397 100644
--- a/packages/tag/index.pcss
+++ b/packages/tag/index.pcss
@@ -1,4 +1,5 @@
-@import '../common/index.pcss';
+@import '../common/style/var.pcss';
+@import '../common/style/hairline.pcss';
 
 .van-tag {
   display: inline-block;
diff --git a/packages/tree-select/index.pcss b/packages/tree-select/index.pcss
index 1314e291..5dbd20f3 100644
--- a/packages/tree-select/index.pcss
+++ b/packages/tree-select/index.pcss
@@ -1,4 +1,5 @@
 @import "../common/index.pcss";
+@import '../common/style/ellipsis.pcss';
 
 .tree-select {
   user-select: none;