Q&A
HTMLファイルの要素名やクラス名などをクリックしてからF12キーを押すと、何か表示されますか?
VScodeのcsspeekが効きません。
（※現在最新のVScodeで試しています）
「scssファイル」は参照できないのでしょうか？
「cssファイル」のみ対応なのかどうか、調べてみてもよくわかりませんでした。
また、ホバーしても
「読み込み中」と出た後、何も起こりませんでした。
使っている方がいましたらよろしければお教えいただけませんか？
どうかよろしくお願いいたします。
追記：
ルートにあるlocal historyのフォルダをゴミ箱に入れて、無効化し、再度csspeekを試しました。
しかし、css Peekでは「ファイルの参照範囲」は設定できないようです。
「違うフォルダにある同じ名前のクラス名」が参照されてしまいました。（過去に作った別のlocalhistoryが参照されてしまった）
追記２：
すみません、**/.history/**を追加してもだめでした。。
追加した設定です↓
追加した後の写真です↓
追記３：
すみません、
クラス指定が一つしかない場合は、ホバー時のプレビューが表示されず、
「直接cssファイルへジャンプ」してしまいます。。
これは仕様なのでしょうか。。
回答ありがとうございます。
F12キーを押したところ、左上に「青いバー」みたいなものが表示されました。
しかし、cssの参照画面は出てこないようです。。
と思っていたら、30秒くらい待っていたら、やっと表示されました！！
ファイルが多すぎるせいでしょうか。。？
ファイルが多すぎるせいでした！
「Local history」プラグインが原因でした！
「履歴のファイル」も参照してしまっていたために、
なかなか表示されなかったようです。。。
何か回避策はご存知ないでしょうか・・？
もしご存知でしたらお願いいたします。
「ファイルの参照範囲」を決めることができれば、
Local historyと被らないと思いました。
しかし、css Peekでは「ファイルの参照範囲」は設定できないようです。。
不可能そうです。。
local historyのほうで、履歴を保存するフォルダーを変えるとかできそうですが。
ルートにあるlocal historyのフォルダをゴミ箱に入れて、無効化し、再度csspeekを試しました。
しかし、css Peekでは「ファイルの参照範囲」は設定できないようです。
「違うフォルダにある同じ名前のクラス名」が参照されてしまいました。（過去に作った別のlocalhistoryが参照されてしまった）
「CSS Peek: Peek To Exclude」にlocal historyのフォルダーを登録すればいいのでは。
「**/.history/**」を追加するとどうですかね。
すみません、**/.history/**を追加してもだめでした。。
何がどうダメだったのですか。たとえば、「.historyフォルダーの内容が相変わらずCSS Peekの対象になってしまう」とか、「.historyフォルダーの内容はリストから除外されたが、まだ動作が遅い」とか。それによって対策も変わるでしょうに。
ああ、画像で出ていましたね。設定変更後に、VSCodeを再起動してみましたか?
すみません。写真として追記させていただきました。「.historyフォルダーの内容が相変わらずCSS Peekの対象になってしまう」状態にあります。。
申し訳ありません。再起動で解決しました！
大変ありがとうございましたm(_ _)m
あとは、右側のすっきりしたリストから、scssを探して対象にすればお望みの動作になるかと思います。
すみません、
「クラス指定が一つしかない場合」は、ホバー時のプレビューが表示されず、
「直接cssファイルへジャンプ」してしまいます。。
これは仕様なのでしょうか。。
簡潔にまとめますと、
「scssファイルをホバー時にプレビュー表示」できません。。
「Peek From Languages」の設定で「scss」「sass」と追記しましたが、やはり関係ないみたいです。。
回答2件
0
ベストアンサー
(質問への追記で判明) 別の拡張機能「Local History」(保存するたびに履歴を残す)の履歴が大量にあり、その読み込みがCSS Peekの動作を遅くしている原因だった。
CSS Peekの検索対象外となるファイルを設定する「CSS Peek: Peek To Exclude」(cssPeek.peekToExclude)に、任意の位置にあるLocal Historyの履歴フォルダー(.history)以下のファイルにマッチするファイルグロブ**/.history/**を追加することで、動作速度が改善されるのでは。
投稿2020/07/29 23:36
総合スコア11990
0
「scssファイル」は参照できないのでしょうか？
「cssファイル」のみ対応なのかどうか、調べてみてもよくわかりませんでした。
いえ、対応しています。
This extension extends HTML and ejs code editing with Go To Definition and Go To Symbol in Workspace support for css/scss/less (classes and IDs) found in strings within the source code.（拡張の紹介ページより）
投稿2020/07/28 09:04
総合スコア145184
ありがとうございます。対応しているのですね。
csspeekが効かない原因がよくわからなく。。
何故なのかわかりませんでした。。
・再インストール
・再起動
など行いました。
もしご存知であればお願いいたします。
あなたの回答
tips
プレビュー
