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

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

新規登録して質問してみよう
ただいま回答率
85.37%
正規表現

正規表現とは特定の文字列によるパターンマッチングを行う際に用いられる宣言型プログラミングです。

Q&A

解決済

2回答

8632閲覧

vscodeでパターンにマッチする箇所の背景色を変更する方法

blendegg

総合スコア81

正規表現

正規表現とは特定の文字列によるパターンマッチングを行う際に用いられる宣言型プログラミングです。

0グッド

1クリップ

投稿2021/06/15 11:24

vscodeでエディター全体の背景色を変更する場合は、setting.jsonに以下のような記述をすれば良いです。

"workbench.colorCustomizations": { "editor.background": "#2B1B17" }

しかし、特定のパターンにマッチさせ、その箇所の背景色だけ変更したいです。
例えばマークダウンのヘッダーなどです。

# header1

上記をマッチさせるには以下の正規表現で良いと思います。

^# *$

このような条件付はjsonファイル上で可能でしょうか?

気になる質問をクリップする

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

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

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

回答2

0

ベストアンサー

TakaiYさんの回答内のリンク先に記載のあったhighlight という拡張機能で実現できそうです。

Highlight - Visual Studio Marketplace

参考
VSCodeでさっくり作る快適な執筆環境。オススメ拡張機能3つ。|リョウ|note
(説明追記)
拡張機能をインストールすると、setting.jsonに "highlight.regexes": {の項目が追加されているので適宜修正します。

json

1 "highlight.regexes": { // (編集)修正しました 2 "highlight.decorations": { "rangeBehavior": 3 }, 3 "highlight.regexFlags": "gi", 4 "highlight.regexes": { 5 6 "(見出し).*": [ 7 { 8 "backgroundColor": "rgba(255, 0, 0, 0.5)", 9 } 10 ], 11 "(\n# \S+|^# \S+)\s": { // (編集)不要な;が入っていたので削除 12 "regexFlags": "gi", // Flags used when building this regex 13 "filterFileRegex": ".*\.txt", 14 "decorations": [ 15 { 16 "backgroundColor": "rgba(255, 255, 0, 0.5)", 17 } 18 ] 19 }, 20 21 }, 22 "highlight.maxMatches": 250, 23 }

表示結果

"filterFileRegex": ".*.txt", でtxtファイルのみ適用するようにしています。
細かい仕様は拡張機能の説明を確認してください。

どうも文全体を1行とみているようで ^ は一番上の行しかマッチしないようでした。
そのため1行目もマッチするように | でわけています。

上記は 行頭が# [空白以外の文字列] までマッチするようにしていますが、
行頭# [空白以外の文字列]以降任意 の 行全体にマッチさせたい場合は、下記のようにします。

regex

1 "(\n# .+|^# .+)":

以下、一般的な行単位の正規表現の話です。
質問文の正規表現ですが、

regex

1^# *$

上記だと 行頭# の次に半角スペースが0個以上で終わる行 を意味します。
"#"で行頭が始まり、半角スペースが1つ、任意の空白含む文字列が0個以上を表したい場合は

regex

1^# .*$

となります。

投稿2021/06/15 14:00

編集2021/06/15 14:13
Crimson_Tide

総合スコア509

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

TakaiY

2021/06/15 14:04

これ、よさそうですね。
blendegg

2021/06/16 11:02

回答遅れました。 実現するには自分でアドオンなり作らないといけないんですね、、、。
blendegg

2021/06/16 11:48

もらったコードですが、自分の環境では何故か動きませんでしたね。
Crimson_Tide

2021/06/16 14:20 編集

>> 実現するには自分でアドオンなり作らないといけないんですね、、、。 これの意味するところは、「標準機能では実現できない」「これを実現するために、拡張機能は自分自身で作る必要がある」のどちらでしょうか。 前者なら少なくとも私は知りません。後者ならNO この拡張機能を入れればいいだけです。 Highlight 拡張機能を入れていない状態で、コードを使ったとしたら、当然動作しません。拡張機能が入っている前提です。 拡張機能を入れたけど、動作しないのであればsetting.jsonへの記述ミスか、そのまま使ったのなら txtファイルに記述していない のどちらかだと思います。
guest

0

設定で、正規表現にマッチする部分の背景色を変更することはできないと思います。

MDのヘッダの背景の色を変更するという目的に最も合うのは、Themeのシンタックスハイライト機能を使うことだと思います。
ただ、それでも背景色は変更できないようです。できるようにして欲しいという要望は出ていますが、まだ解決していません。

投稿2021/06/15 12:16

TakaiY

総合スコア13687

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

blendegg

2021/06/15 12:29

検索で強調表示にでもしますか。 強調表示がないと見づらいです。 vscodeは便利なので使用していましたが、別のエディタも使おうかと思います。 ご存知かわかりませんが、gvimなどではこのような設定は可能なんでしょうか?
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

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

ただいまの回答率
85.37%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問