2
4

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 5 years have passed since last update.

VSCode+Easy Sass+CSScombの注意点

Last updated at Posted at 2019-03-06

おま環かも知れないけどだれかのやくにたつかもしれない
環境:Win10、VSCode+EasySass+CSScomb

##パーシャルファイル
読込時、アンダースコアを省略するとコンパイルエラーになる

@import "common";        //コンパイルエラー(not found)
@import "_common";       //OK
@import "_common.scss";  //OK

##TargetDirの挙動
存在しないディレクトリを指定した場合、scssファイルの保存に失敗して(?)編集した内容が消える
もちろんコンパイルもされない
消去された箇所はCtrl+Zで復帰可能
※エラーなどは出ず問答無用で消える

##CSScombとプロパティのネスト
↓のbeforeの様に書いてCSScombにフォーマットさせると
afterの様に勝手にセミコロン追加&改行削除されてしまう謎

//before
background: {
  position: center;
  size: cover;
}
height: 100px;

//after
background: {
  position: center;
  size: cover;
} ; height: 100px;

予めネストの閉じ括弧( } )の後にセミコロンを付けておくことで回避できる。

//before
background: {
  position: center;
  size: cover;
};
height: 100px;

//after
background: {
  position: center;
  size: cover;
};
height: 100px;

なおcsscomb.jsonの"always-semicolon": の値はこの現象に関与しない

2
4
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
2
4

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?