質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

ただいまの
回答率

88.92%

csscombの設定について

解決済

回答 1

投稿 編集

  • 評価
  • クリップ 0
  • VIEW 2,298

1000

score 204

現在、gulpでsassとcsscombを利用しています。
そこでどうしてもつまづいたので相談させてください。

a {
    &:link    { color: #000; text-decoration: underline; }
    &:visited { color: #000; text-decoration: none; }
    &:hover   { color: #000; text-decoration: none; }
    &:active  { color: #000; text-decoration: none; }
}


これをコンパイルすると

a:link { color:#000; text-decoration:underline;}

a:visited { color:#000; text-decoration:none;}

a:hover { color:#000; text-decoration:none;}

a:active { color:#000; text-decoration:none;}


このように、改行が入ってしまいます。
これを以下のように「改行なし」にするにはどのような設定が必要でしょうか?

a:link { color:#000; text-decoration:underline;}
a:visited { color:#000; text-decoration:none;}
a:hover { color:#000; text-decoration:none;}
a:active { color:#000; text-decoration:none;}

↓使用している.csscomb.jsonです

{
    "always-semicolon": true,
    "color-case": "lower",
    "block-indent": "\t",
    "color-shorthand": true,
    "element-case": "lower",
    "eof-newline": true,
    "leading-zero": true,
    "quotes": "single",
    "sort-order-fallback": "abc",
    "space-before-colon": "",
    "space-after-colon": "",
    "space-before-combinator": " ",
    "space-after-combinator": " ",
    "space-between-declarations": " ",
    "space-before-opening-brace": " ",
    "space-after-opening-brace": " ",
    "space-after-selector-delimiter": " ",
    "space-before-selector-delimiter": "",
    "space-before-closing-brace": "",
    "strip-spaces": true,
    "unitless-zero": true,
    "vendor-prefix-align": true
}
  • 気になる質問をクリップする

    クリップした質問は、後からいつでもマイページで確認できます。

    またクリップした質問に回答があった際、通知やメールを受け取ることができます。

    クリップを取り消します

  • 良い質問の評価を上げる

    以下のような質問は評価を上げましょう

    • 質問内容が明確
    • 自分も答えを知りたい
    • 質問者以外のユーザにも役立つ

    評価が高い質問は、TOPページの「注目」タブのフィードに表示されやすくなります。

    質問の評価を上げたことを取り消します

  • 評価を下げられる数の上限に達しました

    評価を下げることができません

    • 1日5回まで評価を下げられます
    • 1日に1ユーザに対して2回まで評価を下げられます

    質問の評価を下げる

    teratailでは下記のような質問を「具体的に困っていることがない質問」、「サイトポリシーに違反する質問」と定義し、推奨していません。

    • プログラミングに関係のない質問
    • やってほしいことだけを記載した丸投げの質問
    • 問題・課題が含まれていない質問
    • 意図的に内容が抹消された質問
    • 過去に投稿した質問と同じ内容の質問
    • 広告と受け取られるような投稿

    評価が下がると、TOPページの「アクティブ」「注目」タブのフィードに表示されにくくなります。

    質問の評価を下げたことを取り消します

    この機能は開放されていません

    評価を下げる条件を満たしてません

    評価を下げる理由を選択してください

    詳細な説明はこちら

    上記に当てはまらず、質問内容が明確になっていない質問には「情報の追加・修正依頼」機能からコメントをしてください。

    質問の評価を下げる機能の利用条件

    この機能を利用するためには、以下の事項を行う必要があります。

回答 1

checkベストアンサー

0

うーん。
以前sass使ってたときこういうこと起こったことないのでほかに要因があるのかも知れませんが、いろいろ検証してみましょう。

1.
.csscomb.jsonの中の"eof-newline": truefalseにしてみましょう。

2.
1がダメならSCSSを見てみる。
これだとどうなります?
まるまるコピーして貼り付けてください。

a {
    color: #000;
    text-decoration: underline;
    &:hover, &:active, &:focus {
        text-decoration: none;
    }
}

3.
2ダメな場合、.csscomb.jsonの中を空にして影響を見てみましょう。
ファイルの中を{}だけにすればいい気がします。<無論あとで戻すのでBKはとっておく

とりあえずこの3つを試してみてください。

投稿

  • 回答の評価を上げる

    以下のような回答は評価を上げましょう

    • 正しい回答
    • わかりやすい回答
    • ためになる回答

    評価が高い回答ほどページの上位に表示されます。

  • 回答の評価を下げる

    下記のような回答は推奨されていません。

    • 間違っている回答
    • 質問の回答になっていない投稿
    • スパムや攻撃的な表現を用いた投稿

    評価を下げる際はその理由を明確に伝え、適切な回答に修正してもらいましょう。

  • 2017/02/13 17:36

    >> .pipe(sass())→.pipe(sass({style : 'expanded'}))
    こちらためしてみました、結果変わらずのようです。

    >>「gulpfile.js」内で「newline」系で値が「true」になっているものがあれば「false」にしてみてください。
    newlineの記述は無いようでした。

    そもそも、eof-newlineが怪しいかと思ったのですが、実質動いていないような(結果が何も変わらない)感じなのですが、これって何なんでしょうね??

    キャンセル

  • 2017/02/13 19:11

    ほかにbeautifyなどの整形系を使用していてその影響が出てるかなーと思ったんですけど…うーん。
    「eof-newline」は言葉通りに解釈すると複数のファイルを連結したときにファイルとファイルの間に改行が入るんだと思います。

    で、ほかに手が思い浮かばないので環境を作って試してみました。
    なるほど。確かに空行ができますね。
    ですが、こうすると空行がなくなります。
    ---
    a {
    color: #000;
    &:link { color: #000; text-decoration: underline; }
    &:visited { color: #000; text-decoration: none; }
    &:hover { color: #000; text-decoration: none; }
    &:active { color: #000; text-decoration: none; }
    }
    ---
    結果から予想するに親に何も記述せず子だけだと1個1個独立しているものとして認識されて空行ができるのではないでしょうか。
    親に何かの記述があるとその子にも影響がでるので、そこでまとまる感じですかね。

    キャンセル

  • 2017/02/23 17:08

    すごい、盲点でした!
    助かりましたありがとうございます!

    キャンセル

15分調べてもわからないことは、teratailで質問しよう!

  • ただいまの回答率 88.92%
  • 質問をまとめることで、思考を整理して素早く解決
  • テンプレート機能で、簡単に質問をまとめられる

関連した質問

同じタグがついた質問を見る