Atom/Pulsar の設定

Atom 1.60.0 on Github - atom-windows.zip [推奨]
Pulsar v1.128.0. phpフィアル内のcss補完にバグあり [非推奨]

Core

プロジェクトサイドバーに表示させないものを設定

Ignored Namesに拡張子で指定

*.wav, *.mp3, *.png, *.jpg, *.JPG, *.jpeg, *.psd, *.ai, *.pdf, .git, .hg, .svn, .DS_Store, ._*, Thumbs.db, desktop.ini

Ignored Names を有効にする方法

プロジェクトサイドバーに表示させないファイル指定後にすること

Package > 検索「tree-view」 > Settings > Hide Ignored Names にチェック

新規タブで開く

Allow Pending Pange Itemsのチェックを外す

Editor

インデントの線を表示

Show Indent Guide にチェック

インデントの長さ設定

Tab Length を3に

折り返し設定

これで日本語折返される

Soft Wrap にチェック

折り返しの縦線の位置

Preferred Line Lengthで数値設定 170

そこで折り返す場合はSoft Wrap at Preferred Line にチェック

Keybindings

ショートカットキー編集

keymap.csonを開く

Keybindings > your keymap file というリンクをクリック

Ctrl + Tab での切り替わるタブの順番を変更

タブを1つづつ右へ移動させるように設定するには以下のコードをkeymap.csonへ貼り付ける

'body':
   # ctrl-tabによるタブ順を1つづつ右へ移動させるように設定
   'ctrl-tab ^ctrl': 'unset!'
   'ctrl-tab': 'pane:show-next-item'
   'ctrl-shift-tab ^ctrl': 'unset!'
   'ctrl-shift-tab': 'pane:show-previous-item'

※Ctrl + Shift + Tab で左にひとつづつなる

Packages

無効化するパッケージ

緑矢印の余計なスニペット（補完ワード）を非表示するため。bug,temp,ideaなどうっとおしい場合に有効

language-todo
language-text

さらにスニペットをカスタマイズする場合はCore package の上書きパッケージ作成

Themes

プロジェクトツリー内のファイルアイコンの色を拡張子ごとに変える

[your stylesheet]をクリックしユーザースタイルシートを編集

C:\Users\ユーザー名\.atom\styles.less

.icon-file-text {&[data-name$=".php"]:before      { color:#5e8a6a; content:'\f010';}}
.icon-file-text {&[data-name$=".html"]:before     { color:#916456; content:'\f05f'; }}
.icon-file-text {&[data-name$=".css"]:before      { color:#fff; content:'{}';font-size:12px;}}
.icon-file-text {&[data-name$=".js"]:before       { color:#0865a7; content:'\f00e';}}
.icon-file-text {&[data-name$=".htaccess"]:before { color:#8a8c50; }}
.icon-file-text {&[data-name$=".sql"]:before      { content:'\f096'; }}
.icon-file-text {&[data-name$=".htpasswd"]:before { content:'\f049'; }}
.icon-file-text {&[data-name$=".gitignore"]:before{ content:'\f00a'; }}
.tree-view-root span:after,
.tree-view-root li:after
{font-family: "Octicons Regular";margin-left: 5px;font-size:12px;position: relative;top: 1px;vertical-align: top;}
li.status-modified > span:before        {color:#e2c08d !important;}
li.status-added > span:before           {color:#73c990 !important;}
li.status-modified > span:after         {content:'\f06d';}
li.status-added > span:after            {content:'\f06b';}
.tree-view:focus .selected > span:before{color: #fff ;}

※アイコンを変更できるパッケージfile iconを使うとプロジェクト内フォルダ展開時に多少遅延あり

テーマ開発

Ctrl + Shift + i	Developer Tool	View > Developer > Toggle Developer Tools
Ctrl + Shift + G	Octiconsのアイコン一覧などを確認できる	Styleguide:Show

Install

highlight-selected

ダブルクリックして選択した単語と同じ単語をハイライトさせる

atom-wrap-in-tag

テキストを選択後Shift + Alt + Wでタグで囲える

show-ideographic-space

全角スペースを視覚化するパッケージが保存されるフォルダ

C:\Users\ユーザー名\.atom\packages

Githubとの連携

自分のgithubアカウントからtoken取得

https://github.com/settings/developers

Personal access tokens (classic) > repo,workflow,read:org,user:email　にチェック

Atomにtokenを入れてログイン

Package > GitHub > Toggle GitHub Tab

またはステータスバー内右下のGitHub

Atomでgithubからのログアウト方法

コマンドパレットCtrl + Shift + p からコマンドでログアウトする

GitHub: Logout

ラベル