参考にしたサイト
- SublimeText から Atom に乗り換えた時にやった設定とインストールしたパッケージ
- Rubocopを使ってコーディングルールへの準拠チェックを自動化
- jshintで嘘のエラーが出た時の対処法
Setting
| 項目 | 内容 | 備考 |
|---|---|---|
| Font Family | 游ゴシック, YuGothic, "Yu Gothic" | Macならデフォルトでもいいので、ときどきWinでも使うので統一してみた |
| Show Invisible | オン | 空白とかタブとかみたいから |
Package
| 項目 | 概要 |
|---|---|
| atom-beautify | コードフォーマッター。様々な言語に対応している。 |
| file-icons | ファイルが言語ごとにアイコンで表示される。 |
| tabs-to-spaces | タブとスペースを変換する。 |
| linter | コード規約チェッカー。これ自体は何もチェックしない。各言語ごとのlintをインストールする必要がある。 |
| linter-htmlhint | html規約チェック |
| htmlhint | html規約チェック |
| linter-csslint | css規約チェック |
| linter-jshint | JavaScript規約チェック |
| linter-rubocop | ruby規約チェック |
| linter-erb | erb規約チェック |
| linter-scss-lint | scss規約チェック |
| linter-coffeelint | CoffeeScript規約チェック |
| linter-php | PHP規約チェック |
設定
atom-beautify
以下をオン。
- Beautify Entire File On Save
- CSS - Force indentation
- CSS - Indent comments
- CSS - Newline between rules
- CSS - No lead zero
- CSS - Preserve newlines
- CSS - Selector separator newline
- HTML - Indent inner html
- HTML - Preserve newlines
- JavaScript - Break chained methods
- JavaScript - End with comma
- JavaScript - Eval code
- JavaScript - Jslint happy
- JavaScript - Keep array indentation
- JavaScript - Keep function indentation
- JavaScript - Preserve newlines
- JavaScript - Space after anon function
- JavaScript - Space before conditional
- JavaScript - Space in paren
- Language Config - CoffeeScript - Beautify On Save
- Language Config - CSS - Beautify On Save
- Language Config - CSV - Beautify On Save
- Language Config - ERB - Beautify On Save
- Language Config - gherkin - Beautify On Save
- Language Config - HTML - Beautify On Save
- Language Config - JavaScript - Beautify On Save
- Language Config - JSON - Beautify On Save
- Language Config - Markdown - Beautify On Save
- Language Config - PHP - Beautify On Save
- Language Config - Ruby - Beautify On Save
- Language Config - Sass - Beautify On Save
- Language Config - SCSS - Beautify On Save
- Language Config - SQL - Beautify On Save
- Language Config - Ruby - Beautify On Save
linter
必要なlintのインストール
gem install rubocop
gem install scss-lint
npm install -g csslint
npm install -g jshint
設定
以下はExecutable Pathを設定。
Pathはコマンドラインからwhich xxxで確認する。
- rubocop
- scss-lint
規約の設定
rubocop
デフォルトのままだと、日本語コメントでエラーがでたりするので、調整。
プロジェクトの直下に.rubocop.ymlを置く。
日本語コメントOKにするのであれば、次のように設定。
# Use only ascii symbols in comments.
AsciiComments:
Enabled: false
jshint(node.jsのとき)
node.jsの場合は、node.jsとしては正しいものにエラーがでるので、調整。
プロジェクトの直下に.jshintrcを置き、"node" : trueを設定する。