Emmetのtrimフィルターを書き換えて、Wordからコピペした箇条書きの中黒点を削除する→フィルターを書き換えられなかった
タイトルの通り、結論として何もできなかったという記事です。結論に至るまでの作業ログです。
作業環境
- Windows 10
- Visual Studio Code（2022.03.06時点 最新版）
- Word 2016
やりたいこと
Wordから箇条書きをコピペすると、中黒点も一緒に表示されてしまいます。
やりたいのは、「Emmetで箇条書きを作成する際に、Wordからついてきた中黒点を消す」です。
実際にやったこと
Emmetのtrimフィルターという機能を使います。ただし、最初に記載した作業環境では、箇条書きの中黒点を削除することができませんでした。そのため、VSCodeの設定を変更します。
設定変更に際し、以下の手順を踏みました。
- 箇条書きの中黒点の文字コードを調べる
- VSCodeの
settings.jsonにフィルターの設定を追加する
Wordの箇条書きで生成される中黒点の文字コードを調べる
Wordの機能で箇条書きをつくると、初期設定では大きめの中黒点が出現します。（自分の環境ではそうでした…。）箇条書きの新たなスタイル（見た目）を追加する過程で、箇条書きの文字コードを調べることができます。
上記方法で、箇条書きの文字コードは10進数で108、16進数で006Cだとわかりました。
一旦、VSCode上で検索をかけてみます。
引っかかりませんでした。あれ？
調べ方が悪いのか出てこなかった
006c 文字コードで検索してみると、006cはアルファベット小文字のl（エル）を表すようです。どこにも中黒点は見当たりませんでした。
箇条書きの記号選択で、フォントを変えるとそもそも中黒点ではないことが分かった
もしかしてフォントが小文字のエルを中黒点にしているのか？と思い、フォントを変えてみたところ、ビンゴでした。
もともとWingdingsというフォントになっています。
フォントをTimes New Romanに変更してみると、たしかに小文字のエルになりました。
なぜこんなことになるのか？ヒントらしき記事を見つけたので追記しておきます。
別の方法で調べてようやく判明
Wordから箇条書きの中黒点の文字コードを調べようとしましたが、うまくいきませんでした…。
結局、「word 箇条書き 文字コード」で検索して出てきた「Wordの箇条書き行頭記号」にそれっぽいのが載っていまして、f06cであることがわかりました。
ただ、16進数の記号をそのまま検索欄に入れても、対象の文字にマッチしないので\uを頭に付けて\uf06cで検索します。
参考：文字列とUnicode - JavaScript Primer
ヒットしました。あとはフィルターを書き換えるだけです。
Emmet（VSCode）のフィルター設定を変更する
Emmetの機能に、trimフィルターというものがあります。Wrap with Abbreviation機能と一緒に使うことで、箇条書きの中黒点や、数字付きリストの最初の数字を削除することができます。そのフィルターの値を変更します。
まず、VSCodeの中に入ってるEmmetで設定されてるフィルターの値を確認します。
trimフィルターは、下記の正規表現を使用しているみたいです。
/[\u00a0]*[\d#\-\*\u2022]+\.?/
これに先ほどの\uf06cを加えたものを、settings.jsonでフィルターとして設定します。
（Visual Studio Codeの公式ドキュメントに、フィルターの値をカスタマイズできる旨が書かれています。）
"emmet.preferences": {
"filter.trimRegexp": "[\\u00a0]*[\\d#-*\\u2022\\uf06c]+.?"
}
保存後、ul>li*|tでフィルターが働くか検証します。
どうもうまく働きません。
正規表現の記述内容の問題かどうかを調べます。
ページ内検索を試してみました。該当の文字にマッチしています。
むむむ。。
正規表現の中身を一部変えてみました。
[\u00a0]*[\d#-*\u2022・]+.?
以下の文章で検証します。全角入力の・（中点）と半角スペース、それプラス文字列の組み合わせで作成した箇条書きのリストです。
・ テスト
・ テスト
・ 全角の中黒点でリストを作成しました。
該当文字にヒットしています。
フィルタに先ほどの正規表現を設定して、再チャレンジします。が、反映を確認できず。
どうやら、trimフィルターは上書きできないようです。
作業ログはこれで終わりになります。
おわりに
Cliborの整形機能を使えば造作もないことでした。無理に一つのツールで完結させようとするのはやめます。あと、「Visual Studio Codeの公式ドキュメントに、フィルターの値をカスタマイズできる旨が書かれています。」と書きましたが、filter.trimRegexpの値をカスタマイズできるとは書かれていませんでした。勘違いでした。
Discussion