2. HTML - Autoprefixer - トラブルシュート - Gradient has outdated direction syntax.

 
2.1 Gradient has outdated direction syntax.

2.1 Gradient has outdated direction syntax.

 gulp 実行中にエラーが発生。

[14:47:15] Using gulpfile /usr/home/kitayama/npm/gulpfile.js
[14:47:15] Starting 'test'...
[14:47:15] Finished 'test' after 9.15 ms
[14:47:16] gulp-autoprefixer:
  autoprefixer: /.../test.css:2:3: Gradient has outdated direction syntax. New syntax is like `to left` instead of `right`.
 :2:3: の箇所、2 の行番号はともかく、3 はカラムではなく語の位置らしい。  突き詰めて発生個所を絞ったら

kbd
{
	background-image: linear-gradient(top, #eee, #f9f9f9, #eee);
}
 中のがいかんらしいのですよ。  結果が

kbd {
  background-image: -webkit-gradient(linear, left top, left bottom, from(#eee), color-stop(#f9f9f9), to(#eee));
  background-image: -webkit-linear-gradient(top, #eee, #f9f9f9, #eee);
  background-image: -o-linear-gradient(top, #eee, #f9f9f9, #eee);
  background-image: linear-gradient(top, #eee, #f9f9f9, #eee);
}
 てな感じで出力されております。  メッセージを解釈すると「top」は古いですよ」と。  「新しいシンタックスは to left もしくは right ですよ」ということのようなのでソースを

kbd
{
	background-image: linear-gradient(to right bottom, #eee, #f9f9f9, #eee);
}
 と書き換えましたらば、メッセージは出なくなりました。  結果が

kbd {
  background-image: -webkit-gradient(linear, left top, right bottom, from(#eee), color-stop(#f9f9f9), to(#eee));
  background-image: -webkit-linear-gradient(left top, #eee, #f9f9f9, #eee);
  background-image: -o-linear-gradient(left top, #eee, #f9f9f9, #eee);
  background-image: linear-gradient(to right bottom, #eee, #f9f9f9, #eee);
}
 1行目が微妙に気になりますが・・・、これでよしとしましょう。