web

vscodeの拡張Bookmarks

いやーこれ便利だなぁ、もっと早く知りたかった。
[追記 / 2018/10/05]
なんて事でしょうか
prettierなんかでコードフォーマットを掛かるとブックマーク行がついていって紅………に染まったこの俺をッ!!!
ファイル保存時に発動する自動フォーマットも駄目。
ああああ。。。。

Bookmarks – Visual Studio Marketplace

Available commands
使用可能なコマンド

Bookmarks: Toggle Mark/unmark positions with bookmarks
ブックマーク:ブックマークで位置をマーク/マーク解除する
opt + + cmd + K

Bookmarks: Toggle Labeled Mark labeled bookmarks
ブックマーク:ラベル付きのマーク付きのブックマークを切り替えます。

Bookmarks: Jump to Next Move the cursor forward, to the bookmark below
ブックマーク:次へ進むカーソルを下のブックマークに移動します。
opt + + cmd + L

Bookmarks: Jump to Previous Move the cursor backward, to the bookmark above
ブックマーク:ジャンプする前にカーソルを上のブックマークに移動
opt + + cmd + J

Bookmarks: List List all bookmarks in the current file
ブックマーク:リスト現在のファイル内のすべてのブックマークを一覧表示します。

Bookmarks: List from All Files List all bookmarks from all files
ブックマーク:すべてのファイルからのリストすべてのファイルからすべてのブックマークを一覧表示する

Bookmarks: Clear remove all bookmarks in the current file
ブックマーク:現在のファイル内のすべてのブックマークを消去する

Bookmarks: Clear from All Files remove all bookmarks from all files
ブックマーク:すべてのファイルからクリアすると、すべてのファイルからすべてのブックマークが削除されます。

Bookmarks (Selection): Select Lines Select all lines that contains bookmarks
ブックマーク(選択):行の選択ブックマークを含むすべての行を選択する

Bookmarks (Selection): Expand Selection to Next Expand the selected text to the next bookmark
ブックマーク(選択):選択範囲を次に展開選択したテキストを次のブックマークに展開する
shift + opt + L

Bookmarks (Selection): Expand Selection to Previous Expand the selected text to the previous bookmark
ブックマーク(選択):選択範囲を前へ展開選択したテキストを前のブックマークに展開する
shift + opt + J

Bookmarks (Selection): Shrink Selection Shrink the select text to the Previous/Next bookmark
ブックマーク(選択):選択範囲を縮小選択したテキストを「前へ/次へ」ブックマークに縮小します
shift + opt + K

サイドバーからパネル開くとこんな感じで表示される。

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

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

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

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

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

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

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

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

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

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

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

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