Skip to content

Instantly share code, notes, and snippets.

@xeoncross
Last active May 3, 2018 16:38
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 1 You must be signed in to fork a gist
  • Save xeoncross/704a2bf4df569104b593e7c10691e8bc to your computer and use it in GitHub Desktop.
Save xeoncross/704a2bf4df569104b593e7c10691e8bc to your computer and use it in GitHub Desktop.
Atom Editor (Atom IDE, Nuclide) Setup for Javascript

Install eslint for NPM

npm install --save-dev eslint babel-eslint eslint-config-airbnb eslint-plugin-import eslint-plugin-jsx-a11y eslint-plugin-react

babel-eslint provides es6 features like arrow functions

If using meteor

npm install eslint-plugin-meteor --save-dev
apm install atom-beautify prettier-atom atom-spotify2 atom-transpose case-keep-replace change-case copy-path duplicate-line-or-selection editorconfig file-icons git-plus highlight-selected local-history project-manager related set-syntax sort-lines sublime-style-column-selection tab-foldername-index sync-settings toggle-quotes atom-wrap-in-tag atom-ternjs autoclose-html autocomplete-modules color-picker docblockr emmet emmet-jsx-css-modules es6-javascript js-hyperclick hyperclick pigments linter-eslint tree-view-copy-relative-path lodash-snippets language-babel react-es7-snippets atom-jest-snippets one-dark-ui

For our uses, we only really need prettier-atom as it will read the .eslintrc.

$ apm install linter linter-eslint prettier-atom

Setup ESLint

vim .eslintrc and insert the following

{
  "extends": "airbnb",
  "parser": "babel-eslint",
  "rules": {
    "no-console": 0,
    "react/jsx-filename-extension": 0,
  }
}

We might also want to add some env so we can use globals like window or $.

  "env": {
    "es6": true,
    "browser": true,
    "node": true,
    "jquery": true,
    "mocha": true
  },

If using meteor we want add that also:

{
  "env": {
    meteor": true
  }
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment