Gradient has outdated direction syntax. New syntax is like `to left` instead of `right`.

 當Vue  引用CSS 會提示以下錯誤：  語法過時。。。。。

 Gradient has outdated direction syntax. New syntax is like `to left` instead of `right`.

並隨之帶有 一堆 css-loader  路徑

Failed to compile.

./src/assets/css/button.css (./node_modules/[email protected]@css-loader/dist/cjs.js??ref--10-oneOf-1-1!./node_modules/vue-loader/lib/loaders/stylePostLoader.js!./node_modules/[email protected]@postcss-loader/src??ref--10-oneOf-1-2!./src/assets/css/button.css) Module Warning (from ./node_modules/[email protected]@postcss-loader/src/index.js):

警告：Gradient has outdated direction syntax. New syntax is like `to left` instead of `right`.

1. 語法過時示例：

.button-raised {
  border-color: #e1e1e1;
  border-style: solid;
  border-width: 1px;
  line-height: 38px;
  background: -webkit-gradient(linear, left top, left bottom, from(#f6f6f6), to(#e1e1e1));
  background: linear-gradient(#f6f6f6, #e1e1e1);
  -webkit-box-shadow: inset 0px 1px 0px rgba(255, 255, 255, 0.3), 0 1px 2px rgba(0, 0, 0, 0.15);
  box-shadow: inset 0px 1px 0px rgba(255, 255, 255, 0.3), 0 1px 2px rgba(0, 0, 0, 0.15);
}

.button-raised:hover,
.button-raised:focus {
  background: -webkit-gradient(linear, left top, left bottom, from(white), to(gainsboro));
  background: linear-gradient(to top, white, gainsboro);
}

2. 解決方法 

把上面CSS 中的  

-webkit-gradient(linear, left top, left bottom, from(#f6f6f6), to(#e1e1e1));

改成：

 background: -webkit-gradient(linear, to left to top, to left bottom, from(#f6f6f6), to(#e1e1e1));

把所有的 類似語法 中的 left ， top   改爲 to left , to top 。  vue  就不再有警告提示了