Atom カスタマイズ

はじめに

• Windows と Mac で設定を共有したいけれど、固有の設定を判別できるようにしたい。

ステータスバーなどのフォントサイズを変更する

@font-size: 1rem;

html,
body,
.tree-view,
.tooltip,
.tab-bar .tab,
.find-and-replace .find-meta-container,
atom-text-editor[mini],
.btn,
.status-bar,
linter-message {
  font-size: @font-size;
}

プラットフォーム毎に設定を分ける

init.coffee

if platform = document.body.className.match(/platform-(darwin|win32|linux)/)?[1]
  path = require 'path'
  CSON = require path.join atom.getLoadSettings().resourcePath, '/node_modules/season'
  config = CSON.readFileSync atom.config.getUserConfigPath()
  if config[platform]?
    for own scopeSelector, scopeConfig of config[platform]
      for own namespace, namespaceConfig of scopeConfig
        for own key, value of namespaceConfig
          atom.config.set "#{namespace}.#{key}", value, scopeSelector

config.cson

'*':
  'editor':
    'softWrap': true # enable softWrap
'source.python':
  'editor':
    'softWrap': false # except in python files
'darwin':
  '*':
    'editor':
    'softWrap': false # disable softWrap on mac
  'source.python':
    'editor':
    'softWrap': true # except in python files

Packages

Theme

• slack-ui
• zenburn-syntax

Utilities

• atom-alignment
• atom-beautify
• autocomplete-paths
• compare-files
• jumpy
• keybinding-cheatsheet
• maximize-panes
• sort-lines
• Sublime-Style-Column-Selection
• toggle-quotes

View

• block-cursor
• file-icons
• highlight-line

HTML, Markdown

• browser-plus
• color-picker
• emmet
• markdown-preview-plus
• markdown-writer
• pigments

Git

• git-plus
• merge-conflicts

language, programming

• linter
• linter-eslint
• project-manager
• surround-with