テキストエディタ Atom 導入メモ

Atomというエディタがフリー、かつ高機能らしいということを今更ながらに知る。

いまどきはこんなに高機能でかっこいいエディタが無料なんだね!

というわけで便利に使わせてもらっているのです。

そんなAtomのメモを残すよ。

インストール

  1. https://atom.io/ へアクセスし、インストーラをダウンロードする。

    atom_install_001

  2. ダウンロードしたインストーラを実行し、インストールする。

日本語化

  1. メニューバーから「Help」→「Welcome Guide」を選択する。

    atom_settings_001

  2. 右ペインの「Install a Package」を開き「Open Installer」ボタンを押下する。

    atom_settings_002

  3. 入力欄にjapaneseと入力しEnterを押下する。

    atom_settings_003

  4. 検索結果に「japanese-menu」が出てくるので、「Install」ボタンを押下する。

    atom_settings_004

やっておくべき設定

起動時に「Welcome」を開かないようにする

「Welcome」タブの「Show Welcome Guide when opening Atom」のチェックを外す。

atom_settings_005

起動時に「Telemetry Consent」を開かないようにする

「Telemetry Consent」タブの「No, I don’t want to help」ボタンを押下する。

atom_settings_006

エディタで赤い下線を出さないようにする

スペルチェックに引っかかっているのが問題なので、スペルチェックを無効にする。

  1. メニューバーから「ファイル」→「環境設定」を選択する。

    atom_settings_007

  2. 「パッケージ」を選択し、入力欄にspellと入力してEnterを押下する。

  3. コアパッケージに「spell-check」が出てくるので「無効にする」ボタンを押下する。

    atom_settings_008

エディタの縦線(折り返し位置の線)を出さないようにする

  1. メニューバーから「ファイル」→「環境設定」を選択する。
  2. コアパッケージ「wrap-guide」を無効にする。

追加パッケージ

atom-beautify
ソースの整形をしてくれる。
chary-tree-view
ツリー上で、ファイルをダブルクリックしないと開かないようにする。
デフォルトだとシングルクリックでプレビューのタブを開いてしまってうっとおしいが、このパッケージでそれが解消。
ただし open-unsupported-files は対象外(シングルクリックで開いてしまう)。
eclipse-keybindings
eclipse風のキーバインドになる。
emmet
HTMLやCSS等のコーディングをサポートする例のやつ。
file-icons
ツリーやタブに表示されるアイコンを拡張子ごとに変更するなどして見やすくしてくれる。
jquery-snippets
jQueryの補完機能がつく。
less-than-slash
閉じタグを自動で作成してくれる。
markdown-table-formatter
テーブルを自動で綺麗にフォーマットしてくれる。
保存時に自動でフォーマットしてくれるのがミソ。
markdown-writer
markdown記法のサポートをしてくれる。
箇条書き時に改行するだけで「*」をつけてくれたり、そのままTABで簡単にインデントできたりとかなり書きやすくなる。
open-in-browser
任意のファイルを関連付けされたソフトで開くことができる。
open-unsupported-files
ツリー上で、Atomでサポートしていないファイルを選択した場合に、関連付けされたソフトで開くことができる(*.xlsx を選択したらExcelで開ける等)。
open-in-browserがツリーのアイコンクリックに対応してくれないので入れた。
project-manager
プロジェクトの保存や切り替え等が簡単にできるようになる。複数プロジェクトを行ったり来たり切り替える場合に。
symbols-tree-view
Eclipseでいうアウトラインを表示できる。

その他のカスタマイズ

フォントを変更

デフォルトの設定だと日本語がズレまくるので、フォントを変更する。別にMS ゴシックでも良かったけど、どうせならおしゃれなフォントを使いたい。

  1. Ricty Diminishedをダウンロードし、PCにインストールする。
  2. 設定画面の「エディタ設定」を選択し、フォント(font-family)にRicty Diminishedと入力する。

    atom_settings_009

  3. エディタを再起動する。

エディタのスタイルシートの編集

設定画面の「テーマ」で変更できるが、細部をカスタマイズしたい場合は、メニューバーから「ファイル」→「スタイルシート…」を選択し、開いた「style.less」ファイルを編集する。

atom_settings_010

markdown-preview のスタイルの設定

  1. 設定画面の「パッケージ」から markdown-preview を検索し、「設定」ボタンを押下する。

    atom_settings_011

  2. 「Use GitHub.com style」をチェックすることで、GitHub風の見た目になる。

    atom_settings_012

  3. 独自にカスタマイズしたい場合はメニューバーから「ファイル」→「スタイルシート…」を選択し、開いた「style.less」ファイルを編集する。

    atom_settings_013

ツリー上でバージョン管理用ファイルを非表示にする

バージョン管理用のファイル(*.git、*.svn など)がツリー状にあると邪魔なので非表示にしたい場合の設定。

  1. 設定画面の「パッケージ」から tree-view を検索し、「設定」ボタンを押下する。

    atom_settings_014

  2. 「Hide Ignored Names」をチェックすることで、「無視対象に指定されたファイルやフォルダ」がツリー上で非表示になる。

    「Hide VCS Ignored Files」は「.gitignore」などの「バージョン管理対象外のルールを記述してあるファイル」をツリー上に表示したくない場合にチェックする。「.gitignore」をAtom上で編集したい場合はチェックを外しておくこと。

    atom_settings_015

  3. どのファイルやフォルダを無視対象に指定するかの設定は、設定画面の「コア設定」の「無視するファイル」で指定できる。

    atom_settings_016

クリーンインストール(Windowsの場合)

普通にアンインストールしただけでは設定等が残りっぱなしになる。

C:Usersユーザ名.atom を削除してから再インストールすることで初期表示に戻すことができる。

※個人の感想です

  • フォントのアンチエイリアスがガッチリ効くのでWindowsでも文字がとても見やすい。
  • Markdownに標準で対応しており、しかも2ペインでライブプレビューもできる。
    • が、いちいち手動でプレビュー用のタブを開かなければいけなかったり、スクロールの同期ができなかったり、エディタ切替時にプレビューも自動で切り替わったりなどの機能がなく、地味に不便。パッケージを追加してもなお専用のMarkdownエディタには劣る部分も多い。
  • Markdown Extraに対応していない(GitHub Flavored Markdownに対応しているのでテーブルなどは使える)。定義リストの記法に対応していないのは残念。
  • 拡張性が高い。カスタマイズ性も高い。
    • が、LESSやJSONの編集が必要など敷居が高く色々とっつきづらい。
  • パッケージやテーマのインストール方法が簡単。アップデートも簡単。
  • 矩形選択機能がしょぼい。特にマウスでグリっと矩形選択をしたいのにできないのは辛い。対応するパッケージ入れても全角文字入ってると使い物にならないし。
  • 上下左右にペイン分割できる。
    • が、設定画面やエディタを開いたときにどっちに出るのかがよくわからない。その時その時で左に出たり右に出たりする。
  • 少々重め。Eclipseよりは軽い。

デザイン的なカスタマイズ性は高いけど、機能的なカスタマイズ性でいうとイケてそうに見えていながら実は痒いところに手が届かない気がする。

メインのエディタにするには至らない感じ。

いろいろと惜しい…。