今更知るscssのソースマップの存在意義

チームで作業する場合、ソースマップ普通に便利かも。
てか必須かも。

いままでは
1)cssからscssを辿るのはそんなに大変でもない
2)もしSassファイル内での行番号を知りたい時は、ラインコメントを出力すればいい

みたいな感覚でいたんですけど
cssを見ればscssのどこか判ると言っても、20〜30を超える数の.scssを@importしたサイトになると流石に骨(心)が折れるし
ラインコメントなんてのは論外で、例えば改行の仕方が違う人がscssを編集するだけで
gitが反応しまくるので非常に面倒臭いってのが実際。

けれどもソースマップならば!

開発者ツールで直接scssのどこかに書いてあるのかが判るので、使わないより使った方が断然早い。

scssの対象行がブラウザから確認できる

もし直接cssが見たいようて時は
ブラウザの設定を変更すれば切り替えられるので
安心安心


Visual Studio Code、慣れてきた。

最近のエディタは、完全にVisual Studio Codeな気分です。100%は満たされないけど、かなりいいですねこれ。
codaからほぼ完全に乗り換えました。

悩みの種だった、ソースフォーマット時にspanの内側がフォーマットされない件も解決。

設定(ツールバーの「Code>基本設定>設定」)のこうなってる部分を

こうする。

追記:2017-08-06)最近はsvgを追加した

あと最近のアップデート後に言語設定が英語に戻ってしまったので、
enをjaに書き換えました。

これで日本語に戻る。

その他自分がよく使う機能

設定

あれ、それくらいか??


google driveの共有アイテムにあるファイルをマイドライブに移す

複数のgoogledriveを一緒に開きたくてodrive(https://www.odrive.com/)とか使ってたんですけど
たまに共有に落ちてこないファイルがあったりして使うの辞めました。

とはいえgoogle driveアプリは共有アイテムを拾ってくれなくて困ったなーって思ってたら
マイドライブに移せばローカルでも開けるんですね。

マイドライブに移したいファイルを選択して、右上のマイドライブに移すアイコンをクリックです


Firefox Developer Edition


いまだに、firefoxのfirebugに慣れすぎちゃってchromeに移行出来ないでいます。

ところが最近、console.log();が吐き出されない事があって数時間ハマってから
こりゃもうほんとに乗り換えねばならんね、と思ってたんですけど

Firefox Developer Editionつうのがあると教えてもらいました。
https://www.mozilla.org/ja/firefox/developer/

console.log();バッチリ動く。

まだしばらくfirefoxの厄介になりそうです。