web-dev-qa-db-ja.com

Visual Studio Codeでコメントのフォントを変更するにはどうすればよいですか?

有名なpythonプログラマーによるSublime3スクリーンキャストを見た後、ファンシーフォントでコードコメントを表示することは素晴らしいアイデアであり、コメントをより区別しやすくし、コメントをより読みやすくすることがわかりました。1つの例は以下のように:

sublime text 3 screencast

このデモでは、コードコメントはフォントのように手書きされた明るい色で表示され、実際のコードと区別しやすくなり、コメントを読みやすくする同時に。

https://code.visualstudio.com/docs/getstarted/ を通過しましたが、コードのコメントフォントを変更するための設定が見つからないようです。

したがって、通常のコードフォントに対してコメント用に別のフォントを設定する方法を考えています。

9
pambda

派手なイタリック体の1つのフォントOperatorを使用しているようです https://www.typography.com/fonts/operator/styles/

イタリック体へのより最近のアプローチについては、この回答も参照してください https://stackoverflow.com/a/46278282/2475917

1
mcolo

はい、コメントに使用するフォントを変更できますが、明らかに単純なものの場合は、かなり長く曲がりくねっており、結果は100%完全ではありません。たとえば、コメントを書き込むときに、カーソルが結果のテキストからわずかに離れていることに気付く場合があります。あなたがこれと一緒に暮らすことができるならば、ここにプロセスがあります。

これが私の設定です。それができることを示すためだけです。

enter image description here

次のことを行います。

  • すべてのプロジェクトのコメントの外観を変更するグローバルカスタムスタイルシートを作成します。

  • VSCodeのsettings.jsonでこのスタイルシートへのリンクを作成します

  • VSCodeがカスタムスタイルを登録することを保証するプラグインをインストールします。

スタイルシートを作成する

この部分では、VSCodeインストールのルートに移動する必要があります。私はMacを使用しているので、PCを使用している場合は、自分のパスを特定する必要があります。

Macの私にとって、これはUsers/username/.vscode/です。

ターミナルでそのディレクトリに移動し、次にtouch style.cssに移動してスタイルシートを作成します。

スタイルシートを作成したら、フォントルールを追加する必要があります。ただし、最初に、ターゲットとするクラスを知る必要があります。クラスを識別するには、VSCode内で開発ツールを開きます。次に、コメントにカーソルを合わせてクラスを表示します。私のは.mtk3ですが、これらはアップデートによって異なると聞いているので、自分で確認することをお勧めします。

では、スタイルを追加します。例:

.mtk3 {
   font-family: "iosevka";
   font-size: 1em;
   font-style: italic;
}

スタイルシートへのリンク

次に、VSCodeがスタイルシートを認識していることを確認する必要があります。したがって、settings.jsonを開きます。 (個々のプロジェクトにあるローカルファイルではなく、この名前のグローバルファイルが必要です。)これを開いたら、次のエントリを追加します。

"vscode_custom_css.imports": ["file:///Users/username/.vscode/style.css"],

単一の値ではなく、ファイルにJSON配列を指定していることに注意してください。明らかに、パスはあなた自身のものでなければなりません。これは実際にはファイルパスではないリンク参照であることに注意してください。そのため、パスの前にfile://に相当するWindowsを追加する必要がある場合があります。

プラグインをインストールします

このstillは、スタイルを機能させるのに十分ではありません。エディター内からコマンドupdate custom css and jsを実行できる必要がありますが、これはデフォルトではありません。したがって、次のプラグインをインストールします: カスタムCSSおよびJSローダー

インストールしたら、Cmd+Shift+Pと入力して「カスタムCSSとJSを有効にする」と入力します。オプションが表示されたら、それを選択します。ここでVSCodeを再起動するか、reload windowを実行すると、派手なコメントフォントができあがります。

私が言っているように、カーソルは少し不規則に動作しますが、コードに比べてコメントをあまり書かないので、それほど気が散ることはありません。より多くのmtkクラスをターゲットにする必要があるかもしれません。理由がわかれば、誰かがコメントでこれについて詳しく説明できるかもしれません。

0
Thomas Bishop