当サイトの記事には広告が含まれている場合があります

ATOMエディタに入れて便利なパッケージ

key_atom-packages
 
最近ATOMエディタに入れて便利だなと思ったパッケージを紹介します。

autoprefixer

自動でベンダープレフィックス対応してくれるパッケージです。
cmd+shift+p(Windowsだとctrl+shift+p)でautoprefixerと呼び出すと必要なベンダープレフィックスを付与してくれます。
01_atom-packages
 

ショートカット登録したい場合は、ツールバーにある「file-kermap」を選択して下記を付け加えるとショートカットキーでプレフィックスを付与してくれるようになります。

'atom-text-editor':
    'cmd-shift-x': 'autoprefixer'

Windowsの場合cmd部分をctrlに書き換えればショートカットキーが設定できます。

'atom-text-editor':
    'ctrl-shift-x': 'autoprefixer'

04_atom-packages
05_atom-packages
 

実際にショートカットキーでパッケージを呼び出すと一瞬で付与してくれます。
06_atom-packages
 

atom-beautify

ソースのネストなどをきれいにしてくれるパッケージです。
minifyされたものを読みやすい形に整えてくれるので便利です。

cssのインデントサイズが初期値4カラムになっていますが個人的には2カラムにしたいのでセッティングでインデントカラム数を変更してからパッケージを実行します。
07_atom-packages
 
右クリックして「Beautify editor contents」を選択するとソースを整えてくれます。
08_atom-packages
 

ショートカットキー「ctrl+alt+o」でもソースを整えてくれます。

split-diff

画面を分割して記述内容で異なる箇所があるか比較してくれるパッケージです。
右クリックして「Sprit Diff-Toggle」を選択すると画面分割されるので、そこに比較したい文字を入力すると違う箇所を色で判別してくれます。

09_atom-packages
 

ショートカットキーは「ctrl+alt+t」です。
 

くるりん

新入社員の頃にシステムエンジニアの会社に入社。その後、WEB制作系の仕事に転職しました。

くるりんをフォローする
パソコンのこと
スポンサーリンク
くるりんをフォローする
Memorandums