[build] update to precss 3.0 (#655)

package.json

@@ -39,10 +39,10 @@
     "gulp-rename": "^1.2.2",
     "gulp-typescript": "^5.0.0-alpha.3",
     "html-webpack-plugin": "^3.2.0",
-    "postcss-calc": "^6.0.1",
+    "postcss-calc": "^6.0.2",
     "postcss-easy-import": "^3.0.0",
     "postcss-loader": "^3.0.0",
-    "precss": "^2.0.0",
+    "precss": "^3.1.2",
     "progress-bar-webpack-plugin": "^1.11.0",
     "style-loader": "^0.23.0",
     "typescript": "^3.0.3",
@@ -51,8 +51,8 @@
     "vue-loader": "^15.4.2",
     "vue-router": "^3.0.1",
     "vue-template-compiler": "2.5.17",
-    "webpack": "^4.19.1",
-    "webpack-cli": "^3.1.0",
+    "webpack": "^4.20.2",
+    "webpack-cli": "^3.1.1",
     "webpack-serve": "^2.0.2"
   }
 }

packages/card/index.pcss

@@ -54,7 +54,7 @@
   &__title {
     max-height: 40px;
 
-    @mixin multi-ellipsis 2;
+    @include multi-ellipsis(2);
   }
 
   &__desc {
@@ -62,7 +62,7 @@
     font-size: 12px;
     max-height: 20px;
 
-    @mixin ellipsis;
+    @include ellipsis;
   }
 
   &__price,

packages/common/style/clearfix.pcss

@@ -1,5 +1,5 @@
 @import './mixins/clearfix.pcss';
 
 .van-clearfix {
-  @mixin clearfix;
+  @include clearfix;
 }

packages/common/style/ellipsis.pcss

@@ -1,13 +1,13 @@
 @import './mixins/ellipsis.pcss';
 
 .van-ellipsis {
-  @mixin ellipsis;
+  @include ellipsis;
 }
 
 .van-multi-ellipsis--l2 {
-  @mixin multi-ellipsis 2
+  @include multi-ellipsis(2);
 }
 
 .van-multi-ellipsis--l3 {
-  @mixin multi-ellipsis 3
+  @include multi-ellipsis(3);
 }

packages/common/style/hairline.pcss

@@ -10,7 +10,7 @@
   position: relative;
 
   &::after {
-    @mixin hairline;
+    @include hairline;
   }
 }
 

packages/common/style/mixins/clearfix.pcss

@@ -1,4 +1,4 @@
-@define-mixin clearfix {
+@mixin clearfix {
   &::after {
     content: '';
     display: table;

packages/common/style/mixins/ellipsis.pcss

@@ -1,13 +1,13 @@
-@define-mixin multi-ellipsis $lines {
-  overflow : hidden;
+@mixin multi-ellipsis($lines) {
+  overflow: hidden;
   text-overflow: ellipsis;
   display: -webkit-box;
   -webkit-line-clamp: $lines;
   -webkit-box-orient: vertical;
 }
 
-@define-mixin ellipsis {
-    overflow: hidden;
-    white-space: nowrap;
-    text-overflow: ellipsis;
-}
+@mixin ellipsis {
+  overflow: hidden;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+}

packages/common/style/mixins/hairline.pcss

@@ -1,6 +1,4 @@
-@import '../var.pcss';
-
-@define-mixin hairline $border-retina-color: $border-color {
+@mixin hairline($border-color: #eee) {
   content: '';
   position: absolute;
   top: -50%;
@@ -11,5 +9,5 @@
   pointer-events: none;
   box-sizing: border-box;
   transform-origin: center; /* cover wechat button:after default transforn-origin */
-  border: 0 solid $border-retina-color;
+  border: 0 solid $border-color;
 }