web-dev-qa-db-ja.com

Atomの構文強調ガイド

Githubの新しいエディターに非常に満足しています。残念ながら、カスタマイズするのは簡単ではありません。ダウンロード可能なものに満足していないので、独自の構文強調テーマを作成したかった（少なくともJavaではうまくいかないようだ）

これで、スタイルを設定するファイル（構文変数、color.lessなど）は次のようになります。

~/.atom/ .../packages (if you want to change existing themes)

問題は、どの（CSS）クラスが構文のどの要素をスタイルするのかわからないことだけです。たとえば変数型宣言の色を変更する方法を調べることができる場所はありますか？

editorcustomizationsyntax-highlightingatom-editor
17
TomTom

はい、コマンド_atom --dev_またはメニュー_View > Developer > Open in Dev Mode ..._を使用して、開発者モードでAtomを開始できます。 UIを選択し、Webブラウザで行うのと同じように、コンテキストメニューから_Inspect Element_を選択します。

さらに、構文要素については次のことができます。

  1. スタイルを設定するアイテムにテキストカーソルを置きます
  2. 押す Cmd+Alt+P OS Xでは、 Ctrl+Alt+Shift+P 他のプラットフォームの場合、またはコマンドパレットの「エディター：ログカーソルスコープ」を検索して、構文要素のスコープを表示します。

構文要素のスコープは、CSSクラスに直接変換されます。

26
Lee

Ctrl+Shift+I（Linuxでテスト済み）を押して任意の要素を強調表示することで、クロムWebコンソールを使用できます。その後、Edit->Open Your Stylesheetを押してスタイルシートを開き、LESS構文で要素のスタイルを追加します。

例えば：

太字の強調表示クラスと関数名が必要です。クロムコンソールでクラスを選択すると、クラス.nameがあることがわかります。

次のようなスタイルシートファイルを追加する必要があります。

atom-text-editor::shadow .name{
    font-weight: bold
}

また、独自のテーマを作成することもできます。 Atom difficltではありません-Ctrl+Shift+Pを押して"Generate Syntax Theme"と入力します。新しいテーマでは、他のテーマからコードをコピーできます。CSS/ LESSがわからない場合-心配しないでください！新しいテーマのファイルはstyleフォルダーにcolors.lessという名前であり、変更したり、base.lessファイルに新しいカラールールを記述したりできます。

Atomには素晴らしいドキュメントがあり、このページでテーマの作成について読むことができます https://atom.io/docs/v1.4.2/hacking-atom-creating-a-theme

6
Denis Savenko

あなたの言語ではファイルタイプのハイライトが認識されないため、ここに来る他の人には：

  • ~/.atom/config.csonファイルを開きます（Ctrl + Shift + pキーを押して「configを開く」と入力します）

  • たとえば、次のようにcustomFileTypesの下にcoreセクションを追加/編集します。

    core:
  customFileTypes:
    "source.lua": [
      "conf"
    ]
    "text.html.php": [
      "thtml"
    ]

（言語パッケージの設定に言語スコープ名（ "source.lua"、 "text.html.php" ...）があります こちらを参照 ）

1
rubo77